cleanup dialog state

src/components/CommandPalette/Index.tsx

@@ -77,14 +77,7 @@ export const CommandPalette = (): JSX.Element => {
   } = useAppStore();
   const { getDevices } = useDeviceStore();
 
-  const {
+  const { setDialogOpen, setActivePage, connection } = useDevice();
-    setQRDialogOpen,
-    setImportDialogOpen,
-    setShutdownDialogOpen,
-    setRebootDialogOpen,
-    setActivePage,
-    connection
-  } = useDevice();
 
   const groups: Group[] = [
     {
@@ -182,14 +175,14 @@ export const CommandPalette = (): JSX.Element => {
               name: "Generator",
               icon: <QueueListIcon className="w-4" />,
               action() {
-                setQRDialogOpen(true);
+                setDialogOpen("QR", true);
               }
             },
             {
               name: "Import",
               icon: <ArrowDownOnSquareStackIcon className="w-4" />,
               action() {
-                setImportDialogOpen(true);
+                setDialogOpen("import", true);
               }
             }
           ]
@@ -207,14 +200,14 @@ export const CommandPalette = (): JSX.Element => {
           name: "Schedule Shutdown",
           icon: PowerIcon,
           action() {
-            setShutdownDialogOpen(true);
+            setDialogOpen("shutdown", true);
           }
         },
         {
           name: "Schedule Reboot",
           icon: ArrowPathIcon,
           action() {
-            setRebootDialogOpen(true);
+            setDialogOpen("reboot", true);
           }
         },
         {

src/components/Dialog/DialogManager.tsx

@@ -8,46 +8,35 @@ import { ShutdownDialog } from "./ShutdownDialog.js";
 import { ImportDialog } from "./ImportDialog.js";
 
 export const DialogManager = (): JSX.Element => {
-  const {
+  const { channels, config, dialog, setDialogOpen } = useDevice();
-    channels,
-    config,
-    importDialogOpen,
-    setImportDialogOpen,
-    QRDialogOpen,
-    setQRDialogOpen,
-    shutdownDialogOpen,
-    setShutdownDialogOpen,
-    rebootDialogOpen,
-    setRebootDialogOpen
-  } = useDevice();
   return (
     <>
       <QRDialog
-        isOpen={QRDialogOpen}
+        isOpen={dialog.QR}
         close={() => {
-          setQRDialogOpen(false);
+          setDialogOpen("QR", false);
         }}
         channels={channels.map((ch) => ch.config)}
         loraConfig={config.lora}
       />
       <ImportDialog
-        isOpen={importDialogOpen}
+        isOpen={dialog.import}
         close={() => {
-          setImportDialogOpen(false);
+          setDialogOpen("import", false);
         }}
         channels={channels.map((ch) => ch.config)}
         loraConfig={config.lora}
       />
       <ShutdownDialog
-        isOpen={shutdownDialogOpen}
+        isOpen={dialog.shutdown}
         close={() => {
-          setShutdownDialogOpen(false);
+          setDialogOpen("shutdown", false);
         }}
       />
       <RebootDialog
-        isOpen={rebootDialogOpen}
+        isOpen={dialog.reboot}
         close={() => {
-          setRebootDialogOpen(false);
+          setDialogOpen("reboot", false);
         }}
       />
     </>

src/components/Dialog/RebootDialog.tsx

@@ -17,7 +17,7 @@ export const RebootDialog = ({
   isOpen,
   close
 }: RebootDialogProps): JSX.Element => {
-  const { connection, setRebootDialogOpen } = useDevice();
+  const { connection, setDialogOpen } = useDevice();
 
   const [time, setTime] = useState<number>(5);
 
@@ -38,7 +38,7 @@ export const RebootDialog = ({
             action() {
               connection
                 ?.reboot(time * 60)
-                .then(() => setRebootDialogOpen(false));
+                .then(() => setDialogOpen("reboot", false));
             }
           }}
         />
@@ -46,7 +46,7 @@ export const RebootDialog = ({
           className="w-24"
           iconBefore={<ArrowPathIcon className="w-4" />}
           onClick={() => {
-            connection?.reboot(2).then(() => setRebootDialogOpen(false));
+            connection?.reboot(2).then(() => setDialogOpen("reboot", false));
           }}
         >
           Now

src/components/Dialog/ShutdownDialog.tsx

@@ -17,7 +17,7 @@ export const ShutdownDialog = ({
   isOpen,
   close
 }: ShutdownDialogProps): JSX.Element => {
-  const { connection, setShutdownDialogOpen } = useDevice();
+  const { connection, setDialogOpen } = useDevice();
 
   const [time, setTime] = useState<number>(5);
 
@@ -38,7 +38,7 @@ export const ShutdownDialog = ({
             action() {
               connection
                 ?.shutdown(time * 60)
-                .then(() => setShutdownDialogOpen(false));
+                .then(() => setDialogOpen("shutdown", false));
             }
           }}
         />
@@ -46,7 +46,9 @@ export const ShutdownDialog = ({
           className="w-24"
           iconBefore={<PowerIcon className="w-4" />}
           onClick={() => {
-            connection?.shutdown(2).then(() => setShutdownDialogOpen(false));
+            connection
+              ?.shutdown(2)
+              .then(() => setDialogOpen("shutdown", false));
           }}
         >
           Now

src/core/stores/deviceStore.ts

@@ -52,6 +52,18 @@ export interface processPacketParams {
   time: number;
 }
 
+export type WorkingConfig = [
+  Protobuf.Config_DeviceConfig?,
+  Protobuf.Config_PositionConfig?,
+  Protobuf.Config_PowerConfig?,
+  Protobuf.Config_NetworkConfig?,
+  Protobuf.Config_DisplayConfig?,
+  Protobuf.Config_LoRaConfig?,
+  Protobuf.Config_BluetoothConfig?
+];
+
+export type DialogVariant = "import" | "QR" | "shutdown" | "reboot";
+
 export interface Device {
   id: number;
   ready: boolean;
@@ -68,12 +80,15 @@ export interface Device {
   waypoints: Protobuf.Waypoint[];
   regionUnset: boolean;
   currentMetrics: Protobuf.DeviceMetrics;
-  importDialogOpen: boolean;
-  QRDialogOpen: boolean;
-  shutdownDialogOpen: boolean;
-  rebootDialogOpen: boolean;
   pendingSettingsChanges: boolean;
   messageDraft: string;
+  workingConfig: WorkingConfig;
+  dialog: {
+    import: boolean;
+    QR: boolean;
+    shutdown: boolean;
+    reboot: boolean;
+  };
 
   setReady(ready: boolean): void;
   setStatus: (status: Types.DeviceStatusEnum) => void;
@@ -101,10 +116,7 @@ export interface Device {
     messageId: number,
     state: MessageState
   ) => void;
-  setImportDialogOpen: (open: boolean) => void;
+  setDialogOpen: (dialog: DialogVariant, open: boolean) => void;
-  setQRDialogOpen: (open: boolean) => void;
-  setShutdownDialogOpen: (open: boolean) => void;
-  setRebootDialogOpen: (open: boolean) => void;
   processPacket: (data: processPacketParams) => void;
   setMessageDraft: (message: string) => void;
 }
@@ -142,12 +154,15 @@ export const useDeviceStore = create<DeviceState>((set, get) => ({
           waypoints: [],
           regionUnset: false,
           currentMetrics: new Protobuf.DeviceMetrics(),
-          importDialogOpen: false,
+          dialog: {
-          QRDialogOpen: false,
+            import: false,
-          shutdownDialogOpen: false,
+            QR: false,
-          rebootDialogOpen: false,
+            shutdown: false,
+            reboot: false
+          },
           pendingSettingsChanges: false,
           messageDraft: "",
+          workingConfig: [],
 
           setReady: (ready: boolean) => {
             set(
@@ -486,43 +501,14 @@ export const useDeviceStore = create<DeviceState>((set, get) => ({
               })
             );
           },
-          setImportDialogOpen: (open: boolean) => {
+          setDialogOpen: (dialog: DialogVariant, open: boolean) => {
             set(
               produce<DeviceState>((draft) => {
                 const device = draft.devices.get(id);
-                if (device) {
+                if (!device) {
-                  device.importDialogOpen = open;
+                  return;
-                }
-              })
-            );
-          },
-          setQRDialogOpen: (open: boolean) => {
-            set(
-              produce<DeviceState>((draft) => {
-                const device = draft.devices.get(id);
-                if (device) {
-                  device.QRDialogOpen = open;
-                }
-              })
-            );
-          },
-          setShutdownDialogOpen: (open: boolean) => {
-            set(
-              produce<DeviceState>((draft) => {
-                const device = draft.devices.get(id);
-                if (device) {
-                  device.shutdownDialogOpen = open;
-                }
-              })
-            );
-          },
-          setRebootDialogOpen: (open: boolean) => {
-            set(
-              produce<DeviceState>((draft) => {
-                const device = draft.devices.get(id);
-                if (device) {
-                  device.rebootDialogOpen = open;
                 }
+                device.dialog[dialog] = open;
               })
             );
           },

src/pages/Channels.tsx

@@ -11,7 +11,7 @@ import {
 import { Protobuf } from "@meshtastic/meshtasticjs";
 
 export const ChannelsPage = (): JSX.Element => {
-  const { channels, setQRDialogOpen, setImportDialogOpen } = useDevice();
+  const { channels, setDialogOpen } = useDevice();
 
   const tabs: TabType[] = channels.map((channel) => {
     return {
@@ -30,11 +30,11 @@ export const ChannelsPage = (): JSX.Element => {
       actions={[
         {
           icon: <ArrowDownOnSquareStackIcon className="w-4" />,
-          action: () => setImportDialogOpen(true)
+          action: () => setDialogOpen("import", true)
         },
         {
           icon: <QrCodeIcon className="w-4" />,
-          action: () => setQRDialogOpen(true)
+          action: () => setDialogOpen("QR", true)
         }
       ]}
     />