ENG-1635: Change key image setting from checkbox to toggle switch (#1121)

* ENG-1635: Change key image setting from checkbox to toggle switch

* ENG-1635: Add readOnly to toggle input to suppress React controlled-input warning

Author: sid597

apps/obsidian/src/components/NodeTypeSettings.tsx

@@ -157,12 +157,14 @@ const BooleanField = ({
   onChange: (value: boolean) => void;
   disabled?: boolean;
 }) => (
-  <input
-    type="checkbox"
-    checked={!!value}
-    onChange={(e) => onChange(e.target.checked)}
-    disabled={disabled}
-  />
+  <div
+    className={`checkbox-container ${value ? "is-enabled" : ""}`}
+    onClick={() => {
+      if (!disabled) onChange(!value);
+    }}
+  >
+    <input type="checkbox" checked={!!value} disabled={disabled} readOnly />
+  </div>
 );
 
 const TextField = ({