gitscope
← marzneshin / v0.3.0-alpha1 / 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 { FC } from "react"
13import { useTranslation } from "react-i18next"
14import { UserServicesTable, UserType } from "@marzneshin/features/users"
15import { UserInfoTable, QRCodeSection } from "./user-info"
16
17interface UsersSettingsDialogProps {
18    onOpenChange: (state: boolean) => void
19    open: boolean
20    entity: UserType | null
21}
22
23export const UsersSettingsDialog: FC<UsersSettingsDialogProps> = ({ onOpenChange, open, entity }) => {
24
25    const { t } = useTranslation();
26
27    if (entity) {
28        return (
29            <Sheet open={open} onOpenChange={onOpenChange}>
30                <SheetContent className="sm:min-w-full md:min-w-[700px]" >
31                    <SheetHeader>
32                        <SheetTitle>
33                            {t('settings')}
34                        </SheetTitle>
35                    </SheetHeader>
36                    <ScrollArea className="flex flex-col gap-4 m-3 h-full">
37                        <Tabs defaultValue="info" className="w-full h-full">
38                            <TabsList className="w-full bg-accent">
39                                <TabsTrigger className="w-full" value="info"> {t('user_info')} </TabsTrigger>
40                                <TabsTrigger className="w-full" value="services"> {t('services')} </TabsTrigger>
41                            </TabsList>
42                            <TabsContent value="info" className="flex flex-col gap-4">
43                                <UserInfoTable entity={entity} />
44                                <QRCodeSection entity={entity} />
45                            </TabsContent>
46                            <TabsContent value="services">
47                                <UserServicesTable user={entity} />
48                            </TabsContent>
49                        </Tabs>
50                    </ScrollArea>
51                </SheetContent>
52            </Sheet>
53        )
54    }
55}