1import {
 2    Card,
 3    CardContent,
 4    CardHeader,
 5    CardTitle,
 6    Table,
 7    TableBody,
 8    TableRowWithCell,
 9} from "@marzneshin/components";
10import { FC } from "react";
11import {
12    type AdminProp,
13    AdminEnabledPill,
14    AdminPermissionPill
15} from "@marzneshin/features/admins";
16import { useTranslation } from "react-i18next";
17import { format } from '@chbphone55/pretty-bytes';
18
19export const AdminInfoTable: FC<AdminProp> = ({ admin: entity }) => {
20    const { t } = useTranslation();
21    const usersDataUsage = format(entity.users_data_usage);
22
23    return (
24        <Card>
25            <CardHeader className="flex flex-row justify-between items-center w-full">
26                <CardTitle>{t("admin_info")}</CardTitle>
27            </CardHeader>
28            <CardContent>
29                <Table>
30                    <TableBody>
31                        <TableRowWithCell label={t("username")} value={entity.username} />
32                        <TableRowWithCell
33                            label={t("enabled")}
34                            value={<AdminEnabledPill admin={entity} />}
35                        />
36                        <TableRowWithCell
37                            label={t("page.admins.permission")}
38                            value={<AdminPermissionPill admin={entity} />}
39                        />
40                        <TableRowWithCell
41                            label={t("page.admins.users-data-usage")}
42                            value={`${usersDataUsage[0]} ${usersDataUsage[1]}`}
43                        />
44
45                    </TableBody>
46                </Table>
47            </CardContent>
48        </Card>
49    );
50};