finish user

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

@@ -48,18 +48,48 @@ import { useEffect } from 'react'
 
 const isName = (name: string) => name && name.includes(' ')
 
-export const formSchema = z.object({
-  name: z
-    .string()
-    .trim()
-    .nonempty('Digite um nome')
-    .refine(isName, { message: 'Nome inválido' }),
-  email: z.email('Email inválido').trim().toLowerCase().optional(),
-  cpf: z
-    .string('CPF obrigatório')
-    .refine(isValidCPF, { message: 'CPF inválido' }),
-  given_email: z.coerce.boolean()
-})
+function randomEmail() {
+  const numberDict = NumberDictionary.generate({ min: 100, max: 999 })
+  const randomName: string = uniqueNamesGenerator({
+    dictionaries: [adjectives, colors, numberDict],
+    length: 3,
+    separator: '-'
+  })
+
+  return `${randomName}@users.noreply.saladeaula.digital`
+}
+
+export const formSchema = z
+  .object({
+    name: z
+      .string()
+      .trim()
+      .nonempty('Digite um nome')
+      .refine(isName, { message: 'Nome inválido' }),
+    email: z.string().trim().toLowerCase().optional(),
+    cpf: z
+      .string('CPF obrigatório')
+      .refine(isValidCPF, { message: 'CPF inválido' }),
+    given_email: z.coerce.boolean()
+  })
+  .refine(
+    ({ given_email, email }) => {
+      if (given_email) {
+        return true
+      }
+      return email && z.email().safeParse(email).success
+    },
+    {
+      message: 'Email inválido',
+      path: ['email']
+    }
+  )
+  .transform((data) => {
+    if (data.given_email) {
+      return { ...data, email: randomEmail() }
+    }
+    return data
+  })
 
 export type Schema = z.infer<typeof formSchema>
 
@@ -93,7 +123,7 @@ export default function Route() {
   const form = useForm({
     resolver: zodResolver(formSchema)
   })
-  const { handleSubmit, control, formState, reset, watch } = form
+  const { handleSubmit, control, formState, reset, watch, setValue } = form
   const givenEmail = watch('given_email') as boolean
 
   const onSubmit = async (user: Schema) => {
@@ -115,7 +145,11 @@ export default function Route() {
     }
   }, [fetcher.data])
 
-  // console.log(randomEmail())
+  useEffect(() => {
+    if (givenEmail) {
+      setValue('email', '', { shouldValidate: true })
+    }
+  }, [givenEmail, setValue])
 
   return (
     <div className="space-y-2.5">
@@ -166,13 +200,16 @@ export default function Route() {
                   <FormField
                     control={control}
                     name="email"
-                    disabled={givenEmail}
                     defaultValue=""
                     render={({ field }) => (
                       <FormItem>
                         <FormLabel>Email</FormLabel>
                         <FormControl>
-                          <Input {...field} />
+                          <Input
+                            {...field}
+                            readOnly={givenEmail}
+                            className="read-only:pointer-events-none read-only:opacity-50"
+                          />
                         </FormControl>
                         <FormMessage />
                       </FormItem>
@@ -244,14 +281,3 @@ export default function Route() {
     </div>
   )
 }
-
-function randomEmail() {
-  const numberDict = NumberDictionary.generate({ min: 100, max: 999 })
-  const randomName: string = uniqueNamesGenerator({
-    dictionaries: [adjectives, colors, numberDict],
-    length: 3,
-    separator: '-'
-  })
-
-  return `${randomName}@users.noreply.saladeaula.digital`
-}

apps/saladeaula.digital/app/components/rrweb-recorder.tsx

@@ -0,0 +1,42 @@
+import type { eventWithTime, listenerHandler } from '@rrweb/types'
+import { useEffect, useRef } from 'react'
+import { record } from 'rrweb'
+
+interface RrwebRecorderProps {
+  onEventBatch: (events: eventWithTime[]) => void
+}
+
+export function RrwebRecorder({ onEventBatch }: RrwebRecorderProps) {
+  const stopRef = useRef<listenerHandler | null>(null)
+
+  useEffect(() => {
+    const events: eventWithTime[] = []
+
+    const stopFn = record({
+      emit(event: eventWithTime) {
+        events.push(event)
+
+        if (events.length >= 50) {
+          onEventBatch(events.splice(0))
+        }
+      }
+    })
+
+    if (stopFn) {
+      stopRef.current = stopFn
+    }
+
+    return () => {
+      if (stopRef.current) {
+        stopRef.current()
+        stopRef.current = null
+
+        if (events.length > 0) {
+          onEventBatch(events)
+        }
+      }
+    }
+  }, [onEventBatch])
+
+  return null
+}

apps/saladeaula.digital/app/routes/player.tsx

@@ -1,11 +1,10 @@
 import type { Route } from './+types'
 
-import lzwCompress from 'lzwcompress'
-import { useBlocker, useFetcher } from 'react-router'
-
 import { HttpMethod, request as req } from '@repo/util/request'
+import { useFetcher } from 'react-router'
 
-import { ScormPlayer, type ScormVersion } from '@/components/scorm-player'
+// import { RrwebRecorder } from '@/components/rrweb-recorder'
+import { ScormPlayer } from '@/components/scorm-player'
 // import { useLocalStorage } from '@/hooks/useLocalStorage'
 // import SHA256 from 'crypto-js/sha256'
 
@@ -64,24 +63,32 @@ export default function Route({ loaderData: { data } }: Route.ComponentProps) {
   // console.log(d2?.progress?.p ?? null)
 
   return (
-    <ScormPlayer
-      settings={{
-        autocommit: true,
-        throwExceptions: false,
-        logLevel: 2,
-        compatibilityMode: 1
-      }}
-      scormVersion="2004"
-      scormState={scormState}
-      scormContentPath={course.scormContentPath}
-      className="w-full h-full border-0"
-      onCommit={async (data) => {
-        console.log(data)
-        await fetcher.submit(JSON.stringify(data), {
-          method: 'post',
-          encType: 'application/json'
-        })
-      }}
-    />
+    <>
+      {/*      <RrwebRecorder
+        onEventBatch={(data) => {
+          console.log(JSON.stringify(data))
+        }}
+      />*/}
+
+      <ScormPlayer
+        settings={{
+          autocommit: true
+          // throwExceptions: false,
+          // logLevel: 2,
+          // compatibilityMode: 1
+        }}
+        scormVersion="2004"
+        scormState={scormState}
+        scormContentPath={course.scormContentPath}
+        className="w-full h-full border-0"
+        onCommit={async (data) => {
+          console.log(data)
+          await fetcher.submit(JSON.stringify(data), {
+            method: 'post',
+            encType: 'application/json'
+          })
+        }}
+      />
+    </>
   )
 }