Native switch component (#4610)

* Switch component initial draft

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>

* Add onClick event

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>

* onClick fine-tunings

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>

* Fine-tuning styles

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>

* Adding tests

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>

* Fix light theme thumb color

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>

* Using native switch in places

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>

* Removing material ui switcher

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>

* Revert "Removing material ui switcher"

This reverts commit 6b9e0a090c.

* Mark Switcher and FormSwitch as deprecated

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>

* Cleaning up

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>

* Using theme-light mixin

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>

* Fix fetching values from onChange callback

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>

* Add custon onChange event with checked prop

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>

* Check for onChange() availability

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>

* Fix show minimap label

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>

src/renderer/components/+preferences/proxy.tsx

@@ -24,10 +24,11 @@ import React from "react";
 import { UserStore } from "../../../common/user-store";
 import { Input } from "../input";
 import { SubTitle } from "../layout/sub-title";
-import { FormSwitch, Switcher } from "../switch";
+import { Switch } from "../switch";
 
 export const LensProxy = observer(() => {
   const [proxy, setProxy] = React.useState(UserStore.getInstance().httpsProxy || "");
+  const store = UserStore.getInstance();
 
   return (
     <section id="proxy">
@@ -50,16 +51,9 @@ export const LensProxy = observer(() => {
 
       <section className="small">
         <SubTitle title="Certificate Trust"/>
-        <FormSwitch
-          control={
-            <Switcher
-              checked={UserStore.getInstance().allowUntrustedCAs}
-              onChange={v => UserStore.getInstance().allowUntrustedCAs = v.target.checked}
-              name="startup"
-            />
-          }
-          label="Allow untrusted Certificate Authorities"
-        />
+        <Switch checked={store.allowUntrustedCAs} onChange={() => store.allowUntrustedCAs = !store.allowUntrustedCAs}>
+          Allow untrusted Certificate Authorities
+        </Switch>
         <small className="hint">
           This will make Lens to trust ANY certificate authority without any validations.{" "}
           Needed with some corporate proxies that do certificate re-writing.{" "}