gitscope
← marzneshin / v0.3.0-alpha5 / 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    const { t } = useTranslation();
25
26    if (entity) {
27        return (
28            <Sheet open={open} onOpenChange={onOpenChange}>
29                <SheetContent className="sm:min-w-full md:min-w-[700px]" >
30                    <SheetHeader>
31                        <SheetTitle>
32                            {t('settings')}
33                        </SheetTitle>
34                    </SheetHeader>
35                    <ScrollArea className="flex flex-col gap-4 m-3 h-full">
36                        <Tabs defaultValue="info" className="w-full h-full">
37                            <TabsList className="w-full bg-accent">
38                                <TabsTrigger className="w-full" value="info"> {t('user_info')} </TabsTrigger>
39                                <TabsTrigger className="w-full" value="services"> {t('services')} </TabsTrigger>
40                            </TabsList>
41                            <TabsContent value="info" className="flex flex-col gap-4">
42                                <UserInfoTable entity={entity} />
43                                <QRCodeSection entity={entity} />
44                            </TabsContent>
45                            <TabsContent value="services">
46                                <UserServicesTable user={entity} />
47                            </TabsContent>
48                        </Tabs>
49                    </ScrollArea>
50                </SheetContent>
51            </Sheet>
52        )
53    }
54}