refactor: added close button back to dialog

src/components/Dialog/DeviceNameDialog.tsx

@@ -3,6 +3,7 @@ import { create } from "@bufbuild/protobuf";
 import { Button } from "@components/UI/Button.tsx";
 import {
   Dialog,
+  DialogClose,
   DialogContent,
   DialogDescription,
   DialogFooter,
@@ -52,6 +53,7 @@ export const DeviceNameDialog = ({
   return (
     <Dialog open={open} onOpenChange={onOpenChange}>
       <DialogContent>
+        <DialogClose />
         <DialogHeader>
           <DialogTitle>Change Device Name</DialogTitle>
           <DialogDescription>

src/components/Dialog/ImportDialog.tsx

@@ -3,6 +3,7 @@ import { Button } from "@components/UI/Button.tsx";
 import { Checkbox } from "../UI/Checkbox/index.tsx";
 import {
   Dialog,
+  DialogClose,
   DialogContent,
   DialogDescription,
   DialogFooter,
@@ -96,6 +97,7 @@ export const ImportDialog = ({
   return (
     <Dialog open={open} onOpenChange={onOpenChange}>
       <DialogContent>
+        <DialogClose />
         <DialogHeader>
           <DialogTitle>Import Channel Set</DialogTitle>
           <DialogDescription>

src/components/Dialog/LocationResponseDialog.tsx

@@ -1,6 +1,7 @@
 import { useDevice } from "../../core/stores/deviceStore.ts";
 import {
   Dialog,
+  DialogClose,
   DialogContent,
   DialogDescription,
   DialogHeader,
@@ -31,6 +32,7 @@ export const LocationResponseDialog = ({
   return (
     <Dialog open={open} onOpenChange={onOpenChange}>
       <DialogContent>
+        <DialogClose />
         <DialogHeader>
           <DialogTitle>{`Location: ${longName} (${shortName})`}</DialogTitle>
         </DialogHeader>
@@ -41,9 +43,8 @@ export const LocationResponseDialog = ({
                 Coordinates:{" "}
                 <a
                   className="text-blue-500 dark:text-blue-400"
-                  href={`https://www.openstreetmap.org/?mlat=${
-                    location?.data.latitudeI / 1e7
-                  }&mlon=${location?.data.longitudeI / 1e7}&layers=N`}
+                  href={`https://www.openstreetmap.org/?mlat=${location?.data.latitudeI / 1e7
+                    }&mlon=${location?.data.longitudeI / 1e7}&layers=N`}
                   target="_blank"
                   rel="noreferrer"
                 >

src/components/Dialog/NewDeviceDialog.tsx

@@ -7,6 +7,7 @@ import { HTTP } from "@components/PageComponents/Connect/HTTP.tsx";
 import { Serial } from "@components/PageComponents/Connect/Serial.tsx";
 import {
   Dialog,
+  DialogClose,
   DialogContent,
   DialogHeader,
   DialogTitle,
@@ -135,6 +136,7 @@ export const NewDeviceDialog = ({
   return (
     <Dialog open={open} onOpenChange={onOpenChange}>
       <DialogContent>
+        <DialogClose />
         <DialogHeader>
           <DialogTitle>Connect New Device</DialogTitle>
         </DialogHeader>

src/components/Dialog/NodeDetailsDialog.tsx

@@ -8,6 +8,7 @@ import {
 } from "../UI/Accordion.tsx";
 import {
   Dialog,
+  DialogClose,
   DialogContent,
   DialogFooter,
   DialogHeader,
@@ -36,6 +37,7 @@ export const NodeDetailsDialog = ({
     ? (
       <Dialog open={open} onOpenChange={onOpenChange}>
         <DialogContent>
+          <DialogClose />
           <DialogHeader>
             <DialogTitle>
               Node Details for {device.user?.longName ?? "UNKNOWN"} (
@@ -85,11 +87,9 @@ export const NodeDetailsDialog = ({
                           Coordinates:{" "}
                           <a
                             className="text-blue-500 dark:text-blue-400"
-                            href={`https://www.openstreetmap.org/?mlat=${
-                              device.position.latitudeI / 1e7
-                            }&mlon=${
-                              device.position.longitudeI / 1e7
-                            }&layers=N`}
+                            href={`https://www.openstreetmap.org/?mlat=${device.position.latitudeI / 1e7
+                              }&mlon=${device.position.longitudeI / 1e7
+                              }&layers=N`}
                             target="_blank"
                             rel="noreferrer"
                           >
@@ -173,7 +173,7 @@ export const NodeDetailsDialog = ({
                         </AccordionTrigger>
                         <AccordionContent className="overflow-x-scroll">
                           <pre className="text-xs w-full">
-                        {JSON.stringify(device, null, 2)}
+                            {JSON.stringify(device, null, 2)}
                           </pre>
                         </AccordionContent>
                       </AccordionItem>

src/components/Dialog/NodeOptionsDialog.tsx

@@ -3,6 +3,7 @@ import { useAppStore } from "../../core/stores/appStore.ts";
 import { useDevice } from "../../core/stores/deviceStore.ts";
 import {
   Dialog,
+  DialogClose,
   DialogContent,
   DialogHeader,
   DialogTitle,
@@ -72,6 +73,7 @@ export const NodeOptionsDialog = ({
   return (
     <Dialog open={open} onOpenChange={onOpenChange}>
       <DialogContent>
+        <DialogClose />
         <DialogHeader>
           <DialogTitle>{`${longName} (${shortName})`}</DialogTitle>
         </DialogHeader>

src/components/Dialog/PKIBackupDialog.tsx

@@ -2,6 +2,7 @@ import { useDevice } from "../../core/stores/deviceStore.ts";
 import { Button } from "../UI/Button.tsx";
 import {
   Dialog,
+  DialogClose,
   DialogContent,
   DialogDescription,
   DialogFooter,
@@ -102,6 +103,7 @@ export const PkiBackupDialog = ({
   return (
     <Dialog open={open} onOpenChange={onOpenChange}>
       <DialogContent>
+        <DialogClose />
         <DialogHeader>
           <DialogTitle>Backup Keys</DialogTitle>
           <DialogDescription>

src/components/Dialog/PkiRegenerateDialog.tsx

@@ -1,6 +1,7 @@
 import { Button } from "@components/UI/Button.tsx";
 import {
   Dialog,
+  DialogClose,
   DialogContent,
   DialogDescription,
   DialogFooter,
@@ -22,6 +23,7 @@ export const PkiRegenerateDialog = ({
   return (
     <Dialog open={open} onOpenChange={onOpenChange}>
       <DialogContent>
+        <DialogClose />
         <DialogHeader>
           <DialogTitle>Regenerate Key pair?</DialogTitle>
           <DialogDescription>

src/components/Dialog/QRDialog.tsx

@@ -2,6 +2,7 @@ import { create, toBinary } from "@bufbuild/protobuf";
 import { Checkbox } from "../UI/Checkbox/index.tsx";
 import {
   Dialog,
+  DialogClose,
   DialogContent,
   DialogDescription,
   DialogFooter,
@@ -62,6 +63,7 @@ export const QRDialog = ({
   return (
     <Dialog open={open} onOpenChange={onOpenChange}>
       <DialogContent>
+        <DialogClose />
         <DialogHeader>
           <DialogTitle>Generate QR Code</DialogTitle>
           <DialogDescription>
@@ -107,8 +109,8 @@ export const QRDialog = ({
             <button
               type="button"
               className={`border-slate-900 border-t border-l border-b rounded-l h-10 px-7 py-2 text-sm font-medium focus:outline-hidden focus:ring-2 focus:ring-offset-2 ${qrCodeAdd
-                  ? "focus:ring-green-800 bg-green-800 text-white"
-                  : "focus:ring-slate-400 bg-slate-400 hover:bg-green-600"
+                ? "focus:ring-green-800 bg-green-800 text-white"
+                : "focus:ring-slate-400 bg-slate-400 hover:bg-green-600"
                 }`}
               onClick={() => setQrCodeAdd(true)}
             >
@@ -117,8 +119,8 @@ export const QRDialog = ({
             <button
               type="button"
               className={`border-slate-900 border-t border-r border-b rounded-r h-10 px-4 py-2 text-sm font-medium focus:outline-hidden focus:ring-2 focus:ring-offset-2 ${!qrCodeAdd
-                  ? "focus:ring-green-800 bg-green-800 text-white"
-                  : "focus:ring-slate-400 bg-slate-400 hover:bg-green-600"
+                ? "focus:ring-green-800 bg-green-800 text-white"
+                : "focus:ring-slate-400 bg-slate-400 hover:bg-green-600"
                 }`}
               onClick={() => setQrCodeAdd(false)}
             >

src/components/Dialog/RebootDialog.tsx

@@ -1,6 +1,7 @@
 import { Button } from "@components/UI/Button.tsx";
 import {
   Dialog,
+  DialogClose,
   DialogContent,
   DialogDescription,
   DialogHeader,
@@ -27,6 +28,7 @@ export const RebootDialog = ({
   return (
     <Dialog open={open} onOpenChange={onOpenChange}>
       <DialogContent>
+        <DialogClose />
         <DialogHeader>
           <DialogTitle>Schedule Reboot</DialogTitle>
           <DialogDescription>

src/components/Dialog/RemoveNodeDialog.tsx

@@ -3,6 +3,7 @@ import { useDevice } from "@core/stores/deviceStore.ts";
 import { Button } from "@components/UI/Button.tsx";
 import {
   Dialog,
+  DialogClose,
   DialogContent,
   DialogDescription,
   DialogFooter,
@@ -32,6 +33,7 @@ export const RemoveNodeDialog = ({
   return (
     <Dialog open={open} onOpenChange={onOpenChange}>
       <DialogContent>
+        <DialogClose />
         <DialogHeader>
           <DialogTitle>Remove Node?</DialogTitle>
           <DialogDescription>

src/components/Dialog/ShutdownDialog.tsx

@@ -1,6 +1,7 @@
 import { Button } from "@components/UI/Button.tsx";
 import {
   Dialog,
+  DialogClose,
   DialogContent,
   DialogDescription,
   DialogHeader,
@@ -27,6 +28,7 @@ export const ShutdownDialog = ({
   return (
     <Dialog open={open} onOpenChange={onOpenChange}>
       <DialogContent>
+        <DialogClose />
         <DialogHeader>
           <DialogTitle>Schedule Shutdown</DialogTitle>
           <DialogDescription>

src/components/Dialog/TracerouteResponseDialog.tsx

@@ -1,6 +1,7 @@
 import { useDevice } from "../../core/stores/deviceStore.ts";
 import {
   Dialog,
+  DialogClose,
   DialogContent,
   DialogDescription,
   DialogHeader,
@@ -36,6 +37,7 @@ export const TracerouteResponseDialog = ({
   return (
     <Dialog open={open} onOpenChange={onOpenChange}>
       <DialogContent>
+        <DialogClose />
         <DialogHeader>
           <DialogTitle>{`Traceroute: ${longName} (${shortName})`}</DialogTitle>
         </DialogHeader>