1import {
 2    Card,
 3    CardContent,
 4    ScrollArea,
 5    Sheet,
 6    SheetContent,
 7    SheetHeader,
 8    SheetTitle,
 9    Tabs,
10    TabsContent,
11    TabsList,
12    TabsTrigger,
13} from "@marzneshin/components"
14import { FC } from "react"
15import { useTranslation } from "react-i18next"
16import { NodeType } from "../.."
17import { LogContainer } from "../../log";
18import { NodesDetailTable } from "../../tables/detail-table";
19import { NodeConfigEditor } from "./node-config-editor";
20
21interface NodesSettingsDialogProps {
22    onOpenChange: (state: boolean) => void
23    open: boolean
24    entity: NodeType
25}
26
27export const NodesSettingsDialog: FC<NodesSettingsDialogProps> = ({ onOpenChange, open, entity }) => {
28    const { t } = useTranslation();
29
30    return (
31        <Sheet open={open} onOpenChange={onOpenChange}>
32            <SheetContent className="sm:min-w-full md:min-w-[600px] " >
33                <ScrollArea className="h-full">
34                    <SheetHeader>
35                        <SheetTitle>
36                            {t('page.nodes.settings.title')}
37                        </SheetTitle>
38                    </SheetHeader>
39                    <div className="my-4">
40                        <h1 className="font-medium font-header">{t('page.nodes.settings.detail')}</h1>
41                        <NodesDetailTable node={entity} />
42                    </div>
43                    <Tabs className="my-3 w-full h-full" defaultValue="logs">
44                        <TabsList className="w-full">
45                            <TabsTrigger className="w-full" value="logs">{t('logs')}</TabsTrigger>
46                            <TabsTrigger className="w-full" value="config">{t('config')}</TabsTrigger>
47                        </TabsList>
48                        <TabsContent value="logs" className="h-full">
49                            <LogContainer node={entity} />
50                        </TabsContent>
51                        <TabsContent value="config" className="h-full z-51">
52                            <Card>
53                                <CardContent className="p-2 h-1/2 flex flex-col gap-2">
54                                    <NodeConfigEditor entity={entity} />
55                                </CardContent>
56                            </Card>
57                        </TabsContent>
58                    </Tabs>
59                </ScrollArea>
60            </SheetContent>
61        </Sheet>
62    )
63}