gitscope
← marzneshin / v0.5.0 / dashboard/src/features/users/components/dialogs/settings/user-info/table.tsx
https://dev.kronoz.win/r/marzneshin.git
dashboard/src/features/users/components/dialogs/settings/user-info/table.tsx · TypeScript
Blame Raw
  1import {
  2    Card,
  3    CardContent,
  4    CardHeader,
  5    CardTitle,
  6    Table,
  7    TableBody,
  8    TableRowWithCell,
  9    DateTableRow,
 10    Badge
 11} from "@marzneshin/components";
 12import type { FC } from "react";
 13import {
 14    type UserProp,
 15    UserEnabledPill,
 16    UserUsedTraffic,
 17    UserActivatedPill,
 18    UserDataLimitReachedPill,
 19    UserExpiredPill,
 20} from "@marzneshin/features/users";
 21import { useTranslation } from "react-i18next";
 22
 23export const UserInfoTable: FC<UserProp> = ({ user: entity }) => {
 24    const { t } = useTranslation();
 25    const expireDate = entity.expire_date ? new Date(entity.expire_date) : null;
 26
 27    return (
 28        <Card>
 29            <CardHeader className="flex flex-row justify-between items-center w-full">
 30                <CardTitle>{t("user_info")}</CardTitle>
 31            </CardHeader>
 32            <CardContent>
 33                <Table>
 34                    <TableBody>
 35                        <TableRowWithCell label={t("username")} value={entity.username} />
 36                        <TableRowWithCell
 37                            label={t("activated")}
 38                            value={<UserActivatedPill user={entity} />}
 39                        />
 40                        <TableRowWithCell
 41                            label={t("enabled")}
 42                            value={<UserEnabledPill user={entity} />}
 43                        />
 44                        <TableRowWithCell
 45                            label={t("page.users.data_limit_reached")}
 46                            value={<UserDataLimitReachedPill user={entity} />}
 47                        />
 48                        <TableRowWithCell
 49                            label={t("expired")}
 50                            value={<UserExpiredPill user={entity} />}
 51                        />
 52                        {
 53                            {
 54                                fixed_date: (
 55                                    <DateTableRow
 56                                        label={t("page.users.expire_date")}
 57                                        date={expireDate}
 58                                    />
 59                                ),
 60                                start_on_first_use: (
 61                                    <>
 62                                        <TableRowWithCell
 63                                            label={t("page.users.usage_duration")}
 64                                            value={
 65                                                (entity.usage_duration ? entity.usage_duration : 0) /
 66                                                86400
 67                                            }
 68                                        />
 69                                        <DateTableRow
 70                                            label={t("page.users.activation_deadline")}
 71                                            date={entity.activation_deadline}
 72                                        />
 73                                    </>
 74                                ),
 75                                never: (
 76                                    <TableRowWithCell
 77                                        label={t("page.users.expire_method")}
 78                                        value={t("never")}
 79                                    />
 80                                ),
 81                            }[entity.expire_strategy]
 82                        }
 83
 84                        <TableRowWithCell
 85                            label={t("page.users.used_traffic")}
 86                            value={<UserUsedTraffic user={entity} />}
 87                        />
 88                        {entity.online_at ? (
 89                            <DateTableRow
 90                                label={t("page.users.online_at")}
 91                                date={entity.online_at}
 92                                withTime
 93                            />
 94                        ) : (
 95                            <TableRowWithCell
 96                                label={t("page.users.online_at")}
 97                                value={<Badge>{t("page.users.no_use")}</Badge>}
 98                            />
 99                        )}
100                        <DateTableRow
101                            label={t("page.users.created_at")}
102                            date={entity.created_at}
103                        />
104                        <TableRowWithCell label={t("note")} value={entity.note} />
105                    </TableBody>
106                </Table>
107            </CardContent>
108        </Card>
109    );
110};