Cutlery/Kyoo
1
0
Fork 0
mirror of https://github.com/zoriya/Kyoo.git synced 2025-05-24 02:02:36 -04:00
Code Issues Packages Projects Releases Wiki Activity

Cleanup setup page layout

Browse Source
This commit is contained in:
Zoe Roux 2024-05-26 15:49:10 +02:00
parent 97e3257aee
commit cdf482ac4a
No known key found for this signature in database
2 changed files with 30 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

46
front/packages/ui/src/errors/setup.tsx
View File

@ -5,27 +5,39 @@ import { Main } from "@expo/html-elements";
import { useYoshiki } from "yoshiki/native";
import Register from "@material-symbols/svg-400/rounded/app_registration.svg";
import { Navbar, NavbarProfile } from "../navbar";
import { useEffect } from "react";
import { useRouter } from "solito/router";
export const SetupPage: QueryPage<{ step: Exclude<SetupStep, SetupStep.Done> }> = ({ step }) => {
export const SetupPage: QueryPage<{ step: SetupStep }> = ({ step }) => {
const { css } = useYoshiki();
const { t } = useTranslation();
const router = useRouter();
const isValid = Object.values(SetupStep).includes(step) && step !== SetupStep.Done;
useEffect(() => {
if (!isValid) router.replace("/");
}, [isValid, router]);
if (!isValid) return <P>Loading...</P>;
return (
<>
<Navbar left={null} right={<NavbarProfile />} />
<Main
{...css({ flexGrow: 1, flexShrink: 1, justifyContent: "center", alignItems: "center" })}
>
<P>{t(`errors.setup.${step}`)}</P>
{step === SetupStep.MissingAdminAccount && (
<Button
as={Link}
href={"/register"}
text={t("login.register")}
licon={<Icon icon={Register} {...css({ marginRight: ts(2) })} />}
/>
)}
</Main>
</>
<Main {...css({ flexGrow: 1, flexShrink: 1, justifyContent: "center", alignItems: "center" })}>
<P>{t(`errors.setup.${step}`)}</P>
{step === SetupStep.MissingAdminAccount && (
<Button
as={Link}
href={"/register"}
text={t("login.register")}
licon={<Icon icon={Register} {...css({ marginRight: ts(2) })} />}
/>
)}
</Main>
);
};
SetupPage.getLayout = ({ page }) => (
<>
<Navbar left={null} right={<NavbarProfile />} />
{page}
</>
);

2
front/packages/ui/src/navbar/index.tsx
View File

@ -172,7 +172,7 @@ export const Navbar = ({
left,
right,
...props
}: { left?: ReactElement | null; right?: ReactElement | null }) => {
}: { left?: ReactElement | null; right?: ReactElement | null } & Stylable) => {
const { css } = useYoshiki();
const { t } = useTranslation();