Turn on strict mode in tsconfig.json, some helpful lints, and required cleanup where strictness necessitates it (#5195)

* Turn on strict mode in tsconfig.json - Add route, clusterRoute, and payloadValidatedClusterRoute helper functions to improve types with backend routes - Turn on the following new lints: - react/jsx-first-prop-new-line - react/jsx-wrap-multilines - react/jsx-one-expression-per-line - react/jsx-max-props-per-line - react/jsx-indent - react/jsx-indent-props Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix build Signed-off-by: Sebastian Malton <sebastian@malton.name> * Replace KubeObject scope strings with enum Signed-off-by: Sebastian Malton <sebastian@malton.name> * Revert package.json version changes Signed-off-by: Sebastian Malton <sebastian@malton.name> * revert move hostedCluster(Id) Signed-off-by: Sebastian Malton <sebastian@malton.name> * change some type param names to be not single letters Signed-off-by: Sebastian Malton <sebastian@malton.name> * remove copy-extension-themes Signed-off-by: Sebastian Malton <sebastian@malton.name> * add new make clean action Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix build to not use webpack for generating types Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix kube-object-menu.test.tsx Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix select.test.tsx Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix catalog.test.tsx Signed-off-by: Sebastian Malton <sebastian@malton.name> * revert move fileNameMigration to index Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix ref logic error Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix log-resource-selector.test.tsx tests Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix dock-store.test.ts test by overriding createStorage to not touch file system Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix cluster.test.ts tests Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix kube=api.test.ts Signed-off-by: Sebastian Malton <sebastian@malton.name> * fixed hotbar-store.test.ts Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix kubeconfig-manager.test.ts Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix cluster-role-bindings/__tests__/dialog.test.tsx Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix role-bindings/__tests__/dialog.test.tsx Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix pods.test.ts Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix delete-cluster-dialog.test.tsx Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix daemonset.store.test.ts Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix replicaset.store.test.ts Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix statefulsets/dialog/dialog.test.tsx Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix replicasets/scale-dialog/dialog.test.tsx Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix deployments.store.test.ts Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix deployments/scale/dialog.test.tsx Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix cronjob.store.test.ts Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix stateful-set.api.test.ts Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix deployment.api.test.ts Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix api-manager.test.ts Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix statefulset.store.test.ts Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix job.store.test.ts Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix pods.store.test.ts Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix scroll-spy.test.tsx Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix hotbar-remove-command.test.tsx Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix catalog-entity-registry.test.ts Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix welcome.test.tsx Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix verify-that-all-routes-have-route-component.test.ts Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix pod-tolerations.test.tsx Signed-off-by: Sebastian Malton <sebastian@malton.name> * better fix for previous 3 fixes, plus also select.test.tsx Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix kube-object-menu.test.tsx Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix app-paths.test.ts Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix dock-tabs.test.tsx Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix isReactNode typing Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix sub-title.tsx Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix drawer.tsx Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix list-layout.tsx and header.tsx Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix error-boundary.tsx Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix upgrade-chart/store.ts and dock-tab.store.ts Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix install-chart/store.ts Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix edit-resource/store.ts Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix create-resource/store.ts Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix namespace-select.tsx Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix namespace-select-filter.tsx Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix crd-list.tsx Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix wrong types for extensions Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix circular dependency Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix circular dependency on catalogCategoryRegistry Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix api-kube Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix type errors, most <Select /> errors Signed-off-by: Sebastian Malton <sebastian@malton.name> * fixing more type errors Signed-off-by: Sebastian Malton <sebastian@malton.name> * some more fixing type errors Signed-off-by: Sebastian Malton <sebastian@malton.name> * convert all KubeApis to injectable with legacy global backups Signed-off-by: Sebastian Malton <sebastian@malton.name> * factor out into a common file all the exports Signed-off-by: Sebastian Malton <sebastian@malton.name> * convert all KubeObjectStores to injectable with legacy global backups Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix lint Signed-off-by: Sebastian Malton <sebastian@malton.name> * remove unused legacy KubeApi globals Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix bad previous commit Signed-off-by: Sebastian Malton <sebastian@malton.name> * more crash fixing Signed-off-by: Sebastian Malton <sebastian@malton.name> * try and fix behavioural tests Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix sidebar-and-tab-navigation-for-core.test.tsx Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix sidebar-and-tab-navigation-for-extensions.test.tsx Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix navigation-using-application-menu.test.ts Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix catalog.test.tsx Signed-off-by: Sebastian Malton <sebastian@malton.name> * Make ThemeStore non-singleton and fix navigation-to-terminal-preferences.test.ts Signed-off-by: Sebastian Malton <sebastian@malton.name> * extensions.test.tsx Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix catalog-entity-registry.test.ts Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix navigation-using-application-menu.test.ts Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix log-resource-selector.test.tsx Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix dock-tabs.test.tsx Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix delete-cluster-dialog.test.tsx Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix navigation-to-kubernetes-preferences.test.ts Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix navigation-to-editor-preferences.test.ts Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix navigation-to-proxy-preferences.test.ts Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix navigation-using-application-menu.test.ts Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix navigation-to-application-preferences.test.ts Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix dock-store.test.ts Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix select.test.tsx Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix role-bindings/__tests__/dialog.test.tsx Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix hotbar-remove-command.test.tsx Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix cluster-role-bindings/__tests__/dialog.test.tsx Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix navigation-to-extension-specific-preferences.test.tsx Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix navigation-to-telemetry-preferences.test.tsx Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix closing-preferences.test.tsx Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix navigation-to-editor-preferences.test.ts Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix navigation-to-proxy-preferences.test.ts - Fix other type errors too Signed-off-by: Sebastian Malton <sebastian@malton.name> * final tweaks Signed-off-by: Sebastian Malton <sebastian@malton.name> * Add more tsconfig files, fix bug in <Catalog> - Make all of history, navigation injectable Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix type errors Signed-off-by: Sebastian Malton <sebastian@malton.name> * Convert all of kube-details-params/ and navigate/ to injectable - This fixes a runtime error that was encountered during testing Signed-off-by: Sebastian Malton <sebastian@malton.name> * Fix runtime errors on renderer - remove all static uses of `createPageParam` (and then removed the legacy global) - Made LensRendererExtension and LensMainExtension just used dependencies and not the getLegacyDi - Fixed circular dep in extension-loader Signed-off-by: Sebastian Malton <sebastian@malton.name> * Move registerStore calls to after injectMany Signed-off-by: Sebastian Malton <sebastian@malton.name> * replace all the rest of the legacy uses of apiManager Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix stack overflow and cycles in DI Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix NamespaceSelectFilter not opening Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix WizardStep and AddNamespaceDialog Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix KubeApi's not being registered Signed-off-by: Sebastian Malton <sebastian@malton.name> * cleanup WindowManager Signed-off-by: Sebastian Malton <sebastian@malton.name> * Proper fix for Wizard, fix NamespaceStore.subscribe Signed-off-by: Sebastian Malton <sebastian@malton.name> * Rewrite withTooltip to be more type correct - Fixes mobx related "too many recursive actions" error - Change all the uses of withTooltips to be functional components Signed-off-by: Sebastian Malton <sebastian@malton.name> * Add e2e test to cover kube api registration Signed-off-by: Sebastian Malton <sebastian@malton.name> * cleanup internal-commands Signed-off-by: Sebastian Malton <sebastian@malton.name> * remove cast in <Animate> Signed-off-by: Sebastian Malton <sebastian@malton.name> * Fix command-palette e2e test Signed-off-by: Sebastian Malton <sebastian@malton.name> * Fix type error after rebase Signed-off-by: Sebastian Malton <sebastian@malton.name> * Fix test name Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix lint Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix code to help CodeQL scanner Signed-off-by: Sebastian Malton <sebastian@malton.name> * update intree extension lock files Signed-off-by: Sebastian Malton <sebastian@malton.name> * Fix build-extensions picking wrong @types/react Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix tests from rebase Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix type error Signed-off-by: Sebastian Malton <sebastian@malton.name> * Make KubeconfigSyncManager more injectable Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix crash in test mode for Dialog Signed-off-by: Sebastian Malton <sebastian@malton.name> * make Select snapshots deterministic Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix new type error Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix kube-object.store.test.ts typing Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix merge build issues Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix snapshots after merge Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix lint after merge Signed-off-by: Sebastian Malton <sebastian@malton.name> * reexport BaseKubeJsonApiObjectMetadata Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix typo in terminalSpawningPool Signed-off-by: Sebastian Malton <sebastian@malton.name> * remove duplicate license header Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix typo to waitUntilDefined Signed-off-by: Sebastian Malton <sebastian@malton.name> * remove iter use from getLegacyGlobalDiForExtensionApi Signed-off-by: Sebastian Malton <sebastian@malton.name> * remove complex createStorage override Signed-off-by: Sebastian Malton <sebastian@malton.name> * override logger with mocks only when needed for tests Signed-off-by: Sebastian Malton <sebastian@malton.name> * remove specialized overrideStore flags for getDiForUnitTesting Signed-off-by: Sebastian Malton <sebastian@malton.name> * remove unnecessary | undefined types from the exactOptionalFieldTypes experiment Signed-off-by: Sebastian Malton <sebastian@malton.name> * use more descriptive name for local test mocks Signed-off-by: Sebastian Malton <sebastian@malton.name> * remove unnecessary addition to 'make clean' target Signed-off-by: Sebastian Malton <sebastian@malton.name> * remove oddity of KubeObjectStore.getById(undefined) being allowed Signed-off-by: Sebastian Malton <sebastian@malton.name> * rename KubeObject.getDescriptor in favour of name without fundemental JS meaning Signed-off-by: Sebastian Malton <sebastian@malton.name> * Simplify legacyRegisterApi when working in behaviour unit tests - Don't emit within main environment as there should be no auto registering there Signed-off-by: Sebastian Malton <sebastian@malton.name> * change confusing variable name in ReactiveDuration Signed-off-by: Sebastian Malton <sebastian@malton.name> * make visitor pattern more explicit for Entity contextMenuOpen Signed-off-by: Sebastian Malton <sebastian@malton.name> * toggleDetails -> toggleKubeDetailsPane is more specific Signed-off-by: Sebastian Malton <sebastian@malton.name> * remove outdated comment Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix bug where LensExtension dependencies are not set Signed-off-by: Sebastian Malton <sebastian@malton.name> * Fix tests from the revert of react 18 Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix more tests from merge Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix typings with new is-compatible-extension tests Signed-off-by: Sebastian Malton <sebastian@malton.name> * more type fixing Signed-off-by: Sebastian Malton <sebastian@malton.name> * Revert in-tree extension versions Signed-off-by: Sebastian Malton <sebastian@malton.name> * Improve name of guarding injectable for stores and apis - New name better implies that it is just a guard state and does not do anything Signed-off-by: Sebastian Malton <sebastian@malton.name> * Add helper for <Select>.isMulti for storing in a Set<Value> Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix is-compatible-extension.test.ts types Signed-off-by: Sebastian Malton <sebastian@malton.name>
2025-05-20 05:10:56 +00:00 · 2022-05-16 07:17:57 -04:00
1 parent 381d77c633
commit dfcb7c3330
@@ -8,7 +8,9 @@ import { render } from "@testing-library/react";
 import { SecretDetails } from "../secret-details";
 import { Secret, SecretType } from "../../../../common/k8s-api/endpoints";

-jest.mock("../../kube-object-meta/kube-object-meta");
+jest.mock("../../kube-object-meta/kube-object-meta", () => ({
+  KubeObjectMeta: () => null,
+}));


 describe("SecretDetails tests", () => {
@@ -20,6 +22,8 @@ describe("SecretDetails tests", () => {
        name: "test",
        resourceVersion: "1",
        uid: "uid",
+        namespace: "default",
+        selfLink: "/api/v1/secrets/default/test",
      },
      data: {
        foobar: "",
@@ -13,36 +13,34 @@ import { Dialog } from "../dialog";
 import { Wizard, WizardStep } from "../wizard";
 import { Input } from "../input";
 import { systemName } from "../input/input_validators";
-import type { Secret } from "../../../common/k8s-api/endpoints";
-import { secretsApi, SecretType } from "../../../common/k8s-api/endpoints";
+import { reverseSecretTypeMap, secretApi, SecretType } from "../../../common/k8s-api/endpoints";
 import { SubTitle } from "../layout/sub-title";
 import { NamespaceSelect } from "../+namespaces/namespace-select";
-import type { SelectOption } from "../select";
 import { Select } from "../select";
 import { Icon } from "../icon";
-import type { KubeObjectMetadata } from "../../../common/k8s-api/kube-object";
-import { base64 } from "../../utils";
+import { base64, iter } from "../../utils";
 import { Notifications } from "../notifications";
 import upperFirst from "lodash/upperFirst";
 import { showDetails } from "../kube-detail-params";
+import { fromEntries } from "../../../common/utils/objects";

 export interface AddSecretDialogProps extends Partial<DialogProps> {
 }

-interface ISecretTemplateField {
+interface SecretTemplateField {
  key: string;
  value?: string;
  required?: boolean;
 }

-interface ISecretTemplate {
-  [field: string]: ISecretTemplateField[];
-  annotations?: ISecretTemplateField[];
-  labels?: ISecretTemplateField[];
-  data?: ISecretTemplateField[];
+interface SecretTemplate {
+  [field: string]: SecretTemplateField[] | undefined;
+  annotations?: SecretTemplateField[];
+  labels?: SecretTemplateField[];
+  data?: SecretTemplateField[];
 }

-type ISecretField = keyof ISecretTemplate;
+type ISecretField = keyof SecretTemplate;

 const dialogState = observable.object({
  isOpen: false,
@@ -63,7 +61,7 @@ export class AddSecretDialog extends React.Component<AddSecretDialogProps> {
    dialogState.isOpen = false;
  }

-  private secretTemplate: { [p: string]: ISecretTemplate } = {
+  private secretTemplate: Partial<Record<SecretType, SecretTemplate>> = {
    [SecretType.Opaque]: {},
    [SecretType.ServiceAccountToken]: {
      annotations: [
@@ -73,10 +71,6 @@ export class AddSecretDialog extends React.Component<AddSecretDialogProps> {
    },
  };

-  get types() {
-    return Object.keys(this.secretTemplate) as SecretType[];
-  }
-
  @observable secret = this.secretTemplate;
  @observable name = "";
  @observable namespace = "default";
@@ -91,61 +85,59 @@ export class AddSecretDialog extends React.Component<AddSecretDialogProps> {
    AddSecretDialog.close();
  };

-  private getDataFromFields = (fields: ISecretTemplateField[] = [], processValue?: (val: string) => string) => {
-    return fields.reduce<any>((data, field) => {
-      const { key, value } = field;
-
-      if (key) {
-        data[key] = processValue ? processValue(value) : value;
-      }
-
-      return data;
-    }, {});
+  private getDataFromFields = (fields: SecretTemplateField[] = [], processValue: (val: string) => string = (val => val)) => {
+    return iter.pipeline(fields.values())
+      .filterMap(({ key, value }) => (
+        value
+          ? [key, processValue(value)] as const
+          : undefined
+      ))
+      .collect(fromEntries);
  };

  createSecret = async () => {
    const { name, namespace, type } = this;
-    const { data = [], labels = [], annotations = [] } = this.secret[type];
-    const secret: Partial<Secret> = {
-      type,
-      data: this.getDataFromFields(data, val => val ? base64.encode(val) : ""),
-      metadata: {
-        name,
-        namespace,
-        annotations: this.getDataFromFields(annotations),
-        labels: this.getDataFromFields(labels),
-      } as KubeObjectMetadata,
-    };
+    const { data = [], labels = [], annotations = [] } = this.secret[type] ?? {};

    try {
-      const newSecret = await secretsApi.create({ namespace, name }, secret);
+      const newSecret = await secretApi.create({ namespace, name }, {
+        type,
+        data: this.getDataFromFields(data, val => val ? base64.encode(val) : ""),
+        metadata: {
+          name,
+          namespace,
+          annotations: this.getDataFromFields(annotations),
+          labels: this.getDataFromFields(labels),
+        },
+      });

-      showDetails(newSecret.selfLink);
+      showDetails(newSecret?.selfLink);
      this.close();
    } catch (err) {
-      Notifications.error(err);
+      Notifications.checkedError(err, "Unknown error occured while creating a Secret");
    }
  };

-  addField = (field: ISecretField) => {
-    const fields = this.secret[this.type][field] || [];
+  private getFields(field: ISecretField) {
+    return (this.secret[this.type] ??= {})[field] ??= [];
+  }

-    fields.push({ key: "", value: "" });
-    this.secret[this.type][field] = fields;
+  addField = (field: ISecretField) => {
+    this.getFields(field).push({ key: "", value: "" });
  };

  removeField = (field: ISecretField, index: number) => {
-    const fields = this.secret[this.type][field] || [];
-
-    fields.splice(index, 1);
+    this.getFields(field).splice(index, 1);
  };

  renderFields(field: ISecretField) {
-    const fields = this.secret[this.type][field] || [];
-
    return (
      <>
-        <SubTitle compact className="fields-title" title={upperFirst(field.toString())}>
+        <SubTitle
+          compact
+          className="fields-title"
+          title={upperFirst(field.toString())}
+        >
          <Icon
            small
            tooltip="Add field"
@@ -154,37 +146,37 @@ export class AddSecretDialog extends React.Component<AddSecretDialogProps> {
          />
        </SubTitle>
        <div className="secret-fields">
-          {fields.map((item, index) => {
-            const { key = "", value = "", required } = item;
-
-            return (
+          {this.getFields(field)
+            .map((item, index) => (
              <div key={index} className="secret-field flex gaps auto align-center">
                <Input
                  className="key"
                  placeholder="Name"
-                  title={key}
-                  tabIndex={required ? -1 : 0}
-                  readOnly={required}
-                  value={key} onChange={v => item.key = v}
+                  title={item.key}
+                  tabIndex={item.required ? -1 : 0}
+                  readOnly={item.required}
+                  value={item.key}
+                  onChange={v => item.key = v}
                />
                <Input
-                  multiLine maxRows={5}
-                  required={required}
+                  multiLine
+                  maxRows={5}
+                  required={item.required}
                  className="value"
                  placeholder="Value"
-                  value={value} onChange={v => item.value = v}
+                  value={item.value}
+                  onChange={v => item.value = v}
                />
                <Icon
                  small
-                  disabled={required}
-                  tooltip={required ? "Required field" : "Remove field"}
+                  disabled={item.required}
+                  tooltip={item.required ? "Required field" : "Remove field"}
                  className="remove-icon"
                  material="remove_circle_outline"
                  onClick={() => this.removeField(field, index)}
                />
              </div>
-            );
-          })}
+            ))}
        </div>
      </>
    );
@@ -204,15 +196,21 @@ export class AddSecretDialog extends React.Component<AddSecretDialogProps> {
        close={this.close}
      >
        <Wizard header={header} done={this.close}>
-          <WizardStep contentClass="flow column" nextLabel="Create" next={this.createSecret}>
+          <WizardStep
+            contentClass="flow column"
+            nextLabel="Create"
+            next={this.createSecret}
+          >
            <div className="secret-name">
              <SubTitle title="Secret name" />
              <Input
-                autoFocus required
+                autoFocus
+                required
                placeholder="Name"
                trim
                validators={systemName}
-                value={name} onChange={v => this.name = v}
+                value={name}
+                onChange={v => this.name = v}
              />
            </div>
            <div className="flex auto gaps">
@@ -222,7 +220,7 @@ export class AddSecretDialog extends React.Component<AddSecretDialogProps> {
                  id="secret-namespace-input"
                  themeName="light"
                  value={namespace}
-                  onChange={({ value }) => this.namespace = value}
+                  onChange={option => this.namespace = option?.value ?? "default"}
                />
              </div>
              <div className="secret-type">
@@ -230,8 +228,10 @@ export class AddSecretDialog extends React.Component<AddSecretDialogProps> {
                <Select
                  id="secret-input"
                  themeName="light"
-                  options={this.types}
-                  value={type} onChange={({ value }: SelectOption) => this.type = value}
+                  options={Object.keys(this.secretTemplate) as SecretType[]}
+                  value={type}
+                  onChange={option => this.type = option?.value ?? SecretType.Opaque}
+                  getOptionLabel={option => reverseSecretTypeMap[option.value]}
                />
              </div>
            </div>
@@ -0,0 +1,12 @@
+/**
+ * Copyright (c) OpenLens Authors. All rights reserved.
+ * Licensed under MIT License. See LICENSE in root directory for more information.
+ */
+
+import { asLegacyGlobalForExtensionApi } from "../../../extensions/as-legacy-globals-for-extension-api/as-legacy-global-object-for-extension-api";
+import secretStoreInjectable from "./store.injectable";
+
+/**
+ * @deprecated use `di.inject(secretStoreInjectable)` instead
+ */
+export const secretStore = asLegacyGlobalForExtensionApi(secretStoreInjectable);
@@ -14,7 +14,7 @@ import { Button } from "../button";
 import { Notifications } from "../notifications";
 import { base64, toggle } from "../../utils";
 import { Icon } from "../icon";
-import { secretsStore } from "./secrets.store";
+import { secretStore } from "./legacy-store";
 import type { KubeObjectDetailsProps } from "../kube-object-details";
 import { Secret } from "../../../common/k8s-api/endpoints";
 import { KubeObjectMeta } from "../kube-object-meta";
@@ -26,7 +26,7 @@ export interface SecretDetailsProps extends KubeObjectDetailsProps<Secret> {
@observer
 export class SecretDetails extends React.Component<SecretDetailsProps> {
  @observable isSaving = false;
-  @observable data: { [name: string]: string } = {};
+  @observable data: Partial<Record<string, string>> = {};
  @observable revealSecret = observable.set<string>();

  constructor(props: SecretDetailsProps) {
@@ -53,10 +53,10 @@ export class SecretDetails extends React.Component<SecretDetailsProps> {
    this.isSaving = true;

    try {
-      await secretsStore.update(secret, { ...secret, data: this.data });
+      await secretStore.update(secret, { ...secret, data: this.data });
      Notifications.ok("Secret successfully updated.");
    } catch (err) {
-      Notifications.error(err);
+      Notifications.checkedError(err, "Unknown error occured while updating the secret");
    }
    this.isSaving = false;
  };
@@ -65,11 +65,11 @@ export class SecretDetails extends React.Component<SecretDetailsProps> {
    this.data[name] = encoded ? value : base64.encode(value);
  };

-  renderSecret = ([name, value]: [string, string]) => {
+  renderSecret = ([name, value]: [string, string | undefined]) => {
    let decodedVal: string | undefined;

    try {
-      decodedVal = base64.decode(value);
+      decodedVal = value ? base64.decode(value) : undefined;
    } catch {
      /**
       * The value failed to be decoded, so don't show the visibility
@@ -85,7 +85,11 @@ export class SecretDetails extends React.Component<SecretDetailsProps> {
    }

    return (
-      <div key={name} className="data" data-testid={`${name}-secret-entry`}>
+      <div
+        key={name}
+        className="data"
+        data-testid={`${name}-secret-entry`}
+      >
        <div className="name">{name}</div>
        <div className="flex gaps align-center">
          <Input
@@ -120,7 +124,8 @@ export class SecretDetails extends React.Component<SecretDetailsProps> {
        {secrets.map(this.renderSecret)}
        <Button
          primary
-          label="Save" waiting={this.isSaving}
+          label="Save"
+          waiting={this.isSaving}
          className="save-btn"
          onClick={this.saveSecret}
        />
@@ -1,16 +0,0 @@
-/**
- * Copyright (c) OpenLens Authors. All rights reserved.
- * Licensed under MIT License. See LICENSE in root directory for more information.
- */
-
-import { KubeObjectStore } from "../../../common/k8s-api/kube-object.store";
-import type { Secret } from "../../../common/k8s-api/endpoints";
-import { secretsApi } from "../../../common/k8s-api/endpoints";
-import { apiManager } from "../../../common/k8s-api/api-manager";
-
-export class SecretsStore extends KubeObjectStore<Secret> {
-  api = secretsApi;
-}
-
-export const secretsStore = new SecretsStore();
-apiManager.registerStore(secretsStore);
@@ -10,7 +10,7 @@ import { observer } from "mobx-react";
 import { AddSecretDialog } from "./add-secret-dialog";
 import { KubeObjectListLayout } from "../kube-object-list-layout";
 import { Badge } from "../badge";
-import { secretsStore } from "./secrets.store";
+import { secretStore } from "./legacy-store";
 import { KubeObjectStatusIcon } from "../kube-object-status-icon";
 import { SiblingsInTabLayout } from "../layout/siblings-in-tab-layout";
 import { KubeObjectAge } from "../kube-object/age";
@@ -33,7 +33,7 @@ export class Secrets extends React.Component {
          isConfigurable
          tableId="configuration_secrets"
          className="Secrets"
-          store={secretsStore}
+          store={secretStore}
          sortingCallbacks={{
            [columnId.name]: secret => secret.getName(),
            [columnId.namespace]: secret => secret.getNs(),
@@ -60,7 +60,14 @@ export class Secrets extends React.Component {
            secret.getName(),
            <KubeObjectStatusIcon key="icon" object={secret} />,
            secret.getNs(),
-            secret.getLabels().map(label => <Badge scrollable key={label} label={label} expandable={false}/>),
+            secret.getLabels().map(label => (
+              <Badge
+                scrollable
+                key={label}
+                label={label}
+                expandable={false}
+              />
+            )),
            secret.getKeys().join(", "),
            secret.type,
            <KubeObjectAge key="age" object={secret} />,
@@ -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 assert from "assert";
+import { kubeObjectStoreInjectionToken } from "../../../common/k8s-api/api-manager/manager.injectable";
+import secretApiInjectable from "../../../common/k8s-api/endpoints/secret.api.injectable";
+import storesAndApisCanBeCreatedInjectable from "../../stores-apis-can-be-created.injectable";
+import { SecretStore } from "./store";
+
+const secretStoreInjectable = getInjectable({
+  id: "secret-store",
+  instantiate: (di) => {
+    assert(di.inject(storesAndApisCanBeCreatedInjectable), "secretStore is only available in certain environments");
+
+    const api = di.inject(secretApiInjectable);
+
+    return new SecretStore(api);
+  },
+  injectionToken: kubeObjectStoreInjectionToken,
+});
+
+export default secretStoreInjectable;
@@ -0,0 +1,10 @@
+/**
+ * Copyright (c) OpenLens Authors. All rights reserved.
+ * Licensed under MIT License. See LICENSE in root directory for more information.
+ */
+
+import { KubeObjectStore } from "../../../common/k8s-api/kube-object.store";
+import type { Secret, SecretApi, SecretData } from "../../../common/k8s-api/endpoints";
+
+export class SecretStore extends KubeObjectStore<Secret, SecretApi, SecretData> {
+}