initial commit

app/(root)/(routes)/(auth)/reset/page.tsx

@@ -0,0 +1,86 @@
+'use client'
+import * as z from 'zod'
+import { CardWrapper } from '@/components/auth/card-wrapper'
+import { useForm } from 'react-hook-form'
+import { zodResolver } from '@hookform/resolvers/zod'
+import {
+  Form,
+  FormControl,
+  FormField,
+  FormItem,
+  FormLabel,
+  FormMessage
+} from '@/components/ui/form'
+import { ResetSchema } from '@/schemas'
+import { Input } from '@/components/ui/input'
+import { Button } from '@/components/ui/button'
+
+import { useState, useTransition } from 'react'
+import { reset } from '@/actions/reset'
+import { toast } from 'react-hot-toast'
+
+export default function ResetForm() {
+  const [isPending, startTransition] = useTransition()
+
+  const form = useForm<z.infer<typeof ResetSchema>>({
+    resolver: zodResolver(ResetSchema),
+    defaultValues: {
+      email: ''
+    }
+  })
+
+  const onSubmit = (values: z.infer<typeof ResetSchema>) => {
+    startTransition(() => {
+      reset(values).then((data) => {
+        if (data?.error) {
+          toast.error(data.error)
+        }
+        if (data?.success) {
+          toast.success(data.success)
+          form.reset({ email: '' })
+        }
+      })
+    })
+  }
+
+  return (
+    <CardWrapper
+      headerTitle="Password Reset"
+      backButtonLabel="Back to login"
+      backButtonHref="/login"
+    >
+      <Form {...form}>
+        <form
+          onSubmit={form.handleSubmit(onSubmit)}
+          className="space-y-4 w-full"
+        >
+          <div className="space-y-4">
+            <FormField
+              control={form.control}
+              name="email"
+              render={({ field }) => (
+                <FormItem>
+                  <FormLabel>Email</FormLabel>
+                  <FormControl>
+                    <Input
+                      {...field}
+                      placeholder="tylerdurden@gmail.com"
+                      disabled={isPending}
+                      type="email"
+                      className="bg-background/50 dark:bg-background/30 ring-foreground/5"
+                    />
+                  </FormControl>
+                  <FormMessage className="text-red-500" />
+                </FormItem>
+              )}
+            />
+          </div>
+
+          <Button className="w-full mt-4" disabled={isPending} type="submit">
+            Send Reset Email
+          </Button>
+        </form>
+      </Form>
+    </CardWrapper>
+  )
+}