From 1012167c893d5ced7540b59acea8a0bff654bf34 Mon Sep 17 00:00:00 2001 From: Sacha Weatherstone Date: Sun, 9 Jul 2023 14:14:49 +1000 Subject: [PATCH] Second round of formatting --- src/App.tsx | 10 +++---- src/components/CommandPalette.tsx | 27 ++++++++--------- src/components/Dashboard.tsx | 28 ++++++++--------- src/components/DeviceSelector.tsx | 17 ++++++----- src/components/Dialog/DeviceNameDialog.tsx | 10 +++---- src/components/Dialog/DialogManager.tsx | 6 ++-- src/components/Dialog/ImportDialog.tsx | 20 ++++++------- src/components/Dialog/NewDeviceDialog.tsx | 8 ++--- src/components/Dialog/QRDialog.tsx | 12 ++++---- src/components/Dialog/RebootDialog.tsx | 8 ++--- src/components/Dialog/ShutdownDialog.tsx | 8 ++--- src/components/Form/DynamicForm.tsx | 18 +++++------ src/components/Form/DynamicFormField.tsx | 4 +-- src/components/Form/FormInput.tsx | 4 +-- src/components/Form/FormSelect.tsx | 14 ++++----- src/components/PageComponents/Channel.tsx | 6 ++-- .../PageComponents/Config/Bluetooth.tsx | 2 +- src/components/PageComponents/Config/LoRa.tsx | 2 +- .../PageComponents/Config/Network.tsx | 2 +- src/components/PageComponents/Connect/BLE.tsx | 8 ++--- .../PageComponents/Connect/HTTP.tsx | 10 +++---- .../PageComponents/Connect/Serial.tsx | 4 +-- .../PageComponents/Messages/ChannelChat.tsx | 2 +- .../PageComponents/Messages/Message.tsx | 6 ++-- .../PageComponents/Messages/MessageInput.tsx | 4 +-- .../PageComponents/ModuleConfig/Audio.tsx | 2 +- .../ModuleConfig/CannedMessage.tsx | 2 +- .../ModuleConfig/ExternalNotification.tsx | 2 +- .../PageComponents/ModuleConfig/RangeTest.tsx | 2 +- .../ModuleConfig/StoreForward.tsx | 2 +- src/components/PageLayout.tsx | 8 +++-- src/components/Sidebar.tsx | 17 ++++++----- src/components/UI/Button.tsx | 3 +- src/components/UI/Checkbox.tsx | 2 +- src/components/UI/Command.tsx | 8 ++--- src/components/UI/Dialog.tsx | 2 +- src/components/UI/DropdownMenu.tsx | 2 +- src/components/UI/Input.tsx | 1 + src/components/UI/Label.tsx | 2 +- src/components/UI/Menubar.tsx | 2 +- src/components/UI/Popover.tsx | 2 +- src/components/UI/ScrollArea.tsx | 2 +- src/components/UI/Select.tsx | 2 +- src/components/UI/Seperator.tsx | 2 +- src/components/UI/Sidebar/sidebarButton.tsx | 2 +- src/components/UI/Switch.tsx | 2 +- src/components/UI/Tabs.tsx | 2 +- src/components/UI/Toast.tsx | 2 +- src/components/UI/Tooltip.tsx | 2 +- src/components/generic/Table/index.tsx | 4 +-- src/core/hooks/useToast.ts | 12 ++++---- src/index.tsx | 2 +- src/pages/Channels.tsx | 18 +++++------ src/pages/Config/DeviceConfig.tsx | 6 ++-- src/pages/Config/ModuleConfig.tsx | 4 +-- src/pages/Config/index.tsx | 14 ++++----- src/pages/Map.tsx | 30 +++++++++---------- src/pages/Messages.tsx | 12 ++++---- src/pages/Peers.tsx | 6 ++-- 59 files changed, 216 insertions(+), 207 deletions(-) diff --git a/src/App.tsx b/src/App.tsx index 6ead6622..7105199e 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -1,15 +1,15 @@ -import { MapProvider } from "react-map-gl"; -import { useAppStore } from "@core/stores/appStore.js"; import { DeviceWrapper } from "@app/DeviceWrapper.js"; import { PageRouter } from "@app/PageRouter.js"; import { CommandPalette } from "@components/CommandPalette.js"; +import { Dashboard } from "@components/Dashboard.js"; import { DeviceSelector } from "@components/DeviceSelector.js"; import { DialogManager } from "@components/Dialog/DialogManager.js"; -import { Dashboard } from "@components/Dashboard.js"; -import { useDeviceStore } from "@core/stores/deviceStore.js"; -import { ThemeController } from "@components/generic/ThemeController.js"; import { NewDeviceDialog } from "@components/Dialog/NewDeviceDialog.js"; import { Toaster } from "@components/Toaster.js"; +import { ThemeController } from "@components/generic/ThemeController.js"; +import { useAppStore } from "@core/stores/appStore.js"; +import { useDeviceStore } from "@core/stores/deviceStore.js"; +import { MapProvider } from "react-map-gl"; export const App = (): JSX.Element => { const { getDevice } = useDeviceStore(); diff --git a/src/components/CommandPalette.tsx b/src/components/CommandPalette.tsx index 79f95d46..f6b75344 100644 --- a/src/components/CommandPalette.tsx +++ b/src/components/CommandPalette.tsx @@ -360,28 +360,27 @@ export const CommandPalette = (): JSX.Element => { No results found. - {groups.map((group, index) => ( - - {group.commands.map((command, index) => ( -
+ {groups.map((group) => ( + + {group.commands.map((command) => ( +
{ - command.action && command.action(); + command.action?.(); setCommandPaletteOpen(false); }} > {command.label} - {command.subItems && - command.subItems.map((subItem, index) => ( - - ))} + {command.subItems?.map((subItem) => ( + + ))}
))} diff --git a/src/components/Dashboard.tsx b/src/components/Dashboard.tsx index 45a58701..348f29d7 100644 --- a/src/components/Dashboard.tsx +++ b/src/components/Dashboard.tsx @@ -1,20 +1,20 @@ import { useAppStore } from "@app/core/stores/appStore.js"; -import { Button } from "@components/UI/Button.js"; -import { - PlusIcon, - ListPlusIcon, - UsersIcon, - MapPinIcon, - CalendarIcon, - BluetoothIcon, - UsbIcon, - NetworkIcon, -} from "lucide-react"; -import { Subtle } from "@components/UI/Typography/Subtle.js"; -import { H3 } from "@components/UI/Typography/H3.js"; import { useDeviceStore } from "@app/core/stores/deviceStore.js"; -import { useMemo } from "react"; +import { Button } from "@components/UI/Button.js"; import { Separator } from "@components/UI/Seperator.js"; +import { H3 } from "@components/UI/Typography/H3.js"; +import { Subtle } from "@components/UI/Typography/Subtle.js"; +import { + BluetoothIcon, + CalendarIcon, + ListPlusIcon, + MapPinIcon, + NetworkIcon, + PlusIcon, + UsbIcon, + UsersIcon, +} from "lucide-react"; +import { useMemo } from "react"; export const Dashboard = () => { const { setConnectDialogOpen } = useAppStore(); diff --git a/src/components/DeviceSelector.tsx b/src/components/DeviceSelector.tsx index b7d13905..116d808a 100644 --- a/src/components/DeviceSelector.tsx +++ b/src/components/DeviceSelector.tsx @@ -1,18 +1,18 @@ +import { DeviceSelectorButton } from "./DeviceSelectorButton.js"; +import { Separator } from "@components/UI/Seperator.js"; +import { Code } from "@components/UI/Typography/Code.js"; import { useAppStore } from "@core/stores/appStore.js"; import { useDeviceStore } from "@core/stores/deviceStore.js"; import { Hashicon } from "@emeraldpay/hashicon-react"; import { - PlusIcon, + GithubIcon, HomeIcon, LanguagesIcon, - SunIcon, MoonIcon, - GithubIcon, + PlusIcon, + SunIcon, TerminalIcon, } from "lucide-react"; -import { Separator } from "@components/UI/Seperator.js"; -import { Code } from "@components/UI/Typography/Code.js"; -import { DeviceSelectorButton } from "./DeviceSelectorButton.js"; export const DeviceSelector = (): JSX.Element => { const { getDevices } = useDeviceStore(); @@ -53,6 +53,7 @@ export const DeviceSelector = (): JSX.Element => { ))}
- diff --git a/src/components/Dialog/DeviceNameDialog.tsx b/src/components/Dialog/DeviceNameDialog.tsx index 61e10403..7504c0c3 100644 --- a/src/components/Dialog/DeviceNameDialog.tsx +++ b/src/components/Dialog/DeviceNameDialog.tsx @@ -1,4 +1,5 @@ -import { Input } from "@components/UI/Input.js"; +import { useDevice } from "@app/core/stores/deviceStore.js"; +import { Button } from "@components/UI/Button.js"; import { Dialog, DialogContent, @@ -7,11 +8,10 @@ import { DialogHeader, DialogTitle, } from "@components/UI/Dialog.js"; -import { Button } from "@components/UI/Button.js"; -import { useDevice } from "@app/core/stores/deviceStore.js"; -import { useForm } from "react-hook-form"; -import { Protobuf } from "@meshtastic/meshtasticjs"; +import { Input } from "@components/UI/Input.js"; import { Label } from "@components/UI/Label.js"; +import { Protobuf } from "@meshtastic/meshtasticjs"; +import { useForm } from "react-hook-form"; export interface User { longName: string; diff --git a/src/components/Dialog/DialogManager.tsx b/src/components/Dialog/DialogManager.tsx index 3417da8c..ccd359a3 100644 --- a/src/components/Dialog/DialogManager.tsx +++ b/src/components/Dialog/DialogManager.tsx @@ -1,9 +1,9 @@ -import { useDevice } from "@core/stores/deviceStore.js"; +import { DeviceNameDialog } from "./DeviceNameDialog.js"; +import { ImportDialog } from "@components/Dialog/ImportDialog.js"; import { QRDialog } from "@components/Dialog/QRDialog.js"; import { RebootDialog } from "@components/Dialog/RebootDialog.js"; import { ShutdownDialog } from "@components/Dialog/ShutdownDialog.js"; -import { ImportDialog } from "@components/Dialog/ImportDialog.js"; -import { DeviceNameDialog } from "./DeviceNameDialog.js"; +import { useDevice } from "@core/stores/deviceStore.js"; export const DialogManager = (): JSX.Element => { const { channels, config, dialog, setDialogOpen } = useDevice(); diff --git a/src/components/Dialog/ImportDialog.tsx b/src/components/Dialog/ImportDialog.tsx index 1ddb5f18..0bde24a4 100644 --- a/src/components/Dialog/ImportDialog.tsx +++ b/src/components/Dialog/ImportDialog.tsx @@ -1,7 +1,5 @@ -import { useEffect, useState } from "react"; -import { toByteArray } from "base64-js"; +import { Button } from "@components/UI/Button.js"; import { Checkbox } from "@components/UI/Checkbox.js"; -import { Input } from "@components/UI/Input.js"; import { Dialog, DialogContent, @@ -10,11 +8,13 @@ import { DialogHeader, DialogTitle, } from "@components/UI/Dialog.js"; -import { Protobuf } from "@meshtastic/meshtasticjs"; -import { Switch } from "@components/UI/Switch.js"; -import { Button } from "@components/UI/Button.js"; -import { useDevice } from "@core/stores/deviceStore.js"; +import { Input } from "@components/UI/Input.js"; import { Label } from "@components/UI/Label.js"; +import { Switch } from "@components/UI/Switch.js"; +import { useDevice } from "@core/stores/deviceStore.js"; +import { Protobuf } from "@meshtastic/meshtasticjs"; +import { toByteArray } from "base64-js"; +import { useEffect, useState } from "react"; export interface ImportDialogProps { open: boolean; @@ -120,14 +120,14 @@ export const ImportDialog = ({ Channels:
- {channelSet?.settings.map((channel, index) => ( -
+ {channelSet?.settings.map((channel) => ( +
- +
))}
diff --git a/src/components/Dialog/NewDeviceDialog.tsx b/src/components/Dialog/NewDeviceDialog.tsx index bc776192..378ef6fb 100644 --- a/src/components/Dialog/NewDeviceDialog.tsx +++ b/src/components/Dialog/NewDeviceDialog.tsx @@ -1,3 +1,6 @@ +import { BLE } from "../PageComponents/Connect/BLE.js"; +import { HTTP } from "../PageComponents/Connect/HTTP.js"; +import { Serial } from "../PageComponents/Connect/Serial.js"; import { Dialog, DialogContent, @@ -11,11 +14,8 @@ import { TabsList, TabsTrigger, } from "@components/UI/Tabs.js"; -import { Subtle } from "@components/UI/Typography/Subtle.js"; import { Link } from "@components/UI/Typography/Link.js"; -import { HTTP } from "../PageComponents/Connect/HTTP.js"; -import { BLE } from "../PageComponents/Connect/BLE.js"; -import { Serial } from "../PageComponents/Connect/Serial.js"; +import { Subtle } from "@components/UI/Typography/Subtle.js"; const tabs = [ { diff --git a/src/components/Dialog/QRDialog.tsx b/src/components/Dialog/QRDialog.tsx index 07f09a94..8c3de671 100644 --- a/src/components/Dialog/QRDialog.tsx +++ b/src/components/Dialog/QRDialog.tsx @@ -1,8 +1,4 @@ -import { useEffect, useState } from "react"; -import { fromByteArray } from "base64-js"; -import { QRCode } from "react-qrcode-logo"; import { Checkbox } from "@components/UI/Checkbox.js"; -import { Input } from "@components/UI/Input.js"; import { Dialog, DialogContent, @@ -11,9 +7,13 @@ import { DialogHeader, DialogTitle, } from "@components/UI/Dialog.js"; -import { ClipboardIcon } from "lucide-react"; -import { Protobuf, Types } from "@meshtastic/meshtasticjs"; +import { Input } from "@components/UI/Input.js"; import { Label } from "@components/UI/Label.js"; +import { Protobuf, Types } from "@meshtastic/meshtasticjs"; +import { fromByteArray } from "base64-js"; +import { ClipboardIcon } from "lucide-react"; +import { useEffect, useState } from "react"; +import { QRCode } from "react-qrcode-logo"; export interface QRDialogProps { open: boolean; diff --git a/src/components/Dialog/RebootDialog.tsx b/src/components/Dialog/RebootDialog.tsx index ec61025d..3d7f8d7f 100644 --- a/src/components/Dialog/RebootDialog.tsx +++ b/src/components/Dialog/RebootDialog.tsx @@ -1,5 +1,4 @@ -import { useState } from "react"; -import { useDevice } from "@core/stores/deviceStore.js"; +import { Button } from "@components/UI/Button.js"; import { Dialog, DialogContent, @@ -8,9 +7,10 @@ import { DialogHeader, DialogTitle, } from "@components/UI/Dialog.js"; -import { ClockIcon, RefreshCwIcon } from "lucide-react"; -import { Button } from "@components/UI/Button.js"; import { Input } from "@components/UI/Input.js"; +import { useDevice } from "@core/stores/deviceStore.js"; +import { ClockIcon, RefreshCwIcon } from "lucide-react"; +import { useState } from "react"; export interface RebootDialogProps { open: boolean; diff --git a/src/components/Dialog/ShutdownDialog.tsx b/src/components/Dialog/ShutdownDialog.tsx index 09f8afd5..ea1ac487 100644 --- a/src/components/Dialog/ShutdownDialog.tsx +++ b/src/components/Dialog/ShutdownDialog.tsx @@ -1,5 +1,4 @@ -import { useState } from "react"; -import { useDevice } from "@core/stores/deviceStore.js"; +import { Button } from "@components/UI/Button.js"; import { Dialog, DialogContent, @@ -7,9 +6,10 @@ import { DialogHeader, DialogTitle, } from "@components/UI/Dialog.js"; -import { ClockIcon, PowerIcon } from "lucide-react"; -import { Button } from "@components/UI/Button.js"; import { Input } from "@components/UI/Input.js"; +import { useDevice } from "@core/stores/deviceStore.js"; +import { ClockIcon, PowerIcon } from "lucide-react"; +import { useState } from "react"; export interface ShutdownDialogProps { open: boolean; diff --git a/src/components/Form/DynamicForm.tsx b/src/components/Form/DynamicForm.tsx index 1b5b5a7b..d6b7ef4c 100644 --- a/src/components/Form/DynamicForm.tsx +++ b/src/components/Form/DynamicForm.tsx @@ -1,3 +1,8 @@ +import { Button } from "../UI/Button.js"; +import { DynamicFormField, FieldProps } from "./DynamicFormField.js"; +import { FieldWrapper } from "./FormWrapper.js"; +import { H4 } from "@components/UI/Typography/H4.js"; +import { Subtle } from "@components/UI/Typography/Subtle.js"; import { Control, DeepPartial, @@ -6,11 +11,6 @@ import { SubmitHandler, useForm, } from "react-hook-form"; -import { H4 } from "@components/UI/Typography/H4.js"; -import { Subtle } from "@components/UI/Typography/Subtle.js"; -import { DynamicFormField, FieldProps } from "./DynamicFormField.js"; -import { FieldWrapper } from "./FormWrapper.js"; -import { Button } from "../UI/Button.js"; interface DisabledBy { fieldName: Path; @@ -79,9 +79,9 @@ export function DynamicForm({ onChange: handleSubmit(onSubmit), })} > - {fieldGroups.map((fieldGroup, index) => ( + {fieldGroups.map((fieldGroup) => (
@@ -89,10 +89,10 @@ export function DynamicForm({ {fieldGroup.description}
- {fieldGroup.fields.map((field, index) => ( + {fieldGroup.fields.map((field) => ( = | InputFieldProps diff --git a/src/components/Form/FormInput.tsx b/src/components/Form/FormInput.tsx index 8a62ea44..7f5283f7 100644 --- a/src/components/Form/FormInput.tsx +++ b/src/components/Form/FormInput.tsx @@ -1,9 +1,9 @@ -import type { LucideIcon } from "lucide-react"; +import { Input } from "../UI/Input.js"; import type { BaseFormBuilderProps, GenericFormElementProps, } from "./DynamicForm.js"; -import { Input } from "../UI/Input.js"; +import type { LucideIcon } from "lucide-react"; import { Controller, FieldValues } from "react-hook-form"; export interface InputFieldProps extends BaseFormBuilderProps { diff --git a/src/components/Form/FormSelect.tsx b/src/components/Form/FormSelect.tsx index cd2ed7ed..24d63596 100644 --- a/src/components/Form/FormSelect.tsx +++ b/src/components/Form/FormSelect.tsx @@ -1,8 +1,3 @@ -import type { - BaseFormBuilderProps, - GenericFormElementProps, -} from "./DynamicForm.js"; -import { Controller, FieldValues } from "react-hook-form"; import { Select, SelectContent, @@ -10,6 +5,11 @@ import { SelectTrigger, SelectValue, } from "../UI/Select.js"; +import type { + BaseFormBuilderProps, + GenericFormElementProps, +} from "./DynamicForm.js"; +import { Controller, FieldValues } from "react-hook-form"; export interface SelectFieldProps extends BaseFormBuilderProps { type: "select" | "multiSelect"; @@ -50,8 +50,8 @@ export function SelectInput({ - {optionsEnumValues.map(([name, value], index) => ( - + {optionsEnumValues.map(([name, value]) => ( + {formatEnumName ? name .replace(/_/g, " ") diff --git a/src/components/PageComponents/Channel.tsx b/src/components/PageComponents/Channel.tsx index ff552cf2..ec1b1e72 100644 --- a/src/components/PageComponents/Channel.tsx +++ b/src/components/PageComponents/Channel.tsx @@ -1,9 +1,9 @@ -import { fromByteArray, toByteArray } from "base64-js"; import type { ChannelValidation } from "@app/validation/channel.js"; -import { Protobuf } from "@meshtastic/meshtasticjs"; import { DynamicForm } from "@components/Form/DynamicForm.js"; -import { useDevice } from "@core/stores/deviceStore.js"; import { useToast } from "@core/hooks/useToast.js"; +import { useDevice } from "@core/stores/deviceStore.js"; +import { Protobuf } from "@meshtastic/meshtasticjs"; +import { fromByteArray, toByteArray } from "base64-js"; export interface SettingsPanelProps { channel: Protobuf.Channel; diff --git a/src/components/PageComponents/Config/Bluetooth.tsx b/src/components/PageComponents/Config/Bluetooth.tsx index 254bc25d..b0ac9a6b 100644 --- a/src/components/PageComponents/Config/Bluetooth.tsx +++ b/src/components/PageComponents/Config/Bluetooth.tsx @@ -1,7 +1,7 @@ import type { BluetoothValidation } from "@app/validation/config/bluetooth.js"; +import { DynamicForm } from "@components/Form/DynamicForm.js"; import { useDevice } from "@core/stores/deviceStore.js"; import { Protobuf } from "@meshtastic/meshtasticjs"; -import { DynamicForm } from "@components/Form/DynamicForm.js"; export const Bluetooth = (): JSX.Element => { const { config, setWorkingConfig } = useDevice(); diff --git a/src/components/PageComponents/Config/LoRa.tsx b/src/components/PageComponents/Config/LoRa.tsx index 102dbc31..3165c656 100644 --- a/src/components/PageComponents/Config/LoRa.tsx +++ b/src/components/PageComponents/Config/LoRa.tsx @@ -1,7 +1,7 @@ import type { LoRaValidation } from "@app/validation/config/lora.js"; +import { DynamicForm } from "@components/Form/DynamicForm.js"; import { useDevice } from "@core/stores/deviceStore.js"; import { Protobuf } from "@meshtastic/meshtasticjs"; -import { DynamicForm } from "@components/Form/DynamicForm.js"; export const LoRa = (): JSX.Element => { const { config, setWorkingConfig } = useDevice(); diff --git a/src/components/PageComponents/Config/Network.tsx b/src/components/PageComponents/Config/Network.tsx index eb91f7e0..5aba2d24 100644 --- a/src/components/PageComponents/Config/Network.tsx +++ b/src/components/PageComponents/Config/Network.tsx @@ -1,7 +1,7 @@ import type { NetworkValidation } from "@app/validation/config/network.js"; +import { DynamicForm } from "@components/Form/DynamicForm.js"; import { useDevice } from "@core/stores/deviceStore.js"; import { Protobuf } from "@meshtastic/meshtasticjs"; -import { DynamicForm } from "@components/Form/DynamicForm.js"; export const Network = (): JSX.Element => { const { config, setWorkingConfig } = useDevice(); diff --git a/src/components/PageComponents/Connect/BLE.tsx b/src/components/PageComponents/Connect/BLE.tsx index 988f0d12..7c823883 100644 --- a/src/components/PageComponents/Connect/BLE.tsx +++ b/src/components/PageComponents/Connect/BLE.tsx @@ -1,11 +1,11 @@ -import { useCallback, useEffect, useState } from "react"; -import { Mono } from "@components/generic/Mono.js"; import { Button } from "@components/UI/Button.js"; +import { Mono } from "@components/generic/Mono.js"; 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, IBLEConnection } from "@meshtastic/meshtasticjs"; +import { useCallback, useEffect, useState } from "react"; export const BLE = (): JSX.Element => { const [bleDevices, setBleDevices] = useState([]); @@ -35,9 +35,9 @@ export const BLE = (): JSX.Element => { return (
- {bleDevices.map((device, index) => ( + {bleDevices.map((device) => (
@@ -30,6 +33,7 @@ export const PageLayout = ({ {actions?.map((action, index) => (
- {pages.map((link, index) => ( + {pages.map((link) => ( { diff --git a/src/components/UI/Button.tsx b/src/components/UI/Button.tsx index 5b803c7c..74e23bdf 100644 --- a/src/components/UI/Button.tsx +++ b/src/components/UI/Button.tsx @@ -1,5 +1,5 @@ -import * as React from "react"; import { VariantProps, cva } from "class-variance-authority"; +import * as React from "react"; import { cn } from "@core/utils/cn.js"; @@ -41,6 +41,7 @@ const Button = React.forwardRef( ({ className, variant, size, ...props }, ref) => { return (