cleanup dialog state

src/components/CommandPalette/Index.tsx

@@ -77,14 +77,7 @@ export const CommandPalette = (): JSX.Element => {
   } = useAppStore();
   const { getDevices } = useDeviceStore();
 
-  const {
-    setQRDialogOpen,
-    setImportDialogOpen,
-    setShutdownDialogOpen,
-    setRebootDialogOpen,
-    setActivePage,
-    connection
-  } = useDevice();
+  const { setDialogOpen, 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 {
-    channels,
-    config,
-    importDialogOpen,
-    setImportDialogOpen,
-    QRDialogOpen,
-    setQRDialogOpen,
-    shutdownDialogOpen,
-    setShutdownDialogOpen,
-    rebootDialogOpen,
-    setRebootDialogOpen
-  } = useDevice();
+  const { channels, config, dialog, setDialogOpen } = 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