add report submission

apps/admin.saladeaula.digital/app/routes/_.$orgid.enrollments.add/data.ts

@@ -1,5 +1,7 @@
 import { z } from 'zod'
 
+export const MAX_ITEMS = 50
+
 export const enrollment = z.object({
   user: z
     .object(
@@ -7,7 +9,7 @@ export const enrollment = z.object({
         id: z.string(),
         name: z.string(),
         email: z.string(),
-        cpf: z.string()
+        cpf: z.string('a')
       },
       { error: 'Escolhe um colaborador' }
     )
@@ -32,9 +34,7 @@ export const enrollment = z.object({
 })
 
 export const formSchema = z.object({
-  enrollments: z.array(enrollment).min(1).max(100)
+  enrollments: z.array(enrollment).min(1).max(MAX_ITEMS)
 })
 
 export type Schema = z.infer<typeof formSchema>
-
-export const MAX_ITEMS = 100

apps/admin.saladeaula.digital/app/routes/_.$orgid.enrollments.add/route.tsx

@@ -13,7 +13,7 @@ import {
   CheckIcon,
   BookIcon
 } from 'lucide-react'
-import { Link, useParams } from 'react-router'
+import { Link, useParams, useFetcher } from 'react-router'
 import { Controller, useFieldArray, useForm } from 'react-hook-form'
 import { Fragment, use, useEffect, useMemo, useState } from 'react'
 import { format } from 'date-fns'
@@ -62,10 +62,12 @@ import { Label } from '@repo/ui/components/ui/label'
 import { Calendar } from '@repo/ui/components/ui/calendar'
 import { createSearch } from '@repo/util/meili'
 import { cn } from '@repo/ui/lib/utils'
+import { HttpMethod, request as req } from '@repo/util/request'
 import { useIsMobile } from '@repo/ui/hooks/use-mobile'
 
 import { formSchema, type Schema, MAX_ITEMS } from './data'
 import { AsyncCombobox } from './async-combobox'
+import { redirect } from 'react-router'
 
 export function meta({}: Route.MetaArgs) {
   return [{ title: 'Adicionar matrícula' }]
@@ -83,8 +85,19 @@ export async function loader({ context }: Route.LoaderArgs) {
   return { courses }
 }
 
-export async function action({}: Route.ActionArgs) {
-  return {}
+export async function action({ params, request, context }: Route.ActionArgs) {
+  const body = (await request.json()) as object
+  const r = await req({
+    url: `enrollments`,
+    headers: new Headers({ 'Content-Type': 'application/json' }),
+    method: HttpMethod.POST,
+    body: JSON.stringify({ org_id: params.orgid, ...body }),
+    request,
+    context
+  })
+
+  const result = (await r.json()) as { sk: string }
+  return redirect(`/${params.orgid}/enrollments/${result.sk}/submitted`)
 }
 
 const emptyRow = {
@@ -97,19 +110,22 @@ export default function Route({
   loaderData: { courses }
 }: Route.ComponentProps) {
   const { orgid } = useParams()
-  const [data, setData] = useState({})
+  const fetcher = useFetcher()
   const form = useForm({
     resolver: zodResolver(formSchema),
     defaultValues: { enrollments: [emptyRow] }
   })
-  const { formState, control, handleSubmit, getValues } = form
+  const { formState, control, handleSubmit, getValues, reset } = form
   const { fields, insert, remove, append } = useFieldArray({
     control,
     name: 'enrollments'
   })
 
   const onSubmit = async (data: Schema) => {
-    setData(data)
+    await fetcher.submit(JSON.stringify(data), {
+      method: 'post',
+      encType: 'application/json'
+    })
   }
 
   const onSearch = async (search: string) => {
@@ -142,7 +158,7 @@ export default function Route({
           </BreadcrumbItem>
           <BreadcrumbSeparator />
           <BreadcrumbItem>
-            <BreadcrumbPage>Adicionar matrícula</BreadcrumbPage>
+            <BreadcrumbPage>Adicionar matrículas</BreadcrumbPage>
           </BreadcrumbItem>
         </BreadcrumbList>
       </Breadcrumb>
@@ -156,7 +172,7 @@ export default function Route({
       >
         <Card>
           <CardHeader>
-            <CardTitle className="text-2xl">Adicionar matrícula</CardTitle>
+            <CardTitle className="text-2xl">Adicionar matrículas</CardTitle>
             <CardDescription>
               Siga os passos abaixo para adicionar novas matrículas.
             </CardDescription>
@@ -306,12 +322,6 @@ export default function Route({
           </CardContent>
         </Card>
       </form>
-
-      {data && (
-        <pre className="whitespace-pre-wrap text-xs bg-muted p-2 rounded">
-          {JSON.stringify(data, null, 2)}
-        </pre>
-      )}
     </div>
   )
 }
@@ -540,7 +550,7 @@ function DuplicateRowMultipleTimes({
                 type="number"
                 defaultValue="2"
                 min="2"
-                max="100"
+                max={String(MAX_ITEMS - 1)}
                 className="col-span-2"
               />
             </div>