1import {
 2    ScrollArea,
 3    Tabs,
 4    TabsContent,
 5    TabsList,
 6    TabsTrigger,
 7    Awaiting,
 8    SettingsInfoSkeleton,
 9    SettingsDialogProps,
10    SettingsDialog,
11} from "@marzneshin/components";
12import {
13    UserServicesTable,
14    type UserType,
15} from "@marzneshin/features/users";
16import { type FC } from "react";
17import { useTranslation } from "react-i18next";
18import {
19    SubscriptionActions,
20    QRCodeSection,
21    UserInfoTable,
22} from "./user-info";
23
24interface UsersSettingsDialogProps extends SettingsDialogProps {
25    entity: UserType | null;
26    onClose: () => void;
27    isPending: boolean;
28}
29
30export const UsersSettingsDialog: FC<UsersSettingsDialogProps> = ({
31    onOpenChange,
32    open,
33    entity,
34    onClose,
35    isPending,
36}) => {
37    const { t } = useTranslation();
38
39    return (
40        <SettingsDialog open={open} onClose={onClose} onOpenChange={onOpenChange}>
41            <Awaiting
42                Component={
43                    entity ? (
44                        <ScrollArea className="flex flex-col gap-4 h-full">
45                            <Tabs defaultValue="info" className="w-full h-full">
46                                <TabsList className="w-full bg-accent">
47                                    <TabsTrigger className="w-full" value="info">
48                                        {t("user_info")}
49                                    </TabsTrigger>
50                                    <TabsTrigger className="w-full" value="services">
51                                        {t("services")}
52                                    </TabsTrigger>
53                                    <TabsTrigger className="w-full" value="subscription">
54                                        {t("subscription")}
55                                    </TabsTrigger>
56                                </TabsList>
57                                <TabsContent
58                                    value="info"
59                                    className="flex flex-col gap-2 w-full h-full"
60                                >
61                                    <UserInfoTable user={entity} />
62                                </TabsContent>
63                                <TabsContent value="services">
64                                    <UserServicesTable user={entity} />
65                                </TabsContent>
66                                <TabsContent value="subscription">
67                                    <QRCodeSection entity={entity} />
68                                    <SubscriptionActions entity={entity} />
69                                </TabsContent>
70                            </Tabs>
71                        </ScrollArea>
72                    ) : (
73                        <div>Not Found</div>
74                    )
75                }
76                Skeleton={<SettingsInfoSkeleton />}
77                isFetching={isPending}
78            />
79        </SettingsDialog>
80    );
81};