portainer/app/react/docker/events/EventsDatatables.tsx

55 lines
1.3 KiB
TypeScript

import { createColumnHelper } from '@tanstack/react-table';
import { Clock } from 'lucide-react';
import { isoDateFromTimestamp } from '@/portainer/filters/filters';
import { Datatable } from '@@/datatables';
import { createPersistedStore } from '@@/datatables/types';
import { useTableState } from '@@/datatables/useTableState';
type DockerEvent = {
Time: number;
Type: string;
Details: string;
};
const columnHelper = createColumnHelper<DockerEvent>();
export const columns = [
columnHelper.accessor('Time', {
header: 'Date',
cell: ({ getValue }) => {
const value = getValue();
return isoDateFromTimestamp(value);
},
}),
columnHelper.accessor('Type', {
header: 'Type',
}),
columnHelper.accessor('Details', {
header: 'Details',
}),
];
const tableKey = 'docker-events';
const settingsStore = createPersistedStore(tableKey, {
id: 'Time',
desc: true,
});
export function EventsDatatable({ dataset }: { dataset: Array<DockerEvent> }) {
const tableState = useTableState(settingsStore, tableKey);
return (
<Datatable
dataset={dataset ?? []}
columns={columns}
settingsManager={tableState}
title="Events"
titleIcon={Clock}
disableSelect
emptyContentLabel="No event available."
/>
);
}