fix loading

apps/saladeaula.digital/app/routes/settings/emails/primary.tsx

@@ -22,6 +22,7 @@ import type { User } from '@repo/ui/routes/users/data'
 
 import type { Email } from './data'
 import { type Schema, formSchema } from './add'
+import { Spinner } from '@repo/ui/components/ui/spinner'
 
 export function Primary({ items = [] }: { items: Email[] }) {
   const emails = items.map((props) => {
@@ -59,7 +60,7 @@ export function Primary({ items = [] }: { items: Email[] }) {
     { manual: true }
   )
 
-  const { handleSubmit, register } = useForm({
+  const { handleSubmit, register, formState } = useForm({
     resolver: zodResolver(formSchema)
   })
 
@@ -83,19 +84,29 @@ export function Primary({ items = [] }: { items: Email[] }) {
         </CardDescription>
       </CardHeader>
       <CardContent>
-        <form onSubmit={handleSubmit(onSubmit)} className="flex gap-1.5">
-          <NativeSelect defaultValue={primary?.email} {...register('email')}>
-            {emails.map(({ email }) => {
-              return (
-                <NativeSelectOption key={email} value={email}>
-                  {email}
-                </NativeSelectOption>
-              )
-            })}
-          </NativeSelect>
-          <Button type="submit" className="overflow-hidden cursor-pointer">
-            Alterar email
-          </Button>
+        <form onSubmit={handleSubmit(onSubmit)}>
+          <fieldset disabled={formState.isSubmitting} className="flex gap-1.5">
+            <NativeSelect defaultValue={primary?.email} {...register('email')}>
+              {emails.map(({ email }) => {
+                return (
+                  <NativeSelectOption key={email} value={email}>
+                    {email}
+                  </NativeSelectOption>
+                )
+              })}
+            </NativeSelect>
+            <Button
+              type="submit"
+              className="overflow-hidden cursor-pointer relative"
+            >
+              {formState.isSubmitting && (
+                <div className="absolute inset-0 bg-lime-500 flex items-center justify-center">
+                  <Spinner />
+                </div>
+              )}
+              Alterar email
+            </Button>
+          </fieldset>
         </form>
       </CardContent>
     </Card>

apps/saladeaula.digital/app/routes/settings/layout.tsx

@@ -38,8 +38,7 @@ export async function loader({ request, context }: Route.LoaderArgs) {
     throw new Response(null, { status: r.status })
   }
 
-  const data = await r.json()
-  return { data }
+  return { data: await r.json() }
 }
 
 export function shouldRevalidate({}: ShouldRevalidateFunctionArgs) {