Fix bug on register
This commit is contained in:
parent
e2a8b208bc
commit
5d8afc7c0f
|
|
@ -1,6 +1,10 @@
|
||||||
"use client";
|
"use client";
|
||||||
|
|
||||||
import createUser from "@/modules/auth/actions/createUser";
|
import createUserAction from "@/modules/auth/actions/createUserAction";
|
||||||
|
import createUser from "@/modules/auth/actions/createUserAction";
|
||||||
|
import { CreateUserSchema } from "@/modules/auth/formSchemas/CreateUserFormSchema";
|
||||||
|
import DashboardError from "@/modules/dashboard/errors/DashboardError";
|
||||||
|
import withServerAction from "@/modules/dashboard/utils/withServerAction";
|
||||||
import {
|
import {
|
||||||
Paper,
|
Paper,
|
||||||
PasswordInput,
|
PasswordInput,
|
||||||
|
|
@ -12,65 +16,53 @@ import {
|
||||||
Button,
|
Button,
|
||||||
} from "@mantine/core";
|
} from "@mantine/core";
|
||||||
import { useForm } from "@mantine/form";
|
import { useForm } from "@mantine/form";
|
||||||
|
import { showNotification } from "@mantine/notifications";
|
||||||
import React, { useEffect, useState } from "react";
|
import React, { useEffect, useState } from "react";
|
||||||
|
|
||||||
export interface RegisterFormSchema {
|
|
||||||
email: string;
|
|
||||||
password: string;
|
|
||||||
passwordConfirmation: string;
|
|
||||||
name: string;
|
|
||||||
}
|
|
||||||
|
|
||||||
export default function RegisterPage() {
|
export default function RegisterPage() {
|
||||||
const [errorMessage, setErrorMessage] = useState("");
|
const [errorMessage, setErrorMessage] = useState("");
|
||||||
|
|
||||||
const form = useForm<RegisterFormSchema>({
|
const form = useForm<CreateUserSchema>({
|
||||||
initialValues: {
|
initialValues: {
|
||||||
email: "",
|
email: "",
|
||||||
password: "",
|
plainPassword: "",
|
||||||
passwordConfirmation: "",
|
plainPasswordConfirmation: "",
|
||||||
name: "",
|
name: "",
|
||||||
},
|
},
|
||||||
validate: {
|
validate: {
|
||||||
email: (value: string) =>
|
email: (value: string) =>
|
||||||
/^\S+@\S+$/.test(value) ? null : "Invalid email",
|
/^\S+@\S+$/.test(value) ? null : "Invalid email",
|
||||||
password: (value: string) =>
|
plainPassword: (value: string) =>
|
||||||
value.length >= 6
|
value.length >= 6
|
||||||
? null
|
? null
|
||||||
: "Password should be at least 6 characters",
|
: "Password should be at least 6 characters",
|
||||||
passwordConfirmation: (value: string, values: RegisterFormSchema) =>
|
plainPasswordConfirmation: (value: string, values: CreateUserSchema) =>
|
||||||
value === values.password ? null : "Passwords should match",
|
value === values.plainPassword ? null : "Passwords should match",
|
||||||
name: (value: string) =>
|
name: (value: string) =>
|
||||||
value.length > 0 ? null : "Name is required",
|
value.length > 0 ? null : "Name is required",
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
const handleSubmit = async (values: RegisterFormSchema) => {
|
const handleSubmit = async (values: CreateUserSchema) => {
|
||||||
const formData = new FormData();
|
withServerAction(createUserAction, form.values)
|
||||||
Object.entries(values).forEach(([key, value]) => {
|
.then((response) => {
|
||||||
formData.append(key, value);
|
showNotification({message: "Register Success", color: "green"})
|
||||||
});
|
})
|
||||||
|
.catch((e) => {
|
||||||
const response = await createUser(formData);
|
if (e instanceof DashboardError) {
|
||||||
|
if (e.errorCode === "INVALID_FORM_DATA") {
|
||||||
if (!response.success) {
|
form.setErrors(e.formErrors ?? {});
|
||||||
setErrorMessage(response.error.message);
|
} else {
|
||||||
|
setErrorMessage(`ERROR: ${e.message} (${e.errorCode})`);
|
||||||
if (response.error.errors) {
|
}
|
||||||
const errors = Object.entries(response.error.errors).reduce(
|
} else if (e instanceof Error) {
|
||||||
(prev, [k, v]) => {
|
setErrorMessage(`ERROR: ${e.message}`);
|
||||||
prev[k] = v[0];
|
} else {
|
||||||
return prev;
|
setErrorMessage(
|
||||||
},
|
`Unkown error is occured. Please contact administrator`
|
||||||
{} as { [k: string]: string }
|
);
|
||||||
);
|
}
|
||||||
|
})
|
||||||
form.setErrors(errors);
|
|
||||||
console.log(form.errors);
|
|
||||||
} else {
|
|
||||||
form.clearErrors();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
};
|
};
|
||||||
|
|
||||||
return (
|
return (
|
||||||
|
|
@ -102,14 +94,14 @@ export default function RegisterPage() {
|
||||||
placeholder="Your password"
|
placeholder="Your password"
|
||||||
name="password"
|
name="password"
|
||||||
autoComplete="new-password"
|
autoComplete="new-password"
|
||||||
{...form.getInputProps("password")}
|
{...form.getInputProps("plainPassword")}
|
||||||
/>
|
/>
|
||||||
<PasswordInput
|
<PasswordInput
|
||||||
label="Repeat Password"
|
label="Repeat Password"
|
||||||
placeholder="Repeat yout password"
|
placeholder="Repeat yout password"
|
||||||
name="passwordConfirmation"
|
name="passwordConfirmation"
|
||||||
autoComplete="new-password"
|
autoComplete="new-password"
|
||||||
{...form.getInputProps("passwordConfirmation")}
|
{...form.getInputProps("plainPasswordConfirmation")}
|
||||||
/>
|
/>
|
||||||
</Stack>
|
</Stack>
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -1,43 +0,0 @@
|
||||||
"use server";
|
|
||||||
import { z } from "zod";
|
|
||||||
import prisma from "@/core/db";
|
|
||||||
import { cookies } from "next/headers";
|
|
||||||
import { redirect } from "next/navigation";
|
|
||||||
import { hashPassword } from "../utils/hashPassword";
|
|
||||||
import { createJwtToken } from "../utils/createJwtToken";
|
|
||||||
import createUser from "../services/createUser";
|
|
||||||
|
|
||||||
/**
|
|
||||||
* Creates a new user in the system.
|
|
||||||
*
|
|
||||||
* @param formData - The form data containing user details.
|
|
||||||
* @returns An object indicating the result of the operation.
|
|
||||||
*/
|
|
||||||
export default async function createUserAction(formData: FormData) {
|
|
||||||
//TODO: Add Throttling
|
|
||||||
//TODO: Add validation check if the user is already logged in
|
|
||||||
|
|
||||||
try {
|
|
||||||
const parsedData = {
|
|
||||||
email: formData.get("email")?.toString() ?? "",
|
|
||||||
name: formData.get("name")?.toString() ?? "",
|
|
||||||
plainPassword: formData.get("password")?.toString() ?? "",
|
|
||||||
plainPasswordConfirmation:
|
|
||||||
formData.get("passwordConfirmation")?.toString() ?? "",
|
|
||||||
};
|
|
||||||
await createUser(parsedData);
|
|
||||||
redirect("/dashboard");
|
|
||||||
} catch (e: unknown) {
|
|
||||||
// Handle unexpected errors
|
|
||||||
console.error(e);
|
|
||||||
//@ts-ignore
|
|
||||||
console.log(e.message);
|
|
||||||
return {
|
|
||||||
success: false,
|
|
||||||
error: {
|
|
||||||
message:
|
|
||||||
"An unexpected error occurred on the server. Please try again or contact the administrator.",
|
|
||||||
},
|
|
||||||
};
|
|
||||||
}
|
|
||||||
}
|
|
||||||
29
src/modules/auth/actions/createUserAction.ts
Normal file
29
src/modules/auth/actions/createUserAction.ts
Normal file
|
|
@ -0,0 +1,29 @@
|
||||||
|
"use server";
|
||||||
|
import { z } from "zod";
|
||||||
|
import prisma from "@/core/db";
|
||||||
|
import { cookies } from "next/headers";
|
||||||
|
import { redirect } from "next/navigation";
|
||||||
|
import { hashPassword } from "../utils/hashPassword";
|
||||||
|
import { createJwtToken } from "../utils/createJwtToken";
|
||||||
|
import createUser from "../services/createUser";
|
||||||
|
import ServerResponseAction from "@/modules/dashboard/types/ServerResponseAction";
|
||||||
|
import handleCatch from "@/modules/dashboard/utils/handleCatch";
|
||||||
|
import { CreateUserSchema } from "../formSchemas/CreateUserFormSchema";
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Creates a new user in the system.
|
||||||
|
*
|
||||||
|
* @param formData - The form data containing user details.
|
||||||
|
* @returns An object indicating the result of the operation.
|
||||||
|
*/
|
||||||
|
export default async function createUserAction(formData: CreateUserSchema): Promise<ServerResponseAction> {
|
||||||
|
//TODO: Add Throttling
|
||||||
|
//TODO: Add validation check if the user is already logged in
|
||||||
|
|
||||||
|
try {
|
||||||
|
await createUser(formData);
|
||||||
|
redirect("/dashboard");
|
||||||
|
} catch (e) {
|
||||||
|
return handleCatch(e)
|
||||||
|
}
|
||||||
|
}
|
||||||
Loading…
Reference in New Issue
Block a user