fix fallback

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

@@ -5,12 +5,21 @@ import {
   CheckCircle2Icon,
   ClockIcon,
   CalendarIcon,
-  UserIcon
+  UserIcon,
+  BanIcon,
+  PlusIcon
 } from 'lucide-react'
 import { Link } from 'react-router'
 import { Suspense } from 'react'
-import { ErrorBoundary } from 'react-error-boundary'
 
+import {
+  Empty,
+  EmptyContent,
+  EmptyDescription,
+  EmptyHeader,
+  EmptyMedia,
+  EmptyTitle
+} from '@repo/ui/components/ui/empty'
 import {
   Card,
   CardContent,
@@ -36,6 +45,7 @@ import { request as req } from '@repo/util/request'
 import { Skeleton } from '@repo/ui/components/skeleton'
 import { Await } from 'react-router'
 import { Abbr } from '@repo/ui/components/abbr'
+import { Button } from '@repo/ui/components/ui/button'
 
 export function meta({}: Route.MetaArgs) {
   return [{ title: 'Relatório de matrículas' }]
@@ -78,7 +88,7 @@ export default function Route({ loaderData: { data } }: Route.ComponentProps) {
           </BreadcrumbList>
         </Breadcrumb>
 
-        <Await resolve={data} errorElement={<div>Algo deu errado</div>}>
+        <Await resolve={data} errorElement={<NotFound />}>
           {({ enrolled, scheduled, sk, created_by }) => {
             const succeed = enrolled.filter(
               ({ status }) => status === 'success'
@@ -188,3 +198,28 @@ const formatted = new Intl.DateTimeFormat('pt-BR', {
   hour: '2-digit',
   minute: '2-digit'
 })
+
+function NotFound() {
+  return (
+    <>
+      <Empty className="border border-dashed">
+        <EmptyHeader>
+          <EmptyMedia variant="icon">
+            <BanIcon />
+          </EmptyMedia>
+          <EmptyTitle>Nenhum relatório aqui</EmptyTitle>
+          <EmptyDescription>
+            Matricule colaboradores de forma rápida e acompanhe seu progresso.
+          </EmptyDescription>
+        </EmptyHeader>
+        <EmptyContent>
+          <Button asChild>
+            <Link to="../enrollments/add">
+              <PlusIcon /> Matricular
+            </Link>
+          </Button>
+        </EmptyContent>
+      </Empty>
+    </>
+  )
+}