field added

This commit is contained in:
brkcvn 2023-11-15 15:37:27 +03:00
parent 9263d1063c
commit 6492c4483e
2 changed files with 114 additions and 94 deletions

View File

@ -11,104 +11,120 @@ let emailError: string | null = null;
let passwordError: string | null = null; let passwordError: string | null = null;
export default function RegisterPage() { export default function RegisterPage() {
async function handleSubmit(data: FormData) { async function handleSubmit(data: FormData) {
'use server'; 'use server';
const res = await createCustomer({ const res = await createCustomer({
variables: { variables: {
input: { input: {
email: data.get('email') as string, email: data.get('email') as string,
password: data.get('password') as string, password: data.get('password') as string,
}, firstName: data.get('firstname') as string,
}, lastName: data.get('lastname') as string
}); }
}
});
if (res.body.data.customerCreate.customer) { if (res.body.data.customerCreate.customer) {
const loginRes = await loginCustomer({ const loginRes = await loginCustomer({
variables: { variables: {
input: { input: {
email: data.get('email') as string, email: data.get('email') as string,
password: data.get('password') as string, password: data.get('password') as string,
}, }
}, }
}); });
if ( if (loginRes.body.data.customerAccessTokenCreate.customerAccessToken?.accessToken) {
loginRes.body.data.customerAccessTokenCreate.customerAccessToken cookies().set({
?.accessToken name: 'customerAccessToken',
) { value: loginRes.body.data.customerAccessTokenCreate.customerAccessToken.accessToken,
cookies().set({ httpOnly: true,
name: 'customerAccessToken', path: '/',
value: expires: new Date(Date.now() + 20 * 60 * 1000 + 5 * 1000)
loginRes.body.data.customerAccessTokenCreate.customerAccessToken });
.accessToken, redirect('/account');
httpOnly: true, }
path: '/',
expires: new Date(Date.now() + 20 * 60 * 1000 + 5 * 1000),
});
redirect('/account');
}
redirect('/account/login'); redirect('/account/login');
} }
if (res.body.data.customerCreate.customerUserErrors.length > 0) { if (res.body.data.customerCreate.customerUserErrors.length > 0) {
res.body.data.customerCreate.customerUserErrors.filter((error: any) => { res.body.data.customerCreate.customerUserErrors.filter((error: any) => {
if (error.field.includes('email')) { if (error.field.includes('email')) {
emailError = error.message; emailError = error.message;
} }
if (error.field.includes('password')) { if (error.field.includes('password')) {
passwordError = error.message; passwordError = error.message;
} }
}); });
} }
revalidatePath('/account/register'); revalidatePath('/account/register');
} }
return ( return (
<AuthLayout> <AuthLayout>
<FormHeader title="Create an Account" /> <FormHeader title="Create an Account" />
<form <form action={handleSubmit} noValidate className="mb-4 mt-4 space-y-3 pb-8 pt-6">
action={handleSubmit} <div>
noValidate <input
className="pt-6 pb-8 mt-4 mb-4 space-y-3" className={`mb-1`}
> id="firstname"
<div> name="firstname"
<input type="text"
className={`mb-1`} required
id="email" placeholder="First Name"
name="email" aria-label="First Name"
type="email" autoFocus
autoComplete="email" />
required </div>
placeholder="Email address"
aria-label="Email address" <div>
autoFocus <input
/> className={`mb-1`}
{emailError && ( id="lastname"
<p className="text-red-500 text-xs">{emailError} &nbsp;</p> name="lastname"
)} type="text"
</div> autoComplete="email"
<div> required
<input placeholder="Last Name"
className={`mb-1`} aria-label="Last Name"
id="password" autoFocus
name="password" />
type="password" </div>
autoComplete="current-password"
placeholder="Password" <div>
aria-label="Password" <input
minLength={8} className={`mb-1`}
required id="email"
autoFocus name="email"
/> type="email"
{passwordError && ( autoComplete="email"
<p className="text-red-500 text-xs"> {passwordError} &nbsp;</p> required
)} placeholder="Email address"
</div> aria-label="Email address"
<FormButton btnText="Create Account" /> autoFocus
<FormFooter page="register" /> />
</form> {emailError && <p className="text-xs text-red-500">{emailError} &nbsp;</p>}
</AuthLayout> </div>
); <div>
<input
className={`mb-1`}
id="password"
name="password"
type="password"
autoComplete="current-password"
placeholder="Password"
aria-label="Password"
minLength={8}
required
autoFocus
/>
{passwordError && <p className="text-xs text-red-500"> {passwordError} &nbsp;</p>}
</div>
<FormButton btnText="Create Account" />
<FormFooter page="register" />
</form>
</AuthLayout>
);
} }

View File

@ -301,6 +301,8 @@ export async function createCustomer({
input: { input: {
email: string; email: string;
password: string; password: string;
firstName: string;
lastName: string;
}; };
}; };
}) { }) {
@ -312,6 +314,8 @@ export async function createCustomer({
input: { input: {
email: string; email: string;
password: string; password: string;
firstName: string;
lastName: string;
}; };
}; };
}>({ }>({