76 lines
2.1 KiB
TypeScript
76 lines
2.1 KiB
TypeScript
import type { Route } from './+types/route'
|
|
|
|
import { Suspense } from 'react'
|
|
import { Await } from 'react-router'
|
|
import { PlusIcon, UploadIcon } from 'lucide-react'
|
|
|
|
import { Skeleton } from '@repo/ui/components/skeleton'
|
|
import { Button } from '@repo/ui/components/ui/button'
|
|
import {
|
|
Empty,
|
|
EmptyContent,
|
|
EmptyDescription,
|
|
EmptyHeader,
|
|
EmptyMedia,
|
|
EmptyTitle
|
|
} from '@repo/ui/components/ui/empty'
|
|
import { request as req } from '@repo/util/request'
|
|
|
|
export function meta({}: Route.MetaArgs) {
|
|
return [{ title: ' Importações de colaboradores' }]
|
|
}
|
|
|
|
export async function loader({ context, request, params }: Route.LoaderArgs) {
|
|
const scheduled = req({
|
|
url: `/orgs/${params.orgid}/enrollments/scheduled`,
|
|
context,
|
|
request
|
|
}).then((r) => r.json())
|
|
|
|
return {
|
|
scheduled
|
|
}
|
|
}
|
|
|
|
export default function Route({
|
|
loaderData: { scheduled }
|
|
}: Route.ComponentProps) {
|
|
return (
|
|
<Suspense fallback={<Skeleton />}>
|
|
<div className="space-y-0.5 mb-8">
|
|
<h1 className="text-2xl font-bold tracking-tight">
|
|
Importações de colaboradores
|
|
</h1>
|
|
<p className="text-muted-foreground">
|
|
Acompanhe suas importações de colaboradores, faça novas importações
|
|
sempre que precisar e finalize o processo com rapidez.
|
|
</p>
|
|
</div>
|
|
|
|
<Await resolve={scheduled}>
|
|
{(resolved) => (
|
|
<>
|
|
<Empty className="border border-dashed">
|
|
<EmptyHeader>
|
|
<EmptyMedia variant="icon">
|
|
<UploadIcon />
|
|
</EmptyMedia>
|
|
<EmptyTitle>Nenhum importação ainda</EmptyTitle>
|
|
<EmptyDescription>
|
|
Importe seus colaboradores para gerenciar, segmentar e
|
|
facilitar sua gestão.
|
|
</EmptyDescription>
|
|
</EmptyHeader>
|
|
<EmptyContent>
|
|
<Button>
|
|
<PlusIcon /> Importar
|
|
</Button>
|
|
</EmptyContent>
|
|
</Empty>
|
|
</>
|
|
)}
|
|
</Await>
|
|
</Suspense>
|
|
)
|
|
}
|