Introduce competition for proxy preference tab

Co-authored-by: Mikko Aspiala <mikko.aspiala@gmail.com>

Signed-off-by: Janne Savolainen <janne.savolainen@live.fi>

src/features/preferences/renderer/preference-items/proxy/allow-untrusted-certificates/allow-untrusted-certificates-preference-item.injectable.ts

@@ -0,0 +1,23 @@
+/**
+ * Copyright (c) OpenLens Authors. All rights reserved.
+ * Licensed under MIT License. See LICENSE in root directory for more information.
+ */
+import { getInjectable } from "@ogre-tools/injectable";
+import { preferenceItemInjectionToken } from "../../preference-item-injection-token";
+import { AllowUntrustedCertificates } from "./allow-untrusted-certificates";
+
+const allowUntrustedCertificatesPreferenceItemInjectable = getInjectable({
+  id: "allow-untrusted-certificates-preference-item",
+
+  instantiate: () => ({
+    kind: "item" as const,
+    id: "allow-untrusted-certificates",
+    parentId: "proxy-page",
+    orderNumber: 20,
+    Component: AllowUntrustedCertificates,
+  }),
+
+  injectionToken: preferenceItemInjectionToken,
+});
+
+export default allowUntrustedCertificatesPreferenceItemInjectable;

src/features/preferences/renderer/preference-items/proxy/allow-untrusted-certificates/allow-untrusted-certificates.tsx

@@ -0,0 +1,44 @@
+/**
+ * Copyright (c) OpenLens Authors. All rights reserved.
+ * Licensed under MIT License. See LICENSE in root directory for more information.
+ */
+import React from "react";
+import { SubTitle } from "../../../../../../renderer/components/layout/sub-title";
+import { withInjectables } from "@ogre-tools/injectable-react";
+import type { UserStore } from "../../../../../../common/user-store";
+import userStoreInjectable from "../../../../../../common/user-store/user-store.injectable";
+import { observer } from "mobx-react";
+import { Switch } from "../../../../../../renderer/components/switch";
+
+interface Dependencies {
+  userStore: UserStore;
+}
+
+const NonInjectedAllowUntrustedCertificates = observer(({ userStore }: Dependencies) => (
+  <div>
+    <SubTitle title="Certificate Trust" />
+    <Switch
+      checked={userStore.allowUntrustedCAs}
+      onChange={() =>
+        (userStore.allowUntrustedCAs = !userStore.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. Does not affect cluster communications!
+    </small>
+  </div>
+));
+
+export const AllowUntrustedCertificates = withInjectables<Dependencies>(
+  NonInjectedAllowUntrustedCertificates,
+
+  {
+    getProps: (di) => ({
+      userStore: di.inject(userStoreInjectable),
+    }),
+  },
+);

src/features/preferences/renderer/preference-items/proxy/http-proxy-url/http-proxy-url-preference-item.injectable.ts

@@ -0,0 +1,23 @@
+/**
+ * Copyright (c) OpenLens Authors. All rights reserved.
+ * Licensed under MIT License. See LICENSE in root directory for more information.
+ */
+import { getInjectable } from "@ogre-tools/injectable";
+import { preferenceItemInjectionToken } from "../../preference-item-injection-token";
+import { HttpProxyUrl } from "./http-proxy-url";
+
+const httpProxyUrlPreferenceItemInjectable = getInjectable({
+  id: "http-proxy-url-preference-item",
+
+  instantiate: () => ({
+    kind: "item" as const,
+    id: "http-proxy-url",
+    parentId: "proxy-page",
+    orderNumber: 10,
+    Component: HttpProxyUrl,
+  }),
+
+  injectionToken: preferenceItemInjectionToken,
+});
+
+export default httpProxyUrlPreferenceItemInjectable;

src/features/preferences/renderer/preference-items/proxy/http-proxy-url/http-proxy-url.tsx

@@ -0,0 +1,48 @@
+/**
+ * Copyright (c) OpenLens Authors. All rights reserved.
+ * Licensed under MIT License. See LICENSE in root directory for more information.
+ */
+import React from "react";
+import { SubTitle } from "../../../../../../renderer/components/layout/sub-title";
+import { withInjectables } from "@ogre-tools/injectable-react";
+import type { UserStore } from "../../../../../../common/user-store";
+import userStoreInjectable from "../../../../../../common/user-store/user-store.injectable";
+import { observer } from "mobx-react";
+import { Input } from "../../../../../../renderer/components/input";
+
+interface Dependencies {
+  userStore: UserStore;
+}
+
+const NonInjectedHttpProxyUrl = observer(
+  ({ userStore }: Dependencies) => {
+    const [proxy, setProxy] = React.useState(userStore.httpsProxy || "");
+
+    return (
+      <div>
+        <h2 data-testid="proxy-header">Proxy</h2>
+        <SubTitle title="HTTP Proxy" />
+        <Input
+          theme="round-black"
+          placeholder="Type HTTP proxy url (example: http://proxy.acme.org:8080)"
+          value={proxy}
+          onChange={(v) => setProxy(v)}
+          onBlur={() => (userStore.httpsProxy = proxy)}
+        />
+        <small className="hint">
+          Proxy is used only for non-cluster communication.
+        </small>
+      </div>
+    );
+  },
+);
+
+export const HttpProxyUrl = withInjectables<Dependencies>(
+  NonInjectedHttpProxyUrl,
+
+  {
+    getProps: (di) => ({
+      userStore: di.inject(userStoreInjectable),
+    }),
+  },
+);

src/features/preferences/renderer/preference-items/proxy/proxy-preference-page.injectable.ts

@@ -0,0 +1,23 @@
+/**
+ * Copyright (c) OpenLens Authors. All rights reserved.
+ * Licensed under MIT License. See LICENSE in root directory for more information.
+ */
+import { getInjectable } from "@ogre-tools/injectable";
+import { preferenceItemInjectionToken } from "../preference-item-injection-token";
+import { ProxyPreferencePage } from "./proxy-preference-page";
+
+const proxyPreferencePageInjectable = getInjectable({
+  id: "proxy-preference-page",
+
+  instantiate: () => ({
+    kind: "page" as const,
+    id: "proxy-page",
+    parentId: "proxy-tab",
+    orderNumber: 0,
+    Component: ProxyPreferencePage,
+  }),
+
+  injectionToken: preferenceItemInjectionToken,
+});
+
+export default proxyPreferencePageInjectable;

src/features/preferences/renderer/preference-items/proxy/proxy-preference-page.tsx

@@ -0,0 +1,11 @@
+/**
+ * Copyright (c) OpenLens Authors. All rights reserved.
+ * Licensed under MIT License. See LICENSE in root directory for more information.
+ */
+import React from "react";
+
+export const ProxyPreferencePage = () => (
+  <div>
+    <h2 data-testid="proxy-header">Proxy</h2>
+  </div>
+);

src/features/preferences/renderer/preference-items/proxy/proxy-preference-tab.injectable.ts

@@ -0,0 +1,24 @@
+/**
+ * Copyright (c) OpenLens Authors. All rights reserved.
+ * Licensed under MIT License. See LICENSE in root directory for more information.
+ */
+import { getInjectable } from "@ogre-tools/injectable";
+import { preferenceItemInjectionToken } from "../preference-item-injection-token";
+
+const proxyPreferenceTabInjectable = getInjectable({
+  id: "proxy-preference-tab",
+
+  instantiate: () => ({
+    kind: "tab" as const,
+    id: "proxy-tab",
+    parentId: "preference-tabs" as const,
+    pathId: "proxy",
+    testId: "proxy-preferences-page",
+    label: "Proxy",
+    orderNumber: 20,
+  }),
+
+  injectionToken: preferenceItemInjectionToken,
+});
+
+export default proxyPreferenceTabInjectable;