Merge pull request #445 from danditomaso/fix/switch-style-issue

fix: improve switch dark mode style, fixed merge conflict bug in HTTP component.

src/components/PageComponents/Connect/HTTP.tsx

@@ -8,7 +8,7 @@ import { useDeviceStore } from "@core/stores/deviceStore.ts";
 import { subscribeAll } from "@core/subscriptions.ts";
 import { randId } from "@core/utils/randId.ts";
 import { HttpConnection } from "@meshtastic/js";
-import { useState } from "react";
+import { type JSX, useState } from "react";
 import { Controller, useForm } from "react-hook-form";
 
 export const HTTP = ({ closeDialog }: TabElementProps): JSX.Element => {
@@ -68,15 +68,13 @@ export const HTTP = ({ closeDialog }: TabElementProps): JSX.Element => {
             <>
               <Label>Use HTTPS</Label>
               <Switch
-
                 onCheckedChange={(checked) => {
                   checked ? setHTTPS(true) : setHTTPS(false);
                 }}
-
-              disabled={
+                disabled={
                   location.protocol === "https:" || connectionInProgress
                 }
-                checked={value}
+                checked={https}
                 {...rest}
               />
             </>

src/components/UI/Switch.tsx

@@ -9,7 +9,7 @@ const Switch = React.forwardRef<
 >(({ className, ...props }, ref) => (
   <SwitchPrimitives.Root
     className={cn(
-      "peer inline-flex h-[24px] w-[44px] shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent transition-colors focus:outline-hidden focus:ring-2 focus:ring-slate-400 focus:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-slate-900 data-[state=unchecked]:bg-slate-200 dark:focus:ring-slate-400 dark:focus:ring-offset-slate-900 dark:data-[state=checked]:bg-slate-600 dark:data-[state=unchecked]:bg-slate-100",
+      "peer inline-flex h-[24px] w-[44px] shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent transition-colors focus:outline-hidden focus:ring-2 focus:ring-slate-400 focus:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-slate-900 data-[state=unchecked]:bg-slate-200 dark:focus:ring-slate-400 dark:focus:ring-offset-slate-900 dark:data-[state=checked]:bg-slate-600 dark:data-[state=unchecked]:bg-slate-300",
       className,
     )}
     {...props}

src/core/stores/appStore.ts

@@ -14,13 +14,11 @@ interface ErrorState {
   message: string;
 }
 
-
 interface ErrorState {
   field: string;
   message: string;
 }
 
-
 interface AppState {
   selectedDevice: number;
   devices: {