diff --git a/app/auth/components/auth-form.tsx b/app/auth/components/auth-form.tsx index 5b0e7c3..b0ea081 100644 --- a/app/auth/components/auth-form.tsx +++ b/app/auth/components/auth-form.tsx @@ -2,10 +2,10 @@ import { useState, ReactNode, PropsWithoutRef } from "react"; import { FormProvider, useForm, UseFormProps } from "react-hook-form"; import { zodResolver } from "@hookform/resolvers/zod"; import { z } from "zod"; -import Alert from "../../core/components/alert"; import clsx from "clsx"; -import Logo from "../../core/components/logo"; -import { Link, Routes } from "blitz"; + +import Alert from "app/core/components/alert"; +import Logo from "app/core/components/logo"; export interface FormProps> extends Omit, "onSubmit"> { diff --git a/app/core/components/form.tsx b/app/core/components/form.tsx deleted file mode 100644 index 0064a41..0000000 --- a/app/core/components/form.tsx +++ /dev/null @@ -1,84 +0,0 @@ -import { useState, ReactNode, PropsWithoutRef } from "react"; -import { FormProvider, useForm, UseFormProps } from "react-hook-form"; -import { zodResolver } from "@hookform/resolvers/zod"; -import { z } from "zod"; - -export interface FormProps> - extends Omit, "onSubmit"> { - /** All your form fields */ - children?: ReactNode; - /** Text to display in the submit button */ - submitText?: string; - schema?: S; - onSubmit: (values: z.infer) => Promise; - initialValues?: UseFormProps>["defaultValues"]; -} - -interface OnSubmitResult { - FORM_ERROR?: string; - - [prop: string]: any; -} - -export const FORM_ERROR = "FORM_ERROR"; - -export function Form>({ - children, - submitText, - schema, - initialValues, - onSubmit, - ...props -}: FormProps) { - const ctx = useForm>({ - mode: "onBlur", - resolver: schema ? zodResolver(schema) : undefined, - defaultValues: initialValues, - }); - const [formError, setFormError] = useState(null); - - return ( - -
{ - const result = (await onSubmit(values)) || {}; - for (const [key, value] of Object.entries(result)) { - if (key === FORM_ERROR) { - setFormError(value); - } else { - ctx.setError(key as any, { - type: "submit", - message: value, - }); - } - } - })} - className="form" - {...props} - > - {/* Form fields supplied as children are rendered here */} - {children} - - {formError && ( -
- {formError} -
- )} - - {submitText && ( - - )} - - -
-
- ); -} - -export default Form;