[]>(
() => [
{
id: "name",
accessorKey: "name",
size: 160,
header: ({ column }) => (
),
cell: ({ row }) => {
const cert = row.original
const cfg = STATUS_CONFIG[cert.status]
const expanded = row.getIsExpanded()
return (
{cfg.icon}
{cert.name}
{cert.commonName}
)
},
meta: {
headerTitle: "Сертификат",
headerClassName: DATA_GRID_CELL_PAD_FIRST,
cellClassName: DATA_GRID_CELL_PAD_FIRST,
expandedContent: (row: CertificateView) => ,
},
},
{
id: "server",
accessorKey: "serverId",
header: ({ column }) => ,
cell: ({ row }) => {
const cert = row.original
const server = serverMap.get(cert.serverId)
return server ? (
{server.name}
) : (
{cert.serverName ?? cert.serverId}
)
},
meta: {
headerTitle: "Сервер",
headerClassName: DATA_GRID_CELL_PAD,
cellClassName: DATA_GRID_CELL_PAD,
},
},
{
id: "issuedBy",
accessorKey: "issuedBy",
header: ({ column }) => ,
cell: ({ row }) => (
{row.original.issuedBy}
),
meta: {
headerTitle: "Издатель",
headerClassName: DATA_GRID_CELL_PAD,
cellClassName: DATA_GRID_CELL_PAD,
},
},
{
id: "daysLeft",
accessorKey: "daysLeft",
header: ({ column }) => ,
cell: ({ row }) => (
),
meta: {
headerTitle: "Срок",
headerClassName: DATA_GRID_CELL_PAD,
cellClassName: DATA_GRID_CELL_PAD,
},
},
{
id: "usage",
accessorKey: "usage",
header: () => Использование,
enableSorting: false,
cell: ({ row }) => (
{row.original.usage.map((u) => (
{u}
))}
),
meta: {
headerTitle: "Использование",
headerClassName: DATA_GRID_CELL_PAD,
cellClassName: DATA_GRID_CELL_PAD,
},
},
{
id: "status",
size: 120,
accessorKey: "status",
header: ({ column }) => ,
cell: ({ row }) => {
const cfg = STATUS_CONFIG[row.original.status]
return (
{cfg.label}
)
},
meta: {
headerTitle: "Статус",
headerClassName: DATA_GRID_CELL_PAD_LAST,
cellClassName: DATA_GRID_CELL_PAD_LAST,
},
},
],
[serverMap],
)
const table = useTable({
features: dataGridFeatures,
manualPagination: false,
autoResetPageIndex: false,
autoResetExpanded: false,
initialState: { pagination: { pageIndex: 0, pageSize: 50 }, columnPinning: { start: ["name"], end: [] } },
data: certificates,
columns,
getRowId: (row) => row.id,
getRowCanExpand: () => true,
})
const { pageIndex, pageSize } = table.state.pagination
useEffect(() => {
const lastPage = Math.max(0, Math.ceil(certificates.length / pageSize) - 1)
if (pageIndex > lastPage) table.setPageIndex(lastPage)
}, [certificates.length, pageSize, pageIndex, table])
if (!isLoading && certificates.length === 0) {
return (
}
title={emptyTitle}
description={emptyDescription}
className="border-0 py-12"
/>
)
}
return (
50 || pageSize !== 50}
isLoading={isLoading}
loadingMode="skeleton"
onRowClick={(row) => table.getRow(row.id).toggleExpanded()}
>
)
}
export { CertificatesDataGrid, STATUS_CONFIG, type CertificatesDataGridProps }