102 lines
2.5 KiB
TypeScript
102 lines
2.5 KiB
TypeScript
'use client'
|
|
|
|
import type { ColumnDef } from '@tanstack/react-table'
|
|
import { useToggle } from 'ahooks'
|
|
import { EllipsisVerticalIcon, FileBadgeIcon } from 'lucide-react'
|
|
import type { ComponentProps } from 'react'
|
|
|
|
import { Button } from '@repo/ui/components/ui/button'
|
|
import {
|
|
DropdownMenu,
|
|
DropdownMenuContent,
|
|
DropdownMenuItem,
|
|
DropdownMenuTrigger
|
|
} from '@repo/ui/components/ui/dropdown-menu'
|
|
import { Spinner } from '@repo/ui/components/ui/spinner'
|
|
import { DataTableColumnHeaderSelect } from '@repo/ui/components/data-table/column-select'
|
|
import {
|
|
columns as columns_,
|
|
type Enrollment
|
|
} from '@repo/ui/routes/enrollments/columns'
|
|
|
|
export type { Enrollment }
|
|
|
|
export const columns: ColumnDef<Enrollment>[] = [
|
|
{
|
|
id: 'select',
|
|
header: DataTableColumnHeaderSelect,
|
|
cell: DataTableColumnHeaderSelect
|
|
},
|
|
...columns_,
|
|
{
|
|
id: 'actions',
|
|
cell: ActionMenu
|
|
}
|
|
]
|
|
|
|
function ActionMenu({ row }: { row: any }) {
|
|
const [open, { set: setOpen }] = useToggle(false)
|
|
const cert = row.original?.cert
|
|
|
|
return (
|
|
<div className="flex justify-end items-center">
|
|
<DropdownMenu
|
|
modal={false}
|
|
open={open}
|
|
onOpenChange={(open) => {
|
|
setOpen(open)
|
|
}}
|
|
>
|
|
<DropdownMenuTrigger asChild>
|
|
<Button
|
|
variant="ghost"
|
|
className="data-[state=open]:bg-muted text-muted-foreground cursor-pointer"
|
|
size="icon-sm"
|
|
>
|
|
<EllipsisVerticalIcon />
|
|
<span className="sr-only">Abrir menu</span>
|
|
</Button>
|
|
</DropdownMenuTrigger>
|
|
<DropdownMenuContent align="end" className="w-46 *:cursor-pointer">
|
|
<DownloadItem
|
|
id={row.id}
|
|
disabled={!cert}
|
|
onSuccess={() => setOpen(false)}
|
|
/>
|
|
</DropdownMenuContent>
|
|
</DropdownMenu>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
type ItemProps = ComponentProps<typeof DropdownMenuItem> & {
|
|
id: string
|
|
onSuccess?: () => void
|
|
}
|
|
|
|
function DownloadItem({ id, onSuccess, ...props }: ItemProps) {
|
|
const [loading, { set }] = useToggle(false)
|
|
|
|
const download = async (e: Event) => {
|
|
e.preventDefault()
|
|
set(true)
|
|
const r = await fetch(`/~/api/enrollments/${id}/download`, {
|
|
method: 'GET'
|
|
})
|
|
|
|
if (r.ok) {
|
|
const { presigned_url } = (await r.json()) as { presigned_url: string }
|
|
window.open(presigned_url, '_blank')
|
|
|
|
set(false)
|
|
onSuccess?.()
|
|
}
|
|
}
|
|
|
|
return (
|
|
<DropdownMenuItem onSelect={download} {...props}>
|
|
{loading ? <Spinner /> : <FileBadgeIcon />} Baixar certificado
|
|
</DropdownMenuItem>
|
|
)
|
|
}
|