{metaTitle}

import { Alert, Button, Group, Stepper } from '@mantine/core'; import { useForm } from '@mantine/form'; import { IconArrowLeft, IconKey, IconMailCheck, IconUser, IconUserPlus } from '@tabler/icons-react'; import { GetServerSideProps } from 'next'; import { useTranslation } from 'next-i18next'; import Head from 'next/head'; import Link from 'next/link'; import { useState } from 'react'; import { z } from 'zod'; import { CreateAccountStep, createAccountStepValidationSchema, } from '~/components/Manage/User/Create/create-account-step'; import { ReviewInputStep } from '~/components/Manage/User/Create/review-input-step'; import { CreateAccountSecurityStep, createAccountSecurityStepValidationSchema, } from '~/components/Manage/User/Create/security-step'; import { ManageLayout } from '~/components/layout/Templates/ManageLayout'; import { getServerAuthSession } from '~/server/auth'; import { getServerSideTranslations } from '~/tools/server/getServerSideTranslations'; import { checkForSessionOrAskForLogin } from '~/tools/server/loginBuilder'; import { manageNamespaces } from '~/tools/server/translation-namespaces'; import { useI18nZodResolver } from '~/utils/i18n-zod-resolver'; const CreateNewUserPage = () => { const { t } = useTranslation('manage/users/create'); const [active, setActive] = useState(0); const nextStep = () => setActive((current) => (current < 3 ? current + 1 : current)); const prevStep = () => setActive((current) => (current > 0 ? current - 1 : current)); const { i18nZodResolver } = useI18nZodResolver(); const form = useForm({ initialValues: { account: { username: '', eMail: '', }, security: { password: '', }, }, validate: i18nZodResolver(createAccountSchema), }); const metaTitle = `${t('metaTitle')} • Homarr`; return ( {metaTitle} } label={t('steps.account.title')} description={t('steps.account.text')} > { form.setFieldValue('account', value); nextStep(); }} /> } label={t('steps.security.title')} description={t('steps.security.text')} > { form.setFieldValue('security', value); nextStep(); }} prevStep={prevStep} /> } label={t('steps.finish.title')} description={t('steps.finish.title')} > {t('steps.completed.alert.text')} ); }; const createAccountSchema = z.object({ account: createAccountStepValidationSchema, security: createAccountSecurityStepValidationSchema, }); export type CreateAccountSchema = z.infer; export const getServerSideProps: GetServerSideProps = async (ctx) => { const session = await getServerAuthSession(ctx); const result = checkForSessionOrAskForLogin(ctx, session, () => session?.user.isAdmin == true); if (result) { return result; } const translations = await getServerSideTranslations( [...manageNamespaces, 'password-requirements'], ctx.locale, ctx.req, ctx.res ); return { props: { ...translations, }, }; }; export default CreateNewUserPage;