From 393fda97108c404e3b7909f2991d0f83a260df37 Mon Sep 17 00:00:00 2001
From: Juan Di Toro <ditorojuanf@gmail.com>
Date: Tue, 5 Mar 2024 20:16:05 +0100
Subject: [PATCH] fix

---
 app/components/ui/checkbox.tsx |   2 +-
 app/images/.DS_Store           | Bin 6148 -> 0 bytes
 app/routes/_index.tsx          |  13 ++++++++++---
 3 files changed, 11 insertions(+), 4 deletions(-)
 delete mode 100644 app/images/.DS_Store

diff --git a/app/components/ui/checkbox.tsx b/app/components/ui/checkbox.tsx
index d52e51f..92d051a 100644
--- a/app/components/ui/checkbox.tsx
+++ b/app/components/ui/checkbox.tsx
@@ -7,7 +7,7 @@ import { cn } from "~/utils"
 const Checkbox = React.forwardRef<
   React.ElementRef<typeof CheckboxPrimitive.Root>,
   React.ComponentPropsWithoutRef<typeof CheckboxPrimitive.Root> & {
-    className: string
+    className?: string
   }
 >(({ className, ...props }, ref) => (
   <CheckboxPrimitive.Root
diff --git a/app/images/.DS_Store b/app/images/.DS_Store
deleted file mode 100644
index 80037c8ba2a5b68eee7620565f0c988075d03a1a..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 6148
zcmeHK%}N6?5dKDcD2TA&#hZBn1)spR)PrYVK-x+XR#z&$=j<c;GWyMr+TtpB5s?|l
ze6z{SB>7;I3;>y|7pFi2V9cf{Y7B^W4-V~w^Da>=M~@X2I7WwlAkkm!(zQ2S^DQ1R
z=c+%}zvR~m9&nH4W!KMVT|YBl$Pw}BC4}|?_q)a&Zn$&Jp}SuN3*TpX-pI1Qkwr6n
z8HsbwdFGL{Qj&pWAQ?yol7XKwz&l%IyyuuY8At|_fp-S<d?;*+ZD4h@ql3yy0OE+<
zCbYGd(3ld~23ALoP{c!t9x72{h=;SkgkKw29X%Wp#fQYqZ^et)?95-x9nw0cP6m>J
zZ3eXVr8Ii~U+|Y1Eb`4IRWgta{8t8KG`*TmxVyMpKkZZR+QN3trlNjT4GQh8M*u(c
g967W>A1`XtuMMn@nnn99oR|**BP3Na@CyvQ0)AaV5C8xG

diff --git a/app/routes/_index.tsx b/app/routes/_index.tsx
index 15b3950..5b15861 100644
--- a/app/routes/_index.tsx
+++ b/app/routes/_index.tsx
@@ -6,6 +6,7 @@ import lumeColorLogoPng from "~/images/lume-color-logo.png?url"
 import discordLogoPng from "~/images/discord-logo.png?url"
 import lumeBgPng from "~/images/lume-bg-image.png?url"
 import { Field, FieldCheckbox } from "~/components/forms"
+import { useForm } from "@conform-to/react"
 
 export const meta: MetaFunction = () => {
   return [
@@ -15,6 +16,9 @@ export const meta: MetaFunction = () => {
 }
 
 export default function Index() {
+  const [form, fields] = useForm({
+    id: "login"
+  })
   return (
     <div className="p-10 h-screen relative overflow-clip">
       <header>
@@ -23,16 +27,19 @@ export default function Index() {
       <form className="w-full p-2 max-w-md space-y-4 mt-12 bg-background">
         <h2 className="text-3xl font-bold !mb-12">Welcome back! 🎉</h2>
         <Field
-          inputProps={{ name: "email" }}
+          inputProps={{ name: fields.email.name }}
           labelProps={{ children: "Email" }}
+          errors={fields.email.errors}
         />
         <Field
-          inputProps={{ name: "password", type: "password" }}
+          inputProps={{ name: fields.password.name, type: "password" }}
           labelProps={{ children: "Password" }}
+          errors={fields.password.errors}
         />
         <FieldCheckbox 
-          inputProps={{ name: "rememberMe" }}
+          inputProps={{ name: fields.rememberMe.name, form: form.id }}
           labelProps={{ children: "Remember Me" }}
+          errors={fields.rememberMe.errors}
         />
         <Button className="w-full h-14">Login</Button>
         <p className="text-input-placeholder">