chore: fixes from deno linting/formatting

src/App.tsx

@@ -10,11 +10,13 @@ import Footer from "@components/UI/Footer.tsx";
 import { useAppStore } from "@core/stores/appStore.ts";
 import { useDeviceStore } from "@core/stores/deviceStore.ts";
 import { Dashboard } from "@pages/Dashboard/index.tsx";
+import type { JSX } from "react";
 import { ErrorBoundary } from "react-error-boundary";
-import { ErrorPage } from "./components/UI/ErrorPage.tsx";
+import { ErrorPage } from "@components/UI/ErrorPage.tsx";
 import { MapProvider } from "react-map-gl/maplibre";
 
-export const App = () => {
+
+export const App = (): JSX.Element => {
   const { getDevice } = useDeviceStore();
   const { selectedDevice, setConnectDialogOpen, connectDialogOpen } =
     useAppStore();
@@ -35,9 +37,8 @@ export const App = () => {
           <div className="flex grow">
             <DeviceSelector />
             <div className="flex grow flex-col">
-              {device
-                ? (
-                  <div className="flex h-screen">
+              {device ? (
+                <div className="flex h-screen w-full">
                   <DialogManager />
                   <KeyBackupReminder />
                   <CommandPalette />
@@ -45,8 +46,7 @@ export const App = () => {
                     <PageRouter />
                   </MapProvider>
                 </div>
-                )
-                : (
+              ) : (
                 <>
                   <Dashboard />
                   <Footer />

src/PageRouter.tsx

@@ -5,7 +5,7 @@ import ConfigPage from "@pages/Config/index.tsx";
 import MessagesPage from "@pages/Messages.tsx";
 import NodesPage from "@pages/Nodes.tsx";
 import { ErrorBoundary } from "react-error-boundary";
-import { ErrorPage } from "./components/UI/ErrorPage";
+import { ErrorPage } from "./components/UI/ErrorPage.tsx";
 
 export const ErrorBoundaryWrapper = ({
   children,

src/components/DeviceSelector.tsx

@@ -15,7 +15,6 @@ export const DeviceSelector = () => {
     setCommandPaletteOpen,
     setConnectDialogOpen,
   } = useAppStore();
-  console.log(import.meta.env.VITE_COMMIT_HASH);
 
   return (
     <nav className="flex flex-col justify-between border-r-[0.5px]  border-slate-300 pt-2 dark:border-slate-700">

src/components/Dialog/DeviceNameDialog.tsx

@@ -1,4 +1,4 @@
-import { useDevice } from "@app/core/stores/deviceStore.ts";
+import { useDevice } from "@core/stores/deviceStore.ts";
 import { create } from "@bufbuild/protobuf";
 import { Button } from "@components/UI/Button.tsx";
 import {

src/components/Dialog/DialogManager.tsx

@@ -1,4 +1,4 @@
-import { RemoveNodeDialog } from "@app/components/Dialog/RemoveNodeDialog.tsx";
+import { RemoveNodeDialog } from "@components/Dialog/RemoveNodeDialog.tsx";
 import { DeviceNameDialog } from "@components/Dialog/DeviceNameDialog.tsx";
 import { ImportDialog } from "@components/Dialog/ImportDialog.tsx";
 import { PkiBackupDialog } from "./PKIBackupDialog.tsx";

src/components/Dialog/RemoveNodeDialog.tsx

@@ -1,5 +1,5 @@
 import { useAppStore } from "../../core/stores/appStore.ts";
-import { useDevice } from "@app/core/stores/deviceStore.ts";
+import { useDevice } from "@core/stores/deviceStore.ts";
 import { Button } from "@components/UI/Button.tsx";
 import {
   Dialog,

src/components/Form/DynamicForm.tsx

@@ -13,7 +13,7 @@ import {
   type SubmitHandler,
   useForm,
 } from "react-hook-form";
-import { Heading } from "../UI/Typography/Heading";
+import { Heading } from "../UI/Typography/Heading.tsx";
 
 interface DisabledBy<T> {
   fieldName: Path<T>;

src/components/PageComponents/Config/Security/Security.tsx

@@ -1,18 +1,18 @@
-import { PkiRegenerateDialog } from "../../../Dialog/PkiRegenerateDialog.tsx";
-import { DynamicForm } from "@app/components/Form/DynamicForm.tsx";
-import { useAppStore } from "../../../../core/stores/appStore.ts";
+import { PkiRegenerateDialog } from "@components/Dialog/PkiRegenerateDialog.tsx";
+import { DynamicForm } from "@components/Form/DynamicForm.tsx";
+import { useAppStore } from "@core/stores/appStore.ts";
 import {
   getX25519PrivateKey,
   getX25519PublicKey,
-} from "../../../../core/utils/x25519.ts";
-import type { SecurityValidation } from "@app/validation/config/security.tsx";
+} from "@core/utils/x25519.ts";
+import type { SecurityValidation } from "@app/validation/config/security.ts";
 import { create } from "@bufbuild/protobuf";
 import { useDevice } from "@core/stores/deviceStore.ts";
 import { Protobuf } from "@meshtastic/core";
 import { fromByteArray, toByteArray } from "base64-js";
 import { Eye, EyeOff } from "lucide-react";
 import { useReducer } from "react";
-import { securityReducer } from "./securityReducer.tsx";
+import { securityReducer } from "@components/PageComponents/Config/Security/securityReducer.tsx";
 
 export const Security = () => {
   const { config, setWorkingConfig, setDialogOpen } = useDevice();

src/components/PageComponents/Connect/HTTP.tsx

@@ -1,4 +1,4 @@
-import type { TabElementProps } from "@app/components/Dialog/NewDeviceDialog.tsx";
+import type { TabElementProps } from "@components/Dialog/NewDeviceDialog.tsx";
 import { Button } from "@components/UI/Button.tsx";
 import { Input } from "@components/UI/Input.tsx";
 import { Label } from "@components/UI/Label.tsx";

src/components/PageComponents/Connect/Serial.tsx

@@ -59,7 +59,8 @@ export const Serial = ({ closeDialog }: TabElementProps) => {
                 await onConnect(port);
               }}
             >
-              {`# ${index} - ${usbVendorId ?? "UNK"} - ${usbProductId ?? "UNK"
+              {`# ${index} - ${usbVendorId ?? "UNK"} - ${
+                usbProductId ?? "UNK"
               }`}
             </Button>
           );

src/components/PageComponents/Map/NodeDetail.tsx

@@ -1,7 +1,7 @@
-import { Separator } from "@app/components/UI/Seperator.tsx";
-import { Heading } from "@app/components/UI/Typography/Heading.tsx";
-import { Subtle } from "@app/components/UI/Typography/Subtle.tsx";
-import { formatQuantity } from "@app/core/utils/string.ts";
+import { Separator } from "@components/UI/Seperator.tsx";
+import { Heading } from "@components/UI/Typography/Heading.tsx";
+import { Subtle } from "@components/UI/Typography/Subtle.tsx";
+import { formatQuantity } from "@core/utils/string.ts";
 import { Avatar } from "@components/UI/Avatar.tsx";
 import { Mono } from "@components/generic/Mono.tsx";
 import { TimeAgo } from "@components/generic/TimeAgo.tsx";

src/components/PageComponents/Messages/ChannelChat.tsx

@@ -1,7 +1,4 @@
-import {
-  type MessageWithState,
-  useDevice,
-} from "@app/core/stores/deviceStore.ts";
+import { type MessageWithState, useDevice } from "@core/stores/deviceStore.ts";
 import { Message } from "@components/PageComponents/Messages/Message.tsx";
 import { MessageInput } from "@components/PageComponents/Messages/MessageInput.tsx";
 import type { Types } from "@meshtastic/core";

src/components/PageComponents/Messages/Message.tsx

@@ -8,7 +8,7 @@ import {
 import {
   type MessageWithState,
   useDeviceStore,
-} from "@app/core/stores/deviceStore.ts";
+} from "@core/stores/deviceStore.ts";
 import { cn } from "@core/utils/cn.ts";
 import { Avatar } from "@components/UI/Avatar.tsx";
 import type { Protobuf } from "@meshtastic/core";
@@ -44,13 +44,13 @@ const STATUS_TEXT_MAP: Record<MessageState, string> = {
   [MESSAGE_STATES.ACK]: "Message delivered",
   [MESSAGE_STATES.WAITING]: "Waiting for delivery",
   [MESSAGE_STATES.FAILED]: "Delivery failed",
-} as const;
+};
 
 const STATUS_ICON_MAP: Record<MessageState, LucideIcon> = {
   [MESSAGE_STATES.ACK]: CheckCircle2,
   [MESSAGE_STATES.WAITING]: CircleEllipsis,
   [MESSAGE_STATES.FAILED]: AlertCircle,
-} as const;
+};
 
 const getStatusText = (state: MessageState): string => STATUS_TEXT_MAP[state];
 

src/components/PageComponents/Messages/TraceRoute.tsx

@@ -1,4 +1,4 @@
-import { useDevice } from "@app/core/stores/deviceStore.ts";
+import { useDevice } from "@core/stores/deviceStore.ts";
 import type { Protobuf } from "@meshtastic/core";
 import { numberToHexUnpadded } from "@noble/curves/abstract/utils";
 

src/components/PageComponents/ModuleConfig/AmbientLighting.tsx

@@ -1,4 +1,4 @@
-import { useDevice } from "@app/core/stores/deviceStore.ts";
+import { useDevice } from "@core/stores/deviceStore.ts";
 import type { AmbientLightingValidation } from "@app/validation/moduleConfig/ambientLighting.tsx";
 import { create } from "@bufbuild/protobuf";
 import { DynamicForm } from "@components/Form/DynamicForm.tsx";

src/components/PageComponents/ModuleConfig/DetectionSensor.tsx

@@ -1,4 +1,4 @@
-import { useDevice } from "@app/core/stores/deviceStore.ts";
+import { useDevice } from "@core/stores/deviceStore.ts";
 import type { DetectionSensorValidation } from "@app/validation/moduleConfig/detectionSensor.tsx";
 import { create } from "@bufbuild/protobuf";
 import { DynamicForm } from "@components/Form/DynamicForm.tsx";

src/components/PageComponents/ModuleConfig/MQTT.tsx

@@ -1,4 +1,4 @@
-import { useDevice } from "@app/core/stores/deviceStore.ts";
+import { useDevice } from "@core/stores/deviceStore.ts";
 import type { MqttValidation } from "@app/validation/moduleConfig/mqtt.tsx";
 import { create } from "@bufbuild/protobuf";
 import { DynamicForm } from "@components/Form/DynamicForm.tsx";

src/components/PageComponents/ModuleConfig/NeighborInfo.tsx

@@ -1,4 +1,4 @@
-import { useDevice } from "@app/core/stores/deviceStore.ts";
+import { useDevice } from "@core/stores/deviceStore.ts";
 import type { NeighborInfoValidation } from "@app/validation/moduleConfig/neighborInfo.tsx";
 import { create } from "@bufbuild/protobuf";
 import { DynamicForm } from "@components/Form/DynamicForm.tsx";

src/components/PageLayout.tsx

@@ -1,4 +1,4 @@
-import { cn } from "@app/core/utils/cn.ts";
+import { cn } from "@core/utils/cn.ts";
 import { AlignLeftIcon, type LucideIcon } from "lucide-react";
 import Footer from "@components/UI/Footer.tsx";
 import { Spinner } from "@components/UI/Spinner.tsx";

src/components/UI/ErrorPage.tsx

@@ -1,8 +1,8 @@
-import newGithubIssueUrl from "@app/core/utils/github";
+import newGithubIssueUrl from "../../core/utils/github.ts";
 import { ExternalLink } from "lucide-react";
-import { Heading } from "./Typography/Heading";
-import { Link } from "./Typography/Link";
-import { P } from "./Typography/P";
+import { Heading } from "./Typography/Heading.tsx";
+import { Link } from "./Typography/Link.tsx";
+import { P } from "./Typography/P.tsx";
 
 export function ErrorPage({ error }: { error: Error }) {
   if (!error) {

src/components/UI/Sidebar/SidebarSection.tsx

@@ -1,4 +1,4 @@
-import { Heading } from "../Typography/Heading";
+import { Heading } from "../Typography/Heading.tsx";
 
 export interface SidebarSectionProps {
   label: string;

src/components/UI/Typography/Heading.tsx

@@ -2,7 +2,8 @@ import type React from "react";
 
 const headingStyles = {
   h1: "scroll-m-20 text-4xl font-extrabold tracking-tight lg:text-5xl",
-  h2: "scroll-m-20 border-b border-b-slate-200 pb-2 text-3xl font-semibold tracking-tight transition-colors first:mt-0 dark:border-b-slate-700",
+  h2:
+    "scroll-m-20 border-b border-b-slate-200 pb-2 text-3xl font-semibold tracking-tight transition-colors first:mt-0 dark:border-b-slate-700",
   h3: "scroll-m-20 text-2xl font-semibold tracking-tight",
   h4: "scroll-m-20 text-xl font-semibold tracking-tight",
   h5: "scroll-m-20 text-lg font-medium tracking-tight",

src/components/UI/Typography/P.tsx

@@ -1,4 +1,4 @@
-import { cn } from "@app/core/utils/cn";
+import { cn } from "@core/utils/cn.ts";
 
 export interface PProps {
   children: React.ReactNode;

src/components/UI/Typography/Subtle.tsx

@@ -1,4 +1,4 @@
-import { cn } from "@app/core/utils/cn.ts";
+import { cn } from "@core/utils/cn.ts";
 
 export interface SubtleProps {
   className?: string;

src/core/utils/github.ts

@@ -62,8 +62,7 @@ export default function newGithubIssueUrl(
 }
 
 function validateOptions(options: GithubIssueUrlOptions): ValidatedOptions {
-  const repoUrl =
-    options.repoUrl ??
+  const repoUrl = options.repoUrl ??
     (options.user && options.repo
       ? `https://github.com/${options.user}/${options.repo}`
       : undefined);

src/pages/Channels.tsx

@@ -3,7 +3,7 @@ import {
   TabsContent,
   TabsList,
   TabsTrigger,
-} from "@app/components/UI/Tabs.tsx";
+} from "@components/UI/Tabs.tsx";
 import { Channel } from "@components/PageComponents/Channel.tsx";
 import { PageLayout } from "@components/PageLayout.tsx";
 import { Sidebar } from "@components/Sidebar.tsx";

src/pages/Config/ModuleConfig.tsx

@@ -1,6 +1,6 @@
-import { AmbientLighting } from "@app/components/PageComponents/ModuleConfig/AmbientLighting.tsx";
-import { DetectionSensor } from "@app/components/PageComponents/ModuleConfig/DetectionSensor.tsx";
-import { NeighborInfo } from "@app/components/PageComponents/ModuleConfig/NeighborInfo.tsx";
+import { AmbientLighting } from "@components/PageComponents/ModuleConfig/AmbientLighting.tsx";
+import { DetectionSensor } from "@components/PageComponents/ModuleConfig/DetectionSensor.tsx";
+import { NeighborInfo } from "@components/PageComponents/ModuleConfig/NeighborInfo.tsx";
 import { Audio } from "@components/PageComponents/ModuleConfig/Audio.tsx";
 import { CannedMessage } from "@components/PageComponents/ModuleConfig/CannedMessage.tsx";
 import { ExternalNotification } from "@components/PageComponents/ModuleConfig/ExternalNotification.tsx";

src/pages/Config/index.tsx

@@ -1,5 +1,5 @@
 import { useAppStore } from "../../core/stores/appStore.ts";
-import { useDevice } from "@app/core/stores/deviceStore.ts";
+import { useDevice } from "@core/stores/deviceStore.ts";
 import { PageLayout } from "@components/PageLayout.tsx";
 import { Sidebar } from "@components/Sidebar.tsx";
 import { SidebarSection } from "@components/UI/Sidebar/SidebarSection.tsx";

src/pages/Dashboard/index.tsx

@@ -1,6 +1,6 @@
-import { Heading } from "../../components/UI/Typography/Heading.tsx";
-import { useAppStore } from "@app/core/stores/appStore.ts";
-import { useDeviceStore } from "@app/core/stores/deviceStore.ts";
+import { Heading } from "@components/UI/Typography/Heading.tsx";
+import { useAppStore } from "@core/stores/appStore.ts";
+import { useDeviceStore } from "@core/stores/deviceStore.ts";
 import { Button } from "@components/UI/Button.tsx";
 import { Separator } from "@components/UI/Seperator.tsx";
 import { Subtle } from "@components/UI/Typography/Subtle.tsx";
@@ -99,7 +99,7 @@ export const Dashboard = () => {
                 <Heading as="h3">No Devices</Heading>
                 <Subtle>Connect at least one device to get started</Subtle>
                 <Button
-                  className="gap-2"
+                  className="gap-2 dark:bg-white dark:text-slate-900 dark:hover:text-slate-100"
                   variant="default"
                   onClick={() => setConnectDialogOpen(true)}
                 >

src/pages/Nodes.tsx

@@ -11,7 +11,7 @@ import { useDevice } from "@core/stores/deviceStore.ts";
 import { Protobuf, type Types } from "@meshtastic/core";
 import { numberToHexUnpadded } from "@noble/curves/abstract/utils";
 import { LockIcon, LockOpenIcon } from "lucide-react";
-import { Fragment, useCallback, useEffect, useState } from "react";
+import { type JSX, useCallback, useEffect, useState } from "react";
 import { base16 } from "rfc4648";
 
 export interface DeleteNoteDialogProps {
@@ -138,11 +138,9 @@ const NodesPage = () => {
                   ?.join(":") ?? "UNK"}
               </Mono>,
               <Mono className="px-4" key="lastHeard">
-                {node.lastHeard === 0 ? (
-                  <p className="px-4">Never</p>
-                ) : (
-                  <TimeAgo timestamp={node.lastHeard * 1000} />
-                )}
+                {node.lastHeard === 0
+                  ? <p className="px-4">Never</p>
+                  : <TimeAgo timestamp={node.lastHeard * 1000} />}
               </Mono>,
               <Mono key="snr">
                 {node.snr}db/
@@ -150,11 +148,9 @@ const NodesPage = () => {
                 {(node.snr + 10) * 5}raw
               </Mono>,
               <Mono key="pki">
-                {node.user?.publicKey && node.user?.publicKey.length > 0 ? (
-                  <LockIcon className="text-green-600 mx-auto" />
-                ) : (
-                  <LockOpenIcon className="text-yellow-300 mx-auto" />
-                )}
+                {node.user?.publicKey && node.user?.publicKey.length > 0
+                  ? <LockIcon className="text-green-600 mx-auto" />
+                  : <LockOpenIcon className="text-yellow-300 mx-auto" />}
               </Mono>,
               <Mono key="hops">
                 {node?.lastHeard !== 0