gitscope
/
← marzneshin / dashboard/src/features/nodes/dialogs/settings.dialog.tsx / blame
Files Commits 446 Branches 1 Tags 43 Markers 4 README License
https://dev.kronoz.win/r/marzneshin.git
dashboard/src/features/nodes/dialogs/settings.dialog.tsx · v0.3.0-alpha5
Source
1 b15ff05 Mrdn 2y ago import {
2 b15ff05 Mrdn 2y ago Button,
3 b15ff05 Mrdn 2y ago Card,
4 b15ff05 Mrdn 2y ago CardContent,
5 b15ff05 Mrdn 2y ago Sheet,
6 b15ff05 Mrdn 2y ago SheetContent,
7 b15ff05 Mrdn 2y ago SheetHeader,
8 b15ff05 Mrdn 2y ago SheetTitle,
9 b15ff05 Mrdn 2y ago Tabs,
10 b15ff05 Mrdn 2y ago TabsContent,
11 b15ff05 Mrdn 2y ago TabsList,
12 b15ff05 Mrdn 2y ago TabsTrigger,
13 b15ff05 Mrdn 2y ago } from "@marzneshin/components"
14 b15ff05 Mrdn 2y ago import { FC, useState } from "react"
15 b15ff05 Mrdn 2y ago import { useTranslation } from "react-i18next"
16 b15ff05 Mrdn 2y ago import { NodeType, useNodesSettingsMutation } from ".."
17 b15ff05 Mrdn 2y ago import { useNodesSettingsQuery } from "../services/settings.query";
18 b15ff05 Mrdn 2y ago import { LogContainer } from "../log";
19 b15ff05 Mrdn 2y ago import { NodesDetailTable } from "../tables/detail-table";
20 b15ff05 Mrdn 2y ago import Editor from '@monaco-editor/react';
21 b15ff05 Mrdn 2y ago import { useTheme } from "@marzneshin/features/theme-switch";
22 b15ff05 Mrdn 2y ago
23 b15ff05 Mrdn 2y ago interface NodesSettingsDialogProps {
24 b15ff05 Mrdn 2y ago onOpenChange: (state: boolean) => void
25 b15ff05 Mrdn 2y ago open: boolean
26 3b7feef Mrdn 2y ago entity: NodeType | null
27 b15ff05 Mrdn 2y ago }
28 b15ff05 Mrdn 2y ago
29 3b7feef Mrdn 2y ago export const NodesSettingsDialog: FC<NodesSettingsDialogProps> = ({ onOpenChange, open, entity }) => {
30 b15ff05 Mrdn 2y ago
31 b15ff05 Mrdn 2y ago const { t } = useTranslation();
32 3b7feef Mrdn 2y ago const { data } = useNodesSettingsQuery(entity);
33 b15ff05 Mrdn 2y ago const [config, setConfig] = useState<any>(data)
34 b15ff05 Mrdn 2y ago const mutate = useNodesSettingsMutation();
35 b15ff05 Mrdn 2y ago const { theme } = useTheme()
36 b15ff05 Mrdn 2y ago
37 b15ff05 Mrdn 2y ago const handleConfigChange = (newConfig: string | undefined) => {
38 b15ff05 Mrdn 2y ago if (newConfig) {
39 b15ff05 Mrdn 2y ago try {
40 b15ff05 Mrdn 2y ago const parsedConfig = JSON.parse(newConfig);
41 b15ff05 Mrdn 2y ago setConfig(parsedConfig);
42 b15ff05 Mrdn 2y ago } catch (error) {
43 b15ff05 Mrdn 2y ago throw null;
44 b15ff05 Mrdn 2y ago }
45 b15ff05 Mrdn 2y ago }
46 b15ff05 Mrdn 2y ago };
47 b15ff05 Mrdn 2y ago
48 3b7feef Mrdn 2y ago if (entity) {
49 b15ff05 Mrdn 2y ago return (
50 b15ff05 Mrdn 2y ago <Sheet open={open} onOpenChange={onOpenChange}>
51 b15ff05 Mrdn 2y ago <SheetContent className="sm:min-w-full md:min-w-[600px]" >
52 b15ff05 Mrdn 2y ago <SheetHeader>
53 b15ff05 Mrdn 2y ago <SheetTitle>
54 b15ff05 Mrdn 2y ago {t('page.nodes.settings.title')}
55 b15ff05 Mrdn 2y ago </SheetTitle>
56 b15ff05 Mrdn 2y ago </SheetHeader>
57 b15ff05 Mrdn 2y ago <div className="my-4">
58 b15ff05 Mrdn 2y ago <h1 className="font-medium font-header">{t('page.nodes.settings.detail')}</h1>
59 3b7feef Mrdn 2y ago <NodesDetailTable node={entity} />
60 b15ff05 Mrdn 2y ago </div>
61 b15ff05 Mrdn 2y ago <Tabs className="my-3 w-full h-full" defaultValue="logs">
62 b15ff05 Mrdn 2y ago <TabsList className="w-full">
63 b15ff05 Mrdn 2y ago <TabsTrigger className="w-full" value="logs">{t('logs')}</TabsTrigger>
64 b15ff05 Mrdn 2y ago <TabsTrigger className="w-full" value="config">{t('config')}</TabsTrigger>
65 b15ff05 Mrdn 2y ago </TabsList>
66 b15ff05 Mrdn 2y ago <TabsContent value="logs" className="h-full">
67 3b7feef Mrdn 2y ago <LogContainer node={entity} />
68 b15ff05 Mrdn 2y ago </TabsContent>
69 b15ff05 Mrdn 2y ago <TabsContent value="config" className="h-full z-51">
70 b15ff05 Mrdn 2y ago <Card>
71 b15ff05 Mrdn 2y ago <CardContent className="p-2 h-1/2">
72 b15ff05 Mrdn 2y ago <Editor
73 b15ff05 Mrdn 2y ago height="50vh"
74 b15ff05 Mrdn 2y ago defaultLanguage="json"
75 b15ff05 Mrdn 2y ago theme={theme === "dark" ? "vs-dark" : "github"}
76 f9c0992 Mrdn 2y ago defaultValue={JSON.stringify(data, null, '\t')}
77 b15ff05 Mrdn 2y ago onChange={handleConfigChange}
78 b15ff05 Mrdn 2y ago />
79 b15ff05 Mrdn 2y ago <Button onClick={() => mutate.mutate(config)}>{t('save')}</Button>
80 b15ff05 Mrdn 2y ago </CardContent>
81 b15ff05 Mrdn 2y ago </Card>
82 b15ff05 Mrdn 2y ago </TabsContent>
83 b15ff05 Mrdn 2y ago </Tabs>
84 b15ff05 Mrdn 2y ago </SheetContent>
85 b15ff05 Mrdn 2y ago </Sheet>
86 b15ff05 Mrdn 2y ago )
87 b15ff05 Mrdn 2y ago }
88 b15ff05 Mrdn 2y ago }