gitscope
← marzneshin / v0.3.0-alpha4 / dashboard/src/features/services/tables/users/columns.tsx
https://dev.kronoz.win/r/marzneshin.git
dashboard/src/features/services/tables/users/columns.tsx · TypeScript
Blame Raw
 1import { ColumnDef } from "@tanstack/react-table"
 2import { DataTableColumnHeader } from "@marzneshin/components/data-table/column-header"
 3import i18n from "@marzneshin/features/i18n"
 4import {
 5    UserType,
 6    UsersStatus,
 7    UsersStatusBadge
 8} from "@marzneshin/features/users"
 9import { CircularProgress } from "@nextui-org/progress";
10import { format } from "date-fns";
11import { Badge } from "@marzneshin/components";
12
13export const columns: ColumnDef<UserType>[] = [
14    {
15        accessorKey: "username",
16        header: ({ column }) => <DataTableColumnHeader title={i18n.t('username')} column={column} />,
17    },
18    {
19        accessorKey: 'status',
20        header: ({ column }) => <DataTableColumnHeader title={i18n.t('status')} column={column} />,
21        cell: ({ row }) => <UsersStatusBadge status={UsersStatus[row.original.status ? row.original.status : 'error']} />,
22    },
23    {
24        accessorKey: "used_traffic",
25        header: ({ column }) => <DataTableColumnHeader title={i18n.t('page.users.used_traffic')} column={column} />,
26        cell: ({ row }) => {
27            if (row.original.data_limit) {
28                return (
29                    <CircularProgress
30                        size="sm"
31                        value={row.original.used_traffic / row.original.data_limit * 100}
32                    />
33                )
34            } else {
35                return <Badge>No Limit</Badge>
36            }
37        },
38        sortingFn: (rowA, rowB) => {
39            if (rowA.original.data_limit && rowB.original.data_limit) {
40                const rowAUsedTraffic = (rowA.original.used_traffic / rowA.original.data_limit) * 100
41                const rowBUsedTraffic = (rowA.original.used_traffic / rowA.original.data_limit) * 100
42                return rowAUsedTraffic > rowBUsedTraffic ? 1 : rowBUsedTraffic > rowAUsedTraffic ? -1 : 0
43            } else {
44                return 0
45            }
46        }
47    },
48    {
49        accessorKey: 'expire',
50        header: ({ column }) => <DataTableColumnHeader title={i18n.t('expire')} column={column} />,
51        cell: ({ row }) => row.original.expire && format(row.original.expire, "PPP")
52    }
53];