update deps & lint

2024-01-06 10:15:49 +10:00
parent 079bbed620
commit 7fb2da396f
37 changed files with 261 additions and 267 deletions
@@ -5,7 +5,6 @@ import { useAppStore } from "@core/stores/appStore.js";
 import { useDeviceStore } from "@core/stores/deviceStore.js";
 import { Hashicon } from "@emeraldpay/hashicon-react";
 import {
-  GithubIcon,
  HomeIcon,
  LanguagesIcon,
  MoonIcon,
@@ -1,5 +1,3 @@
-import { cn } from "@app/core/utils/cn.js";
-
 export interface DeviceSelectorButtonProps {
  active: boolean;
  onClick: () => void;
@@ -26,14 +26,14 @@ export const ImportDialog = ({
  open,
  onOpenChange,
 }: ImportDialogProps): JSX.Element => {
-  const [QRCodeURL, setQRCodeURL] = useState<string>("");
+  const [qrCodeUrl, setQrCodeUrl] = useState<string>("");
  const [channelSet, setChannelSet] = useState<Protobuf.AppOnly.ChannelSet>();
-  const [validURL, setValidURL] = useState<boolean>(false);
+  const [validUrl, setValidUrl] = useState<boolean>(false);

  const { connection } = useDevice();

  useEffect(() => {
-    const base64String = QRCodeURL.split("e/#")[1];
+    const base64String = qrCodeUrl.split("e/#")[1];
    const paddedString = base64String
      ?.padEnd(base64String.length + ((4 - (base64String.length % 4)) % 4), "=")
      .replace(/-/g, "+")
@@ -42,12 +42,12 @@ export const ImportDialog = ({
      setChannelSet(
        Protobuf.AppOnly.ChannelSet.fromBinary(toByteArray(paddedString)),
      );
-      setValidURL(true);
+      setValidUrl(true);
    } catch (error) {
-      setValidURL(false);
+      setValidUrl(false);
      setChannelSet(undefined);
    }
-  }, [QRCodeURL]);
+  }, [qrCodeUrl]);

  const apply = () => {
    channelSet?.settings.map((ch, index) => {
@@ -87,19 +87,19 @@ export const ImportDialog = ({
        <div className="flex flex-col gap-3">
          <Label>Channel Set/QR Code URL</Label>
          <Input
-            value={QRCodeURL}
-            suffix={validURL ? "✅" : "❌"}
+            value={qrCodeUrl}
+            suffix={validUrl ? "✅" : "❌"}
            onChange={(e) => {
-              setQRCodeURL(e.target.value);
+              setQrCodeUrl(e.target.value);
            }}
          />
-          {validURL && (
+          {validUrl && (
            <div className="flex flex-col gap-3">
              <div className="flex w-full gap-2">
                <div className="w-36">
                  <Label>Use Preset?</Label>
                  <Switch
-                    disabled
+                    disabled={true}
                    checked={channelSet?.loraConfig?.usePreset ?? true}
                  />
                </div>
@@ -138,7 +138,7 @@ export const ImportDialog = ({
          )}
        </div>
        <DialogFooter>
-          <Button onClick={apply} disabled={!validURL}>
+          <Button onClick={apply} disabled={!validUrl}>
            Apply
          </Button>
        </DialogFooter>
@@ -4,7 +4,6 @@ import { Serial } from "@components/PageComponents/Connect/Serial.js";
 import {
  Dialog,
  DialogContent,
-  DialogDescription,
  DialogHeader,
  DialogTitle,
 } from "@components/UI/Dialog.js";
@@ -29,7 +29,7 @@ export const QRDialog = ({
  channels,
 }: QRDialogProps): JSX.Element => {
  const [selectedChannels, setSelectedChannels] = useState<number[]>([0]);
-  const [QRCodeURL, setQRCodeURL] = useState<string>("");
+  const [qrCodeUrl, setQrCodeUrl] = useState<string>("");

  const allChannels = Array.from(channels.values());

@@ -49,7 +49,7 @@ export const QRDialog = ({
      .replace(/\+/g, "-")
      .replace(/\//g, "_");

-    setQRCodeURL(`https://meshtastic.org/e/#${base64}`);
+    setQrCodeUrl(`https://meshtastic.org/e/#${base64}`);
  }, [channels, selectedChannels, loraConfig]);

  return (
@@ -92,18 +92,18 @@ export const QRDialog = ({
                </div>
              ))}
            </div>
-            <QRCode value={QRCodeURL} size={200} qrStyle="dots" />
+            <QRCode value={qrCodeUrl} size={200} qrStyle="dots" />
          </div>
        </div>
        <DialogFooter>
          <Label>Sharable URL</Label>
          <Input
-            value={QRCodeURL}
-            disabled
+            value={qrCodeUrl}
+            disabled={true}
            action={{
              icon: ClipboardIcon,
              onClick() {
-                void navigator.clipboard.writeText(QRCodeURL);
+                void navigator.clipboard.writeText(qrCodeUrl);
              },
            }}
          />
@@ -3,7 +3,6 @@ import {
  Dialog,
  DialogContent,
  DialogDescription,
-  DialogFooter,
  DialogHeader,
  DialogTitle,
 } from "@components/UI/Dialog.js";
@@ -8,7 +8,6 @@ import { H4 } from "@components/UI/Typography/H4.js";
 import { Subtle } from "@components/UI/Typography/Subtle.js";
 import {
  Control,
-  DeepPartial,
  DefaultValues,
  FieldValues,
  Path,
@@ -4,7 +4,7 @@ import type {
 } from "@components/Form/DynamicForm.js";
 import { Switch } from "@components/UI/Switch.js";
 import { ChangeEvent } from "react";
-import { Controller, FieldPathValue, FieldValues } from "react-hook-form";
+import { Controller, FieldValues } from "react-hook-form";

 export interface ToggleFieldProps<T> extends BaseFormBuilderProps<T> {
  type: "toggle";
@@ -4,7 +4,7 @@ import { useAppStore } from "@core/stores/appStore.js";
 import { useDeviceStore } from "@core/stores/deviceStore.js";
 import { subscribeAll } from "@core/subscriptions.js";
 import { randId } from "@core/utils/randId.js";
-import { Constants, BleConnection } from "@meshtastic/js";
+import { BleConnection, Constants } from "@meshtastic/js";
 import { useCallback, useEffect, useState } from "react";

 export const BLE = (): JSX.Element => {
@@ -6,7 +6,6 @@ import type { Page } from "@core/stores/deviceStore.js";
 import {
  EditIcon,
  LayersIcon,
-  LayoutGrid,
  LucideIcon,
  MapIcon,
  MessageSquareIcon,
@@ -80,7 +79,7 @@ export const Sidebar = ({ children }: SidebarProps): JSX.Element => {
          <SidebarButton
            key={link.name}
            label={link.name}
-            icon={link.icon}
+            Icon={link.icon}
            onClick={() => {
              setActivePage(link.page);
            }}
@@ -14,20 +14,16 @@ export function Toaster() {

  return (
    <ToastProvider>
-      {toasts.map(function ({ id, title, description, action, ...props }) {
-        return (
-          <Toast key={id} {...props}>
-            <div className="grid gap-1">
-              {title && <ToastTitle>{title}</ToastTitle>}
-              {description && (
-                <ToastDescription>{description}</ToastDescription>
-              )}
-            </div>
-            {action}
-            <ToastClose />
-          </Toast>
-        );
-      })}
+      {toasts.map(({ id, title, description, action, ...props }) => (
+        <Toast key={id} {...props}>
+          <div className="grid gap-1">
+            {title && <ToastTitle>{title}</ToastTitle>}
+            {description && <ToastDescription>{description}</ToastDescription>}
+          </div>
+          {action}
+          <ToastClose />
+        </Toast>
+      ))}
      <ToastViewport />
    </ToastProvider>
  );
@@ -4,7 +4,7 @@ import type { LucideIcon } from "lucide-react";
 export interface SidebarButtonProps {
  label: string;
  active?: boolean;
-  icon?: LucideIcon;
+  Icon?: LucideIcon;
  element?: JSX.Element;
  onClick?: () => void;
 }
@@ -12,7 +12,7 @@ export interface SidebarButtonProps {
 export const SidebarButton = ({
  label,
  active,
-  icon: Icon,
+  Icon,
  element,
  onClick,
 }: SidebarButtonProps): JSX.Element => (