feat: implement register

This commit is contained in:
Derrick Hammer 2024-03-13 19:06:50 -04:00
parent 7b645666f6
commit 0d7215ff66
Signed by: pcfreak30
GPG Key ID: C997C339BE476FF2
2 changed files with 50 additions and 14 deletions

View File

@ -10,6 +10,13 @@ export type AuthFormRequest = {
rememberMe: boolean; rememberMe: boolean;
} }
export type RegisterFormRequest = {
email: string;
password: string;
firstName: string;
lastName: string;
}
export class PortalAuthProvider implements RequiredAuthProvider { export class PortalAuthProvider implements RequiredAuthProvider {
private apiUrl: string; private apiUrl: string;
private sdk: Sdk; private sdk: Sdk;
@ -61,8 +68,14 @@ export class PortalAuthProvider implements RequiredAuthProvider {
return {logout: true}; return {logout: true};
} }
async register(params: any): Promise<AuthActionResponse> { async register(params: RegisterFormRequest): Promise<AuthActionResponse> {
return {success: true}; const ret = await this.sdk.account().register({
email: params.email,
password: params.password,
first_name: params.firstName,
last_name: params.lastName,
});
return {success: ret, redirectTo: ret ? "/dashboard" : undefined};
} }
async forgotPassword(params: any): Promise<AuthActionResponse> { async forgotPassword(params: any): Promise<AuthActionResponse> {

View File

@ -1,14 +1,16 @@
import type { MetaFunction } from "@remix-run/node"; import type { MetaFunction } from "@remix-run/node"
import { Link } from "@remix-run/react"; import { Link } from "@remix-run/react"
import { Button } from "~/components/ui/button"; import { Button } from "~/components/ui/button"
import logoPng from "~/images/lume-logo.png?url"; import logoPng from "~/images/lume-logo.png?url"
import lumeColorLogoPng from "~/images/lume-color-logo.png?url"; import lumeColorLogoPng from "~/images/lume-color-logo.png?url"
import discordLogoPng from "~/images/discord-logo.png?url"; import discordLogoPng from "~/images/discord-logo.png?url"
import lumeBgPng from "~/images/lume-bg-image.png?url"; import lumeBgPng from "~/images/lume-bg-image.png?url"
import { Field, FieldCheckbox } from "~/components/forms"; import { Field, FieldCheckbox } from "~/components/forms"
import { getFormProps, useForm } from "@conform-to/react"; import { getFormProps, useForm } from "@conform-to/react"
import { z } from "zod"; import { z } from "zod"
import { getZodConstraint, parseWithZod } from "@conform-to/zod"; import { getZodConstraint, parseWithZod } from "@conform-to/zod"
import {useLogin, useRegister} from "@refinedev/core";
import {AuthFormRequest, RegisterFormRequest} from "~/data/auth-provider.js";
export const meta: MetaFunction = () => { export const meta: MetaFunction = () => {
return [{ title: "Sign Up" }]; return [{ title: "Sign Up" }];
@ -41,12 +43,33 @@ const RegisterSchema = z
}); });
export default function Register() { export default function Register() {
const register = useRegister<RegisterFormRequest>()
const login = useLogin<AuthFormRequest>();
const [form, fields] = useForm({ const [form, fields] = useForm({
id: "register", id: "register",
constraint: getZodConstraint(RegisterSchema), constraint: getZodConstraint(RegisterSchema),
onValidate({ formData }) { onValidate({ formData }) {
return parseWithZod(formData, { schema: RegisterSchema }); return parseWithZod(formData, { schema: RegisterSchema });
}, },
onSubmit(e) {
e.preventDefault();
const data = Object.fromEntries(new FormData(e.currentTarget).entries());
register.mutate({
email: data.email.toString(),
password: data.password.toString(),
firstName: data.firstName.toString(),
lastName: data.lastName.toString(),
}, {
onSuccess: () => {
login.mutate({
email: data.email.toString(),
password: data.password.toString(),
rememberMe: false,
})
}
})
}
}); });
return ( return (