Files
medreport_mrb2b/app/(public)/register-company/page.tsx

105 lines
3.5 KiB
TypeScript

'use client';
import React from 'react';
import { useRouter } from 'next/navigation';
import { MedReportLogo } from '@/components/med-report-title';
import { SubmitButton } from '@/components/ui/submit-button';
import { sendCompanyOfferEmail } from '@/lib/services/mailer.service';
import { submitCompanyRegistration } from '@/lib/services/register-company.service';
import { CompanySubmitData } from '@/lib/types/company';
import { companySchema } from '@/lib/validations/companySchema';
import { zodResolver } from '@hookform/resolvers/zod';
import { useForm } from 'react-hook-form';
import { useTranslation } from 'react-i18next';
import { FormItem } from '@kit/ui/form';
import { Input } from '@kit/ui/input';
import { Label } from '@kit/ui/label';
import { Trans } from '@kit/ui/trans';
export default function RegisterCompany() {
const router = useRouter();
const {
register,
handleSubmit,
formState: { errors, isValid, isSubmitting },
} = useForm({
resolver: zodResolver(companySchema),
mode: 'onChange',
});
const language = useTranslation().i18n.language;
async function onSubmit(data: CompanySubmitData) {
const formData = new FormData();
Object.entries(data).forEach(([key, value]) => {
if (value !== undefined) formData.append(key, value);
});
try {
await submitCompanyRegistration(formData);
sendCompanyOfferEmail(data, language)
.then(() => router.push('/register-company/success'))
.catch((error) => alert('error: ' + error));
} catch (err: unknown) {
if (err instanceof Error) {
alert('Server validation error: ' + err.message);
}
alert('Server validation error');
}
}
return (
<div className="border-border flex max-w-5xl flex-row overflow-hidden rounded-3xl border">
<div className="flex w-1/2 flex-col px-12 py-14 text-center">
<MedReportLogo />
<h1 className="pt-8">
<Trans i18nKey={'account:requestCompanyAccount:title'} />
</h1>
<p className="text-muted-foreground pt-2 text-sm">
<Trans i18nKey={'account:requestCompanyAccount:description'} />
</p>
<form
onSubmit={handleSubmit(onSubmit)}
noValidate
className="flex flex-col gap-6 px-6 pt-8 text-left"
>
<FormItem>
<Label>
<Trans i18nKey={'common:formField:companyName'} />
</Label>
<Input {...register('companyName')} />
</FormItem>
<FormItem>
<Label>
<Trans i18nKey={'common:formField:contactPerson'} />
</Label>
<Input {...register('contactPerson')} />
</FormItem>
<FormItem>
<Label>
<Trans i18nKey={'common:formField:email'} />
</Label>
<Input type="email" {...register('email')}></Input>
</FormItem>
<FormItem>
<Label>
<Trans i18nKey={'common:formField:phone'} />
</Label>
<Input type="tel" {...register('phone')} />
</FormItem>
<SubmitButton
disabled={!isValid || isSubmitting}
pendingText="Saatmine..."
type="submit"
>
<Trans i18nKey={'account:requestCompanyAccount:button'} />
</SubmitButton>
</form>
</div>
<div className="w-1/2 min-w-[460px] bg-[url(/assets/med-report-logo-big.png)] bg-cover bg-center bg-no-repeat"></div>
</div>
);
}