gitscope
← marzneshin / v0.3.0 / dashboard/src/features/users/dialogs/settings/index.tsx
https://dev.kronoz.win/r/marzneshin.git
dashboard/src/features/users/dialogs/settings/index.tsx · TypeScript
Blame Raw
 1import {
 2    ScrollArea,
 3    Sheet,
 4    SheetContent,
 5    SheetHeader,
 6    SheetTitle,
 7    Tabs,
 8    TabsContent,
 9    TabsList,
10    TabsTrigger,
11} from "@marzneshin/components";
12import { UserServicesTable } from "@marzneshin/features/users";
13import type { UserType } from "@marzneshin/features/users";
14import type { FC } from "react";
15import { useTranslation } from "react-i18next";
16import { QRCodeSection, UserInfoTable } from "./user-info";
17import { SubscriptionActions } from "./user-info/subscription-actions";
18
19interface UsersSettingsDialogProps {
20    onOpenChange: (state: boolean) => void;
21    open: boolean;
22    entity: UserType | null;
23}
24
25export const UsersSettingsDialog: FC<UsersSettingsDialogProps> = ({
26    onOpenChange,
27    open,
28    entity,
29}) => {
30    const { t } = useTranslation();
31
32    if (entity) {
33        return (
34            <Sheet open={open} onOpenChange={onOpenChange}>
35                <SheetContent className="sm:min-w-full md:min-w-[700px]">
36                    <ScrollArea className="flex flex-col gap-4 m-3 h-full">
37                        <SheetHeader className="my-1">
38                            <SheetTitle>{t("settings")}</SheetTitle>
39                        </SheetHeader>
40                        <Tabs defaultValue="info" className="w-full h-full">
41                            <TabsList className="w-full bg-accent">
42                                <TabsTrigger className="w-full" value="info">
43                                    {" "}
44                                    {t("user_info")}{" "}
45                                </TabsTrigger>
46                                <TabsTrigger className="w-full" value="services">
47                                    {" "}
48                                    {t("services")}{" "}
49                                </TabsTrigger>
50                            </TabsList>
51                            <TabsContent
52                                value="info"
53                                className="flex flex-col gap-2 w-full h-full"
54                            >
55                                <UserInfoTable entity={entity} />
56                                <QRCodeSection entity={entity} />
57                                <SubscriptionActions entity={entity} />
58                            </TabsContent>
59                            <TabsContent value="services">
60                                <UserServicesTable user={entity} />
61                            </TabsContent>
62                        </Tabs>
63                    </ScrollArea>
64                </SheetContent>
65            </Sheet>
66        );
67    }
68};