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