From 9cc18ee9ffd63b0947b2587ac224bc3dc1eb1b6b Mon Sep 17 00:00:00 2001 From: JackTheRooster Date: Sat, 8 Mar 2025 11:25:25 -0600 Subject: [PATCH] now storing name config settings in store removed extra LoadConfig calls --- jsonrpc.go | 2 - network.go | 1 - ui/src/hooks/stores.ts | 9 ++++ .../devices.$id.settings.appearance.tsx | 47 ++++++++----------- ui/src/routes/devices.$id.tsx | 9 +++- 5 files changed, 36 insertions(+), 32 deletions(-) diff --git a/jsonrpc.go b/jsonrpc.go index df2742d..e3f9a14 100644 --- a/jsonrpc.go +++ b/jsonrpc.go @@ -300,12 +300,10 @@ type SSHKeyState struct { } func rpcGetNameConfig() (NameConfig, error) { - LoadConfig() return config.NameConfig, nil } func rpcSetNameConfig(deviceName string) (NameConfig, error) { - LoadConfig() config.NameConfig = NameConfig{ Name: deviceName, DNS: slug.Make(deviceName) + ".local", diff --git a/network.go b/network.go index 8e8e2fd..474dab8 100644 --- a/network.go +++ b/network.go @@ -131,7 +131,6 @@ func startMDNS() error { } // Start a new server - LoadConfig() fmt.Printf("Starting mDNS server on %v\n", config.NameConfig.DNS) addr4, err := net.ResolveUDPAddr("udp4", mdns.DefaultAddressIPv4) if err != nil { diff --git a/ui/src/hooks/stores.ts b/ui/src/hooks/stores.ts index b549f89..3b37738 100644 --- a/ui/src/hooks/stores.ts +++ b/ui/src/hooks/stores.ts @@ -278,6 +278,9 @@ interface SettingsState { backlightSettings: BacklightSettings; setBacklightSettings: (settings: BacklightSettings) => void; + + nameConfig: NameConfig; + setNameConfig: (config: NameConfig) => void; } export const useSettingsStore = create( @@ -303,6 +306,12 @@ export const useSettingsStore = create( }, setBacklightSettings: (settings: BacklightSettings) => set({ backlightSettings: settings }), + + nameConfig: { + name: "JetKVM", + dns: "jetkvm.local" + }, + setNameConfig: (config: NameConfig) => set({ nameConfig: config }), }), { name: "settings", diff --git a/ui/src/routes/devices.$id.settings.appearance.tsx b/ui/src/routes/devices.$id.settings.appearance.tsx index 77f16d8..b5a0796 100644 --- a/ui/src/routes/devices.$id.settings.appearance.tsx +++ b/ui/src/routes/devices.$id.settings.appearance.tsx @@ -4,7 +4,7 @@ import { InputFieldWithLabel } from "@components/InputField"; import { SettingsPageHeader } from "../components/SettingsPageheader"; import { SelectMenuBasic } from "../components/SelectMenuBasic"; import { SettingsItem } from "./devices.$id.settings"; -import { NameConfig } from "@/hooks/stores"; +import {NameConfig, useSettingsStore} from "@/hooks/stores"; import { useJsonRpc } from "@/hooks/useJsonRpc"; import notifications from "@/notifications"; @@ -12,18 +12,11 @@ export default function SettingsAppearanceRoute() { const [currentTheme, setCurrentTheme] = useState(() => { return localStorage.theme || "system"; }); - const [nameConfig, setNameConfig] = useState({ - name: '', - dns: '', - }); const [send] = useJsonRpc(); + const [name, setName] = useState(""); - send("getNameConfig", {}, resp => { - if ("error" in resp) return; - const results = resp.result as NameConfig; - setNameConfig(results); - document.title = results.name; - }); + const nameConfigSettings = useSettingsStore(state => state.nameConfig); + const setNameConfigSettings = useSettingsStore(state => state.setNameConfig); const handleThemeChange = useCallback((value: string) => { const root = document.documentElement; @@ -43,24 +36,24 @@ export default function SettingsAppearanceRoute() { } }, []); - const handleDeviceNameChange = (deviceName: string) => { - setNameConfig({... nameConfig, name: deviceName}) + const handleNameChange = (value: string) => { + setName(value); }; - const handleUpdateNameConfig = useCallback(() => { - send("setNameConfig", { deviceName: nameConfig.name }, resp => { + const handleNameSave = useCallback(() => { + send("setNameConfig", { deviceName: name }, resp => { if ("error" in resp) { - notifications.error( - `Failed to set name config: ${resp.error.data || "Unknown error"}`, - ); + notifications.error(`Failed to set name config: ${resp.error.data || "Unknown error"}`); return; } - const rNameConfig = resp.result as NameConfig; - setNameConfig(rNameConfig); - document.title = rNameConfig.name; - notifications.success(`Device name set to "${rNameConfig.name}" successfully.\nDNS Name set to "${rNameConfig.dns}"`); + const nameConfig = resp.result as NameConfig; + setNameConfigSettings(nameConfig); + document.title = nameConfig.name; + notifications.success( + `Device name set to "${nameConfig.name}" successfully.\nDNS Name set to "${nameConfig.dns}"` + ); }); - }, [send, nameConfig]); + }, [send, name, setNameConfigSettings]); return (
@@ -89,9 +82,9 @@ export default function SettingsAppearanceRoute() { required label="" placeholder="Enter Device Name" - description={`DNS: ${nameConfig.dns}`} - defaultValue={nameConfig.name} - onChange={e => handleDeviceNameChange(e.target.value)} + description={`DNS: ${nameConfigSettings.dns}`} + defaultValue={nameConfigSettings.name} + onChange={e => handleNameChange(e.target.value)} />
@@ -99,7 +92,7 @@ export default function SettingsAppearanceRoute() { size="SM" theme="primary" text="Update Device Name" - onClick={handleUpdateNameConfig} + onClick={() => {handleNameSave()}} />
diff --git a/ui/src/routes/devices.$id.tsx b/ui/src/routes/devices.$id.tsx index 1c9723d..bb7ac99 100644 --- a/ui/src/routes/devices.$id.tsx +++ b/ui/src/routes/devices.$id.tsx @@ -8,6 +8,7 @@ import { useMountMediaStore, User, useRTCStore, + useSettingsStore, useUiStore, useUpdateStore, useVideoStore, @@ -129,6 +130,7 @@ export default function KvmIdRoute() { const setRpcDataChannel = useRTCStore(state => state.setRpcDataChannel); const setTransceiver = useRTCStore(state => state.setTransceiver); + const navigate = useNavigate(); const { otaState, setOtaState, setModalView } = useUpdateStore(); @@ -378,14 +380,17 @@ export default function KvmIdRoute() { }); }, [rpcDataChannel?.readyState, send, setHdmiState]); + const setNameConfig = useSettingsStore(state => state.setNameConfig); + useEffect(() => { send("getNameConfig", {}, resp => { if ("error" in resp) return; const results = resp.result as NameConfig; + console.log(`getNameConfig# name: ${results.name}, dns: ${results.dns}`); + setNameConfig(results) document.title = results.name; }); - }, [send]); - + }, [send, setNameConfig]) // eslint-disable-next-line @typescript-eslint/ban-ts-comment // @ts-expect-error