From dade7ca56434914d8cac700710dd49fb83c9d922 Mon Sep 17 00:00:00 2001
From: JackTheRooster <adrian@rydeas.com>
Date: Tue, 4 Mar 2025 20:47:52 -0600
Subject: [PATCH] formatting

---
 ui/src/components/sidebar/settings.tsx | 266 ++++++++++++-------------
 1 file changed, 133 insertions(+), 133 deletions(-)

diff --git a/ui/src/components/sidebar/settings.tsx b/ui/src/components/sidebar/settings.tsx
index 0a9074b..5e46ab7 100644
--- a/ui/src/components/sidebar/settings.tsx
+++ b/ui/src/components/sidebar/settings.tsx
@@ -729,23 +729,23 @@ export default function SettingsSidebar() {
                         </p>
                         <div>
                           <Button
-                              size="MD"
-                              theme="light"
-                              text="De-register from Cloud"
-                              className="text-red-600"
-                              onClick={() => {
-                                if (deviceId) {
-                                  if (
-                                      window.confirm(
-                                          "Are you sure you want to de-register this device?",
-                                      )
-                                  ) {
-                                    deregisterDevice();
-                                  }
-                                } else {
-                                  notifications.error("No device ID available");
+                            size="MD"
+                            theme="light"
+                            text="De-register from Cloud"
+                            className="text-red-600"
+                            onClick={() => {
+                              if (deviceId) {
+                                if (
+                                    window.confirm(
+                                        "Are you sure you want to de-register this device?",
+                                    )
+                                ) {
+                                  deregisterDevice();
                                 }
-                              }}
+                              } else {
+                                notifications.error("No device ID available");
+                              }
+                            }}
                           />
                         </div>
                       </div>
@@ -759,8 +759,8 @@ export default function SettingsSidebar() {
             <>
               <div className="pb-2 space-y-4">
                 <SectionHeader
-                    title="Local Access"
-                    description="Manage the mode of local access to the device"
+                  title="Local Access"
+                  description="Manage the mode of local access to the device"
                 />
 
                 <div className="space-y-4">
@@ -780,30 +780,30 @@ export default function SettingsSidebar() {
                         />
                     ) : (
                         <Button
-                            size="SM"
-                            theme="light"
-                            text="Enable Password"
-                            onClick={() => {
-                              setLocalAuthModalView("createPassword");
-                              setIsLocalAuthDialogOpen(true);
-                            }}
+                          size="SM"
+                          theme="light"
+                          text="Enable Password"
+                          onClick={() => {
+                            setLocalAuthModalView("createPassword");
+                            setIsLocalAuthDialogOpen(true);
+                          }}
                         />
                     )}
                   </SettingsItem>
 
                   {localDevice?.authMode === "password" && (
                       <SettingsItem
-                          title="Change Password"
-                          description="Update your device access password"
+                        title="Change Password"
+                        description="Update your device access password"
                       >
                         <Button
-                            size="SM"
-                            theme="light"
-                            text="Change Password"
-                            onClick={() => {
-                              setLocalAuthModalView("updatePassword");
-                              setIsLocalAuthDialogOpen(true);
-                            }}
+                          size="SM"
+                          theme="light"
+                          text="Change Password"
+                          onClick={() => {
+                            setLocalAuthModalView("updatePassword");
+                            setIsLocalAuthDialogOpen(true);
+                          }}
                         />
                       </SettingsItem>
                   )}
@@ -814,31 +814,31 @@ export default function SettingsSidebar() {
         ) : null}
         <div className="pb-2 space-y-4">
           <SectionHeader
-              title="Updates"
-              description="Manage software updates and version information"
+            title="Updates"
+            description="Manage software updates and version information"
           />
 
           <div className="space-y-4">
             <SettingsItem
-                title="Auto Update"
-                description="Automatically update the device to the latest version"
+              title="Auto Update"
+              description="Automatically update the device to the latest version"
             >
               <Checkbox
-                  checked={autoUpdate}
-                  onChange={e => {
-                    handleAutoUpdateChange(e.target.checked);
-                  }}
+                checked={autoUpdate}
+                onChange={e => {
+                  handleAutoUpdateChange(e.target.checked);
+                }}
               />
             </SettingsItem>
             <SettingsItem
-                title="Dev Channel Updates"
-                description="Receive early updates from the development channel"
+              title="Dev Channel Updates"
+              description="Receive early updates from the development channel"
             >
               <Checkbox
-                  checked={devChannel}
-                  onChange={e => {
-                    handleDevChannelChange(e.target.checked);
-                  }}
+                checked={devChannel}
+                onChange={e => {
+                  handleDevChannelChange(e.target.checked);
+                }}
               />
             </SettingsItem>
           </div>
@@ -846,33 +846,33 @@ export default function SettingsSidebar() {
         <div className="h-[1px] w-full bg-slate-800/10 dark:bg-slate-300/20"/>
 
         <SectionHeader
-            title="Appearance"
-            description="Customize the look and feel of the application"
+          title="Appearance"
+          description="Customize the look and feel of the application"
         />
         <SettingsItem title="Theme" description="Choose your preferred color theme">
           <SelectMenuBasic
-              size="SM"
-              label=""
-              value={currentTheme}
-              options={[
-                {value: "system", label: "System"},
-                {value: "light", label: "Light"},
-                {value: "dark", label: "Dark"},
-              ]}
-              onChange={e => {
-                setCurrentTheme(e.target.value);
-                handleThemeChange(e.target.value);
-              }}
+            size="SM"
+            label=""
+            value={currentTheme}
+            options={[
+              {value: "system", label: "System"},
+              {value: "light", label: "Light"},
+              {value: "dark", label: "Dark"},
+            ]}
+            onChange={e => {
+              setCurrentTheme(e.target.value);
+              handleThemeChange(e.target.value);
+            }}
           />
         </SettingsItem>
         <SettingsItem title="Device Name" description="Set your device name">
           <InputFieldWithLabel
-              required
-              label=""
-              placeholder="Enter Device Name"
-              description={`DNS Name: ${nameConfig.dns}`}
-              defaultValue={nameConfig.name}
-              onChange={e => handleDeviceNameChange(e.target.value)}
+            required
+            label=""
+            placeholder="Enter Device Name"
+            description={`DNS Name: ${nameConfig.dns}`}
+            defaultValue={nameConfig.name}
+            onChange={e => handleDeviceNameChange(e.target.value)}
           />
         </SettingsItem>
         <div className="flex items-center gap-x-2">
@@ -892,40 +892,40 @@ export default function SettingsSidebar() {
         </div>
         <SettingsItem title="Display Brightness" description="Set the brightness of the display">
           <SelectMenuBasic
-              size="SM"
-              label=""
-              value={settings.backlightSettings.max_brightness.toString()}
-              options={[
-                {value: "0", label: "Off"},
-                {value: "10", label: "Low"},
-                {value: "35", label: "Medium"},
-                {value: "64", label: "High"},
-              ]}
-              onChange={e => {
-                settings.backlightSettings.max_brightness = parseInt(e.target.value)
-                handleBacklightSettingsChange(settings.backlightSettings);
-              }}
+            size="SM"
+            label=""
+            value={settings.backlightSettings.max_brightness.toString()}
+            options={[
+              {value: "0", label: "Off"},
+              {value: "10", label: "Low"},
+              {value: "35", label: "Medium"},
+              {value: "64", label: "High"},
+            ]}
+            onChange={e => {
+              settings.backlightSettings.max_brightness = parseInt(e.target.value)
+              handleBacklightSettingsChange(settings.backlightSettings);
+            }}
           />
         </SettingsItem>
         {settings.backlightSettings.max_brightness != 0 && (
             <>
               <SettingsItem title="Dim Display After" description="Set how long to wait before dimming the display">
                 <SelectMenuBasic
-                    size="SM"
-                    label=""
-                    value={settings.backlightSettings.dim_after.toString()}
-                    options={[
-                      {value: "0", label: "Never"},
-                      {value: "60", label: "1 Minute"},
-                      {value: "300", label: "5 Minutes"},
-                      {value: "600", label: "10 Minutes"},
-                      {value: "1800", label: "30 Minutes"},
-                      {value: "3600", label: "1 Hour"},
-                    ]}
-                    onChange={e => {
-                      settings.backlightSettings.dim_after = parseInt(e.target.value)
-                      handleBacklightSettingsChange(settings.backlightSettings);
-                    }}
+                  size="SM"
+                  label=""
+                  value={settings.backlightSettings.dim_after.toString()}
+                  options={[
+                    {value: "0", label: "Never"},
+                    {value: "60", label: "1 Minute"},
+                    {value: "300", label: "5 Minutes"},
+                    {value: "600", label: "10 Minutes"},
+                    {value: "1800", label: "30 Minutes"},
+                    {value: "3600", label: "1 Hour"},
+                  ]}
+                  onChange={e => {
+                    settings.backlightSettings.dim_after = parseInt(e.target.value)
+                    handleBacklightSettingsChange(settings.backlightSettings);
+                  }}
                 />
               </SettingsItem>
               <SettingsItem title="Turn off Display After"
@@ -955,39 +955,39 @@ export default function SettingsSidebar() {
         <div className="h-[1px] w-full bg-slate-800/10 dark:bg-slate-300/20"/>
         <div className="pb-2 space-y-4">
           <SectionHeader
-              title="Advanced"
-              description="Access additional settings for troubleshooting and customization"
+            title="Advanced"
+            description="Access additional settings for troubleshooting and customization"
           />
 
           <div className="pb-4 space-y-4">
             <SettingsItem
-                title="Developer Mode"
-                description="Enable advanced features for developers"
+              title="Developer Mode"
+              description="Enable advanced features for developers"
             >
               <Checkbox
-                  checked={settings.developerMode}
-                  onChange={e => handleDevModeChange(e.target.checked)}
+                checked={settings.developerMode}
+                onChange={e => handleDevModeChange(e.target.checked)}
               />
             </SettingsItem>
 
             {settings.developerMode && (
                 <div className="space-y-4">
                   <TextAreaWithLabel
-                      label="SSH Public Key"
-                      value={sshKey || ""}
-                      rows={3}
-                      onChange={e => handleSSHKeyChange(e.target.value)}
-                      placeholder="Enter your SSH public key"
+                    label="SSH Public Key"
+                    value={sshKey || ""}
+                    rows={3}
+                    onChange={e => handleSSHKeyChange(e.target.value)}
+                    placeholder="Enter your SSH public key"
                   />
                   <p className="text-xs text-slate-600 dark:text-slate-400">
                     The default SSH user is <strong>root</strong>.
                   </p>
                   <div className="flex items-center gap-x-2">
                     <Button
-                        size="SM"
-                        theme="primary"
-                        text="Update SSH Key"
-                        onClick={handleUpdateSSHKey}
+                      size="SM"
+                      theme="primary"
+                      text="Update SSH Key"
+                      onClick={handleUpdateSSHKey}
                     />
                   </div>
                 </div>
@@ -1007,18 +1007,18 @@ export default function SettingsSidebar() {
             {settings.debugMode && (
                 <>
                   <SettingsItem
-                      title="USB Emulation"
-                      description="Control the USB emulation state"
+                    title="USB Emulation"
+                    description="Control the USB emulation state"
                   >
                     <Button
-                        size="SM"
-                        theme="light"
-                        text={
-                          usbEmulationEnabled
-                              ? "Disable USB Emulation"
-                              : "Enable USB Emulation"
-                        }
-                        onClick={() => handleUsbEmulationToggle(!usbEmulationEnabled)}
+                      size="SM"
+                      theme="light"
+                      text={
+                        usbEmulationEnabled
+                            ? "Disable USB Emulation"
+                            : "Enable USB Emulation"
+                      }
+                      onClick={() => handleUsbEmulationToggle(!usbEmulationEnabled)}
                     />
                   </SettingsItem>
                 </>
@@ -1029,13 +1029,13 @@ export default function SettingsSidebar() {
                     description="Reset the configuration file to its default state. This will log you out of the device."
                 >
                   <Button
-                      size="SM"
-                      theme="light"
-                      text="Reset Config"
-                      onClick={() => {
-                        handleResetConfig();
-                        window.location.reload();
-                      }}
+                    size="SM"
+                    theme="light"
+                    text="Reset Config"
+                    onClick={() => {
+                      handleResetConfig();
+                      window.location.reload();
+                    }}
                   />
                 </SettingsItem>
             )}
@@ -1043,11 +1043,11 @@ export default function SettingsSidebar() {
         </div>
       </div>
       <LocalAuthPasswordDialog
-          open={isLocalAuthDialogOpen}
-          setOpen={x => {
-            // Revalidate the current route to refresh the local device status and dependent UI components
-            revalidator.revalidate();
-            setIsLocalAuthDialogOpen(x);
+        open={isLocalAuthDialogOpen}
+        setOpen={x => {
+          // Revalidate the current route to refresh the local device status and dependent UI components
+          revalidator.revalidate();
+          setIsLocalAuthDialogOpen(x);
         }}
       />
     </div>