fix: fix broken allow-lan switch

src/components/Config.js

@@ -109,17 +109,22 @@ function ConfigImpl({
     [configState]
   );
 
+  const handleSwitchOnChange = useCallback(
+    checked => {
+      const name = 'allow-lan';
+      const value = checked;
+      setConfigState(name, value);
+      dispatch(updateConfigs(apiConfig, { [name]: value }));
+    },
+    [apiConfig, dispatch, setConfigState]
+  );
+
   const handleInputOnChange = useCallback(
     e => {
       const target = e.target;
       const { name } = target;
       let { value } = target;
       switch (target.name) {
-        case 'allow-lan':
-          value = target.checked;
-          setConfigState(name, value);
-          dispatch(updateConfigs(apiConfig, { [name]: value }));
-          break;
         case 'mode':
         case 'log-level':
           setConfigState(name, value);
@@ -206,7 +211,7 @@ function ConfigImpl({
           <Switch
             name="allow-lan"
             checked={configState['allow-lan']}
-            onChange={handleInputOnChange}
+            onChange={handleSwitchOnChange}
           />
         </div>
 

src/components/Proxy.module.css

@@ -11,7 +11,7 @@
     padding: 10px;
   }
 
-  background-color: var(--color-bg-proxy-selected);
+  background-color: var(--color-bg-proxy);
   &.now {
     background-color: var(--color-focus-blue);
     color: #ddd;

src/components/Root.css

@@ -97,7 +97,7 @@ body.dark {
   --color-icon: #c7c7c7;
   --color-btn-bg: #232323;
   --color-btn-fg: #bebebe;
-  --color-bg-proxy-selected: #303030;
+  --color-bg-proxy: #303030;
   --color-row-odd: #282828;
   --bg-modal: #1f1f20;
   --bg-near-transparent: rgba(255, 255, 255, 0.1);
@@ -116,7 +116,7 @@ body.light {
   --color-icon: #5b5b5b;
   --color-btn-bg: #f4f4f4;
   --color-btn-fg: #101010;
-  --color-bg-proxy-selected: #cfcfcf;
+  --color-bg-proxy: #e7e7e7;
   --color-row-odd: #f5f5f5;
   --bg-modal: #fbfbfb;
   --bg-near-transparent: rgba(0, 0, 0, 0.1);

src/components/SwitchThemed.js

@@ -4,7 +4,7 @@ import Switch from 'react-switch';
 import { connect } from './StateProvider';
 import { getTheme } from '../store/app';
 
-function SwitchThemed({ checked = false, onChange, theme }) {
+function SwitchThemed({ checked = false, onChange, theme, name }) {
   const offColor = theme === 'dark' ? '#393939' : '#e9e9e9';
 
   return (
@@ -21,6 +21,7 @@ function SwitchThemed({ checked = false, onChange, theme }) {
       height={28}
       width={44}
       className="rs"
+      name={name}
     />
   );
 }