diff --git a/src/behaviours/extension-special-characters-in-page-registrations.test.tsx b/src/behaviours/extension-special-characters-in-page-registrations.test.tsx
index 3e84479f69..e598277f30 100644
--- a/src/behaviours/extension-special-characters-in-page-registrations.test.tsx
+++ b/src/behaviours/extension-special-characters-in-page-registrations.test.tsx
@@ -10,6 +10,7 @@ import currentPathInjectable from "../renderer/routes/current-path.injectable";
 import type { LensRendererExtension } from "../extensions/lens-renderer-extension";
 import type { ApplicationBuilder } from "../renderer/components/test-utils/get-application-builder";
 import { getApplicationBuilder } from "../renderer/components/test-utils/get-application-builder";
+import type { SetRequired } from "type-fest";
 
 describe("extension special characters in page registrations", () => {
   let applicationBuilder: ApplicationBuilder;
@@ -49,7 +50,7 @@ describe("extension special characters in page registrations", () => {
   });
 });
 
-const extensionWithPagesHavingSpecialCharacters: Partial<LensRendererExtension> = {
+const extensionWithPagesHavingSpecialCharacters: SetRequired<Partial<LensRendererExtension>, "id"> = {
   id: "@some-extension-id/",
 
   globalPages: [
diff --git a/src/behaviours/navigate-to-extension-page.test.tsx b/src/behaviours/navigate-to-extension-page.test.tsx
index 915d3bab2b..c0985732ab 100644
--- a/src/behaviours/navigate-to-extension-page.test.tsx
+++ b/src/behaviours/navigate-to-extension-page.test.tsx
@@ -13,6 +13,7 @@ import currentPathInjectable from "../renderer/routes/current-path.injectable";
 import type { IComputedValue } from "mobx";
 import type { LensRendererExtension } from "../extensions/lens-renderer-extension";
 import { getApplicationBuilder } from "../renderer/components/test-utils/get-application-builder";
+import type { SetRequired } from "type-fest";
 
 describe("navigate to extension page", () => {
   let rendered: RenderResult;
@@ -125,7 +126,7 @@ describe("navigate to extension page", () => {
   });
 });
 
-const extensionWithPagesHavingParameters: Partial<LensRendererExtension> = {
+const extensionWithPagesHavingParameters: SetRequired<Partial<LensRendererExtension>, "id"> = {
   id: "some-extension-id",
 
   globalPages: [
diff --git a/src/behaviours/preferences/__snapshots__/navigation-to-proxy-preferences.test.ts.snap b/src/behaviours/preferences/__snapshots__/navigation-to-proxy-preferences.test.ts.snap
index ec521a3ad5..6e16245cf2 100644
--- a/src/behaviours/preferences/__snapshots__/navigation-to-proxy-preferences.test.ts.snap
+++ b/src/behaviours/preferences/__snapshots__/navigation-to-proxy-preferences.test.ts.snap
@@ -105,7 +105,7 @@ exports[`preferences - navigation to proxy preferences given in preferences, whe
               class="SubTitle"
             >
               Theme
-               
+
             </div>
             <div
               class="Select theme-lens css-b62m3t-container"
@@ -190,7 +190,7 @@ exports[`preferences - navigation to proxy preferences given in preferences, whe
               class="SubTitle"
             >
               Extension Install Registry
-               
+
             </div>
             <div
               class="Select theme-lens css-b62m3t-container"
@@ -270,16 +270,11 @@ exports[`preferences - navigation to proxy preferences given in preferences, whe
               class="mt-4 mb-5 leading-relaxed"
             >
               This setting is to change the registry URL for installing extensions by name.
-               
-              If you are unable to access the default registry (
-              https://registry.npmjs.org
-              )
-               
-              you can change it in your 
+              If you are unable to access the default registry (https://registry.npmjs.org) you can change it in your
               <b>
                 .npmrc
               </b>
-               file or in the input below.
+               file or in the input below.
             </p>
             <div
               class="Input theme round black disabled invalid"
@@ -309,7 +304,7 @@ exports[`preferences - navigation to proxy preferences given in preferences, whe
               class="SubTitle"
             >
               Start-up
-               
+
             </div>
             <label
               class="Switch"
@@ -330,7 +325,7 @@ exports[`preferences - navigation to proxy preferences given in preferences, whe
               class="SubTitle"
             >
               Update Channel
-               
+
             </div>
             <div
               class="Select theme-lens css-b62m3t-container"
@@ -415,7 +410,7 @@ exports[`preferences - navigation to proxy preferences given in preferences, whe
               class="SubTitle"
             >
               Locale Timezone
-               
+
             </div>
             <div
               class="Select theme-lens css-b62m3t-container"
@@ -636,7 +631,7 @@ exports[`preferences - navigation to proxy preferences given in preferences, whe
               class="SubTitle"
             >
               HTTP Proxy
-               
+
             </div>
             <div
               class="Input theme round black"
@@ -672,7 +667,7 @@ exports[`preferences - navigation to proxy preferences given in preferences, whe
               class="SubTitle"
             >
               Certificate Trust
-               
+
             </div>
             <label
               class="Switch"
@@ -688,9 +683,9 @@ exports[`preferences - navigation to proxy preferences given in preferences, whe
               class="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>
           </section>
diff --git a/src/common/utils/iter.ts b/src/common/utils/iter.ts
index ac4ba60cc4..169ab332f9 100644
--- a/src/common/utils/iter.ts
+++ b/src/common/utils/iter.ts
@@ -59,6 +59,10 @@ export class Iterator<T> {
 
     return this as never;
   }
+
+  public join(sep?: string): string {
+    return join(this.#inner, sep);
+  }
 }
 
 /**
diff --git a/src/renderer/components/+custom-resources/crd-list.tsx b/src/renderer/components/+custom-resources/crd-list.tsx
index 1a51c1b99d..385c7155a6 100644
--- a/src/renderer/components/+custom-resources/crd-list.tsx
+++ b/src/renderer/components/+custom-resources/crd-list.tsx
@@ -108,6 +108,7 @@ export class CustomResourceDefinitions extends React.Component {
               <>
                 {filters}
                 <Select
+                  id="crd-input"
                   className="group-select"
                   placeholder={this.getPlaceholder()}
                   options={this.groupSelectOptions}
diff --git a/src/renderer/components/+helm-releases/dialog/dialog.tsx b/src/renderer/components/+helm-releases/dialog/dialog.tsx
index f5ac39e50b..5655720e10 100644
--- a/src/renderer/components/+helm-releases/dialog/dialog.tsx
+++ b/src/renderer/components/+helm-releases/dialog/dialog.tsx
@@ -83,6 +83,7 @@ class NonInjectedReleaseRollbackDialog extends React.Component<ReleaseRollbackDi
       <div className="flex gaps align-center">
         <b>Revision</b>
         <Select
+          id="revision-input"
           themeName="light"
           value={revision}
           options={this.revisionOptions.get()}
diff --git a/src/renderer/components/+preferences/application.tsx b/src/renderer/components/+preferences/application.tsx
index 3751e9db06..bbda49f1a0 100644
--- a/src/renderer/components/+preferences/application.tsx
+++ b/src/renderer/components/+preferences/application.tsx
@@ -77,6 +77,7 @@ const NonInjectedApplication: React.FC<Dependencies> = ({ appPreferenceItems, us
         <section id="appearance">
           <SubTitle title="Theme" />
           <Select
+            id="theme-input"
             options={themeOptions}
             value={userStore.colorTheme}
             onChange={value => userStore.colorTheme = value?.value ?? defaultThemeId}
@@ -89,6 +90,7 @@ const NonInjectedApplication: React.FC<Dependencies> = ({ appPreferenceItems, us
         <section id="extensionRegistryUrl">
           <SubTitle title="Extension Install Registry" />
           <Select
+            id="extension-install-registry-input"
             options={extensionInstallRegistryOptions}
             value={userStore.extensionRegistryUrl.location}
             onChange={value => runInAction(() => {
@@ -140,6 +142,7 @@ const NonInjectedApplication: React.FC<Dependencies> = ({ appPreferenceItems, us
         <section id="update-channel">
           <SubTitle title="Update Channel" />
           <Select
+            id="update-channel-input"
             options={updateChannelOptions}
             value={userStore.updateChannel}
             onChange={value => userStore.updateChannel = value?.value ?? defaultUpdateChannel}
@@ -152,6 +155,7 @@ const NonInjectedApplication: React.FC<Dependencies> = ({ appPreferenceItems, us
         <section id="locale">
           <SubTitle title="Locale Timezone" />
           <Select
+            id="timezone-input"
             options={timezoneOptions}
             value={userStore.localeTimezone}
             onChange={value => userStore.localeTimezone = value?.value ?? defaultLocaleTimezone}
diff --git a/src/renderer/components/+preferences/editor.tsx b/src/renderer/components/+preferences/editor.tsx
index 2d0d846c0f..4405dc949c 100644
--- a/src/renderer/components/+preferences/editor.tsx
+++ b/src/renderer/components/+preferences/editor.tsx
@@ -57,6 +57,7 @@ const NonInjectedEditor = observer(({ userStore }: Dependencies) => {
             <div className="flex gaps align-center">
               <SubHeader compact>Position</SubHeader>
               <Select
+                id="minimap-input"
                 themeName="lens"
                 options={minimapPositionOptions}
                 value={editorConfiguration.minimap.side}
@@ -69,6 +70,7 @@ const NonInjectedEditor = observer(({ userStore }: Dependencies) => {
         <section>
           <SubTitle title="Line numbers"/>
           <Select
+            id="editor-line-numbers-input"
             options={lineNumberOptions}
             value={editorConfiguration.lineNumbers}
             onChange={option => editorConfiguration.lineNumbers = option?.value ?? defaultEditorConfig.lineNumbers}
diff --git a/src/renderer/components/+preferences/kubectl-binaries.tsx b/src/renderer/components/+preferences/kubectl-binaries.tsx
index 6a120ebcf1..413a85f023 100644
--- a/src/renderer/components/+preferences/kubectl-binaries.tsx
+++ b/src/renderer/components/+preferences/kubectl-binaries.tsx
@@ -56,6 +56,7 @@ const NonInjectedKubectlBinaries= observer(({
       <section>
         <SubTitle title="Download mirror" />
         <Select
+          id="download-mirror-input"
           placeholder="Download mirror for kubectl"
           options={downloadMirrorOptions}
           value={userStore.downloadMirror}
diff --git a/src/renderer/components/+preferences/terminal.tsx b/src/renderer/components/+preferences/terminal.tsx
index 02aa5fc7ab..995b82e32d 100644
--- a/src/renderer/components/+preferences/terminal.tsx
+++ b/src/renderer/components/+preferences/terminal.tsx
@@ -67,6 +67,7 @@ const NonInjectedTerminal = observer(({
         <section id="terminalTheme">
           <SubTitle title="Terminal theme" />
           <Select
+            id="terminal-theme-input"
             themeName="lens"
             options={themeOptions}
             value={userStore.terminalTheme}
diff --git a/src/renderer/components/cluster-manager/cluster-manager.tsx b/src/renderer/components/cluster-manager/cluster-manager.tsx
index 3f0f2b8a0b..10dcc64934 100644
--- a/src/renderer/components/cluster-manager/cluster-manager.tsx
+++ b/src/renderer/components/cluster-manager/cluster-manager.tsx
@@ -21,9 +21,10 @@ import { setEntityOnRouteMatch } from "../../api/helpers/general-active-sync";
 import { navigation } from "../../navigation";
 import welcomeRouteInjectable from "../../../common/front-end-routing/routes/welcome/welcome-route.injectable";
 import { buildURL } from "../../../common/utils/buildUrl";
+import type { StorageLayer } from "../../utils";
 
 interface Dependencies {
-  catalogPreviousActiveTabStorage: { get: () => string };
+  catalogPreviousActiveTabStorage: StorageLayer<string | null>;
   currentRouteComponent: IComputedValue<React.ElementType | undefined>;
   welcomeUrl: string;
 }
diff --git a/src/renderer/components/select/select.tsx b/src/renderer/components/select/select.tsx
index cd2aefe86a..1606c38ddb 100644
--- a/src/renderer/components/select/select.tsx
+++ b/src/renderer/components/select/select.tsx
@@ -42,7 +42,7 @@ export interface SelectProps<
   IsMulti extends boolean,
   Group extends GroupBase<Option> = GroupBase<Option>,
 > extends SetRequired<Omit<ReactSelectProps<Option, IsMulti, Group>, "value">, "options"> {
-  id?: string; // Optional only because of Extension API. Required to make Select deterministic in unit tests
+  id: string; // Optional only because of Extension API. Required to make Select deterministic in unit tests
   themeName?: "dark" | "light" | "outlined" | "lens";
   menuClass?: string;
   value?: PropsValue<Value>;
diff --git a/src/renderer/utils/cssNames.ts b/src/renderer/utils/cssNames.ts
index 2be8ceca5b..ed798e2979 100755
--- a/src/renderer/utils/cssNames.ts
+++ b/src/renderer/utils/cssNames.ts
@@ -3,29 +3,31 @@
  * Licensed under MIT License. See LICENSE in root directory for more information.
  */
 
-// Helper for combining css classes inside components
+import { iter } from "../../common/utils";
 
 export type IgnoredClassNames = number | symbol | Function;
 
 export type IClassName = string | string[] | IClassNameMap | undefined | null | false | IgnoredClassNames;
-export type IClassNameMap = Record<string, unknown>;
+export type IClassNameMap = object;
 
 export function cssNames(...classNames: IClassName[]): string {
-  const classNamesEnabled: IClassNameMap = {};
+  const classNamesEnabled = new Map<string, boolean>();
 
   for (const className of classNames) {
     if (typeof className === "string") {
-      classNamesEnabled[className] = true;
+      classNamesEnabled.set(className, true);
     } else if (Array.isArray(className)) {
       for (const name of className) {
-        classNamesEnabled[name] = true;
+        classNamesEnabled.set(name, true);
       }
     } else if (className && typeof className === "object") {
-      Object.assign(classNamesEnabled, className);
+      for (const [name, value] of Object.entries(className)) {
+        classNamesEnabled.set(name, Boolean(value));
+      }
     }
   }
 
-  return Object.entries(classNamesEnabled)
+  return iter.pipeline(classNamesEnabled)
     .filter(([, isActive]) => !!isActive)
     .map(([className]) => className.trim())
     .join(" ");