From 0b32775d401b32773948f36157341e01ece1cd6f Mon Sep 17 00:00:00 2001
From: Sebastian Malton <sebastian@malton.name>
Date: Tue, 1 Mar 2022 13:06:53 -0500
Subject: [PATCH] Enforce some naming conventions (#4813)

---
 .eslintrc.js                                  |  23 ++++
 docs/extensions/guides/renderer-extension.md  |   4 +-
 docs/extensions/guides/resource-stack.md      |   6 +-
 .../src/metrics-settings.tsx                  |   6 +-
 src/common/__tests__/kube-helpers.test.ts     |   4 +-
 src/common/app-event-bus/event-bus.ts         |   4 +-
 src/common/catalog-entities/web-link.ts       |   4 +-
 src/common/k8s-api/endpoints/crd.api.ts       |   4 +-
 src/common/k8s-api/kube-api.ts                |   4 +-
 src/common/utils/index.ts                     |   3 +-
 src/common/utils/singleton.ts                 |   2 +-
 src/common/utils/tuple.ts                     |  10 +-
 src/common/utils/types.ts                     |  10 --
 .../renderer-api/kube-object-status.ts        |   4 +-
 .../base-cluster-detector.ts                  |   4 +-
 src/main/lens-binary.ts                       |   4 +-
 src/main/prometheus/provider-registry.ts      |   4 +-
 .../+catalog/catalog-add-button.tsx           |   4 +-
 .../+catalog/catalog-entity-details.tsx       |   4 +-
 .../components/+catalog/catalog-menu.tsx      |   6 +-
 src/renderer/components/+catalog/catalog.tsx  |   8 +-
 .../components/+cluster/cluster-issues.tsx    |   6 +-
 .../+cluster/cluster-no-metrics.tsx           |   4 +-
 .../components/+config-autoscalers/hpa.tsx    |   4 +-
 .../limit-range-details.tsx                   |   4 +-
 .../+config-limit-ranges/limit-ranges.tsx     |   4 +-
 .../+config-maps/config-map-details.tsx       |   6 +-
 .../components/+config-maps/config-maps.tsx   |   4 +-
 .../pod-disruption-budgets-details.tsx        |   4 +-
 .../pod-disruption-budgets.tsx                |   4 +-
 .../add-quota-dialog.tsx                      |   6 +-
 .../resource-quota-details.tsx                |   4 +-
 .../resource-quotas.tsx                       |   4 +-
 .../+config-secrets/add-secret-dialog.tsx     |   6 +-
 .../+config-secrets/secret-details.tsx        |   6 +-
 .../components/+config-secrets/secrets.tsx    |   4 +-
 .../+custom-resources/crd-details.tsx         |   4 +-
 .../components/+custom-resources/crd-list.tsx |   2 +-
 .../crd-resource-details.tsx                  |   4 +-
 .../+custom-resources/crd-resources.tsx       |   6 +-
 .../components/+custom-resources/route.tsx    |   7 +-
 .../+entity-settings/entity-settings.tsx      |   6 +-
 .../components/+events/event-details.tsx      |   4 +-
 src/renderer/components/+events/events.tsx    |   8 +-
 .../components/+events/kube-event-icon.tsx    |   7 +-
 .../components/+extensions/install.tsx        |   6 +-
 .../+extensions/installed-extensions.tsx      |  23 ++--
 .../components/+extensions/notice.tsx         |   4 +-
 .../+helm-charts/helm-chart-details.tsx       |   8 +-
 .../components/+helm-charts/helm-charts.tsx   |   4 +-
 .../release-details/release-details.tsx       |   8 +-
 .../+helm-releases/release-menu.tsx           |   6 +-
 .../release-rollback-dialog.tsx               |   8 +-
 .../components/+helm-releases/releases.tsx    |   6 +-
 .../+namespaces/add-namespace-dialog.tsx      |   8 +-
 .../+namespaces/namespace-details.tsx         |   8 +-
 .../+namespaces/namespace-select-filter.tsx   | 130 ++++++++----------
 .../+namespaces/namespace-select.tsx          |  10 +-
 .../+network-endpoints/endpoint-details.tsx   |   4 +-
 .../endpoint-subset-list.tsx                  |   4 +-
 .../+network-endpoints/endpoints.tsx          |   4 +-
 .../+network-ingresses/ingress-details.tsx    |   6 +-
 .../+network-ingresses/ingresses.tsx          |   4 +-
 .../+network-policies/network-policies.tsx    |   4 +-
 .../network-policy-details.tsx                |   4 +-
 .../port-forward-details.tsx                  |   4 +-
 .../port-forward-menu.tsx                     |   6 +-
 .../+network-port-forwards/port-forwards.tsx  |   6 +-
 .../service-details-endpoint.tsx              |   4 +-
 .../+network-services/service-details.tsx     |   6 +-
 .../service-port-component.tsx                |   8 +-
 .../components/+network-services/services.tsx |   4 +-
 .../components/+nodes/details-resources.tsx   |   4 +-
 src/renderer/components/+nodes/details.tsx    |   8 +-
 src/renderer/components/+nodes/route.tsx      |   6 +-
 .../pod-security-policy-details.tsx           |   4 +-
 .../+preferences/add-helm-repo-dialog.tsx     |   8 +-
 .../+preferences/extension-settings.tsx       |   2 +-
 .../+preferences/removable-item.tsx           |   4 +-
 .../storage-class-details.tsx                 |   6 +-
 .../+storage-classes/storage-classes.tsx      |   4 +-
 .../volume-claim-details.tsx                  |   6 +-
 .../+storage-volume-claims/volume-claims.tsx  |   4 +-
 .../+storage-volumes/volume-details-list.tsx  |   4 +-
 .../+storage-volumes/volume-details.tsx       |   4 +-
 .../components/+storage-volumes/volumes.tsx   |   4 +-
 .../+cluster-role-bindings/details.tsx        |   6 +-
 .../+cluster-role-bindings/dialog.tsx         |   6 +-
 .../+cluster-role-bindings/view.tsx           |   4 +-
 .../+cluster-roles/add-dialog.tsx             |   6 +-
 .../+cluster-roles/details.tsx                |   4 +-
 .../+user-management/+cluster-roles/view.tsx  |   4 +-
 .../+role-bindings/details.tsx                |   4 +-
 .../+role-bindings/dialog.tsx                 |   6 +-
 .../+user-management/+role-bindings/view.tsx  |   4 +-
 .../+user-management/+roles/add-dialog.tsx    |   6 +-
 .../+user-management/+roles/details.tsx       |   4 +-
 .../+user-management/+roles/view.tsx          |   4 +-
 .../+service-accounts/create-dialog.tsx       |   6 +-
 .../+service-accounts/details.tsx             |   6 +-
 .../+service-accounts/secret.tsx              |   4 +-
 .../+service-accounts/view.tsx                |   4 +-
 .../+workloads-cronjobs/cronjob-details.tsx   |   6 +-
 .../cronjob-trigger-dialog.tsx                |   6 +-
 .../+workloads-cronjobs/cronjobs.tsx          |   4 +-
 .../daemonset-details.tsx                     |   8 +-
 .../+workloads-daemonsets/daemonsets.tsx      |   4 +-
 .../deployment-details.tsx                    |   8 +-
 .../deployment-replicasets.tsx                |   4 +-
 .../deployment-scale-dialog.tsx               |   6 +-
 .../+workloads-deployments/deployments.tsx    |   4 +-
 .../+workloads-jobs/job-details.tsx           |   8 +-
 .../components/+workloads-jobs/jobs.tsx       |   4 +-
 .../overview-workload-status.tsx              |   4 +-
 .../+workloads-overview/overview.tsx          |   8 +-
 .../+workloads-pods/pod-container-env.tsx     |   6 +-
 .../+workloads-pods/pod-container-port.tsx    |   8 +-
 .../pod-details-affinities.tsx                |   4 +-
 .../+workloads-pods/pod-details-container.tsx |   6 +-
 .../+workloads-pods/pod-details-list.tsx      |   7 +-
 .../+workloads-pods/pod-details-secrets.tsx   |   6 +-
 .../+workloads-pods/pod-details-statuses.tsx  |   4 +-
 .../pod-details-tolerations.tsx               |   4 +-
 .../+workloads-pods/pod-details.tsx           |   6 +-
 .../+workloads-pods/pod-tolerations.tsx       |   4 +-
 .../components/+workloads-pods/pods.tsx       |   4 +-
 .../replicaset-details.tsx                    |   8 +-
 .../replicaset-scale-dialog.tsx               |   6 +-
 .../+workloads-replicasets/replicasets.tsx    |   4 +-
 .../statefulset-details.tsx                   |   8 +-
 .../statefulset-scale-dialog.tsx              |   6 +-
 .../+workloads-statefulsets/statefulsets.tsx  |   4 +-
 src/renderer/components/chart/bar-chart.tsx   |   6 +-
 src/renderer/components/chart/pie-chart.tsx   |   4 +-
 .../cluster-manager/cluster-status.tsx        |   6 +-
 .../cluster-manager/cluster-view.tsx          |   6 +-
 .../cluster-accessible-namespaces.tsx         |   6 +-
 .../components/cluster-icon-settings.tsx      |   4 +-
 .../components/cluster-kubeconfig.tsx         |   4 +-
 .../cluster-local-terminal-settings.tsx       |   4 +-
 .../components/cluster-metrics-setting.tsx    |   6 +-
 .../components/cluster-name-setting.tsx       |   6 +-
 .../components/cluster-node-shell-setting.tsx |   6 +-
 .../components/cluster-prometheus-setting.tsx |   6 +-
 .../components/cluster-proxy-setting.tsx      |   6 +-
 .../components/cluster-show-metrics.tsx       |   6 +-
 .../delete-cluster-dialog.tsx                 |  10 +-
 .../components/dialog/logs-dialog.tsx         |   4 +-
 .../components/dock/create-resource/view.tsx  |   8 +-
 src/renderer/components/dock/dock-tabs.tsx    |   4 +-
 src/renderer/components/dock/dock.tsx         |   6 +-
 .../components/dock/edit-resource/view.tsx    |   8 +-
 src/renderer/components/dock/info-panel.tsx   |  10 +-
 .../components/dock/install-chart/view.tsx    |   8 +-
 .../components/dock/terminal/dock-tab.tsx     |   6 +-
 .../components/dock/terminal/view.tsx         |   6 +-
 .../components/dock/upgrade-chart/view.tsx    |   8 +-
 .../editable-list/editable-list.tsx           |   8 +-
 .../error-boundary/error-boundary.tsx         |   4 +-
 .../components/file-picker/file-picker.tsx    |   8 +-
 .../components/hotbar/hotbar-cell.tsx         |   4 +-
 .../components/hotbar/hotbar-entity-icon.tsx  |   6 +-
 .../components/hotbar/hotbar-icon.tsx         |   4 +-
 .../components/hotbar/hotbar-menu.tsx         |   6 +-
 src/renderer/components/input/file-input.tsx  |   4 +-
 src/renderer/components/input/input.tsx       |   2 +-
 .../components/input/search-input.tsx         |   6 +-
 .../components/item-object-list/content.tsx   |   2 +-
 .../item-object-list/filter-icon.tsx          |   4 +-
 .../item-object-list/page-filters-list.tsx    |   6 +-
 .../kube-object-details.tsx                   |   4 +-
 .../kube-object-status-icon.tsx               |   4 +-
 .../kubeconfig-dialog/kubeconfig-dialog.tsx   |   6 +-
 .../components/layout/close-button.tsx        |   4 +-
 .../components/layout/main-layout.tsx         |   6 +-
 .../components/layout/sidebar-item.tsx        |   2 +-
 src/renderer/components/layout/sidebar.tsx    |   2 +-
 src/renderer/components/layout/sub-title.tsx  |   4 +-
 src/renderer/components/list/list.tsx         |   4 +-
 .../components/locale-date/locale-date.tsx    |   4 +-
 .../markdown-viewer/markdown-viewer.tsx       |   6 +-
 src/renderer/components/no-items/no-items.tsx |   4 +-
 .../components/render-delay/render-delay.tsx  |   6 +-
 .../resizing-anchor/resizing-anchor.tsx       |   6 +-
 .../resource-metrics-text.tsx                 |  14 +-
 .../resource-metrics/resource-metrics.tsx     |  14 +-
 .../components/scroll-spy/scroll-spy.tsx      |   4 +-
 src/renderer/components/switch/switch.tsx     |   4 +-
 src/renderer/components/switch/switcher.tsx   |   4 +-
 src/renderer/components/table/react-table.tsx |   4 +-
 src/renderer/components/table/table.tsx       |   5 +-
 .../components/tree-view/tree-view.tsx        |   4 +-
 .../components/virtual-list/virtual-list.tsx  |  10 +-
 src/renderer/components/wizard/wizard.tsx     |  53 ++++---
 .../port-forward/port-forward-dialog.tsx      |   8 +-
 .../utils/__tests__/storageHelper.test.ts     |   4 +-
 src/renderer/utils/cssNames.ts                |   4 +-
 197 files changed, 630 insertions(+), 634 deletions(-)
 delete mode 100644 src/common/utils/types.ts

diff --git a/.eslintrc.js b/.eslintrc.js
index 0c0eeef2c2..062313f68d 100644
--- a/.eslintrc.js
+++ b/.eslintrc.js
@@ -146,6 +146,29 @@ module.exports = {
           "named": "never",
           "asyncArrow": "always",
         }],
+        "@typescript-eslint/naming-convention": ["error",
+          {
+            "selector": "interface",
+            "format": ["PascalCase"],
+            "leadingUnderscore": "forbid",
+            "trailingUnderscore": "forbid",
+            "custom": {
+              "regex": "^Props$",
+              "match": false,
+            },
+          },
+          {
+            "selector": "typeAlias",
+            "format": ["PascalCase"],
+            "leadingUnderscore": "forbid",
+            "trailingUnderscore": "forbid",
+            "custom": {
+              "regex": "^(Props|State)$",
+              "match": false,
+            },
+          },
+        ],
+        "@typescript-eslint/consistent-type-definitions": ["error", "interface"],
         "unused-imports/no-unused-imports-ts": process.env.PROD === "true" ? "error" : "warn",
         "unused-imports/no-unused-vars-ts": [
           "warn", {
diff --git a/docs/extensions/guides/renderer-extension.md b/docs/extensions/guides/renderer-extension.md
index 67624f1952..e9439fb0a9 100644
--- a/docs/extensions/guides/renderer-extension.md
+++ b/docs/extensions/guides/renderer-extension.md
@@ -724,11 +724,11 @@ const {
 
 type Pod = Renderer.K8sApi.Pod;
 
-interface Props {
+interface PodsDetailsListProps {
   pods?: Pod[];
 }
 
-export class PodsDetailsList extends React.Component<Props> {
+export class PodsDetailsList extends React.Component<PodsDetailsListProps> {
   getTableRow = (pod: Pod) => {
     return (
       <TableRow key={index} nowrap>
diff --git a/docs/extensions/guides/resource-stack.md b/docs/extensions/guides/resource-stack.md
index 7be024e389..3c3111d5a4 100644
--- a/docs/extensions/guides/resource-stack.md
+++ b/docs/extensions/guides/resource-stack.md
@@ -109,13 +109,13 @@ To allow the end-user to control the life cycle of this cluster feature the foll
    }
  } = Renderer;
 
- interface Props {
+ interface ExampleClusterFeatureSettingsProps {
    cluster: Common.Catalog.KubernetesCluster;
  }
 
  @observer
- export class ExampleClusterFeatureSettings extends React.Component<Props> {
-  constructor(props: Props) {
+ export class ExampleClusterFeatureSettings extends React.Component<ExampleClusterFeatureSettingsProps> {
+  constructor(props: ExampleClusterFeatureSettingsProps) {
     super(props);
     makeObservable(this);
   }
diff --git a/extensions/metrics-cluster-feature/src/metrics-settings.tsx b/extensions/metrics-cluster-feature/src/metrics-settings.tsx
index f309ff13cc..706feaedba 100644
--- a/extensions/metrics-cluster-feature/src/metrics-settings.tsx
+++ b/extensions/metrics-cluster-feature/src/metrics-settings.tsx
@@ -17,13 +17,13 @@ const {
   },
 } = Renderer;
 
-interface Props {
+export interface MetricsSettingsProps {
   cluster: Common.Catalog.KubernetesCluster;
 }
 
 @observer
-export class MetricsSettings extends React.Component<Props> {
-  constructor(props: Props) {
+export class MetricsSettings extends React.Component<MetricsSettingsProps> {
+  constructor(props: MetricsSettingsProps) {
     super(props);
     makeObservable(this);
   }
diff --git a/src/common/__tests__/kube-helpers.test.ts b/src/common/__tests__/kube-helpers.test.ts
index 80c5b88ec3..26a64c3995 100644
--- a/src/common/__tests__/kube-helpers.test.ts
+++ b/src/common/__tests__/kube-helpers.test.ts
@@ -43,7 +43,7 @@ users:
       command: foo
 `;
 
-interface kubeconfig {
+interface Kubeconfig {
   apiVersion: string;
   clusters: [{
     name: string;
@@ -66,7 +66,7 @@ interface kubeconfig {
   preferences: {};
 }
 
-let mockKubeConfig: kubeconfig;
+let mockKubeConfig: Kubeconfig;
 
 describe("kube helpers", () => {
   describe("validateKubeconfig", () => {
diff --git a/src/common/app-event-bus/event-bus.ts b/src/common/app-event-bus/event-bus.ts
index 3291a7674f..71a27e1a42 100644
--- a/src/common/app-event-bus/event-bus.ts
+++ b/src/common/app-event-bus/event-bus.ts
@@ -5,10 +5,10 @@
 
 import { EventEmitter } from "../event-emitter";
 
-export type AppEvent = {
+export interface AppEvent {
   name: string;
   action: string;
   params?: object;
-};
+}
 
 export const appEventBus = new EventEmitter<[AppEvent]>();
diff --git a/src/common/catalog-entities/web-link.ts b/src/common/catalog-entities/web-link.ts
index a014b22aa4..52b5f20cd6 100644
--- a/src/common/catalog-entities/web-link.ts
+++ b/src/common/catalog-entities/web-link.ts
@@ -14,9 +14,9 @@ export interface WebLinkStatus extends CatalogEntityStatus {
   phase: WebLinkStatusPhase;
 }
 
-export type WebLinkSpec = {
+export interface WebLinkSpec {
   url: string;
-};
+}
 
 export class WebLink extends CatalogEntity<CatalogEntityMetadata, WebLinkStatus, WebLinkSpec> {
   public static readonly apiVersion = "entity.k8slens.dev/v1alpha1";
diff --git a/src/common/k8s-api/endpoints/crd.api.ts b/src/common/k8s-api/endpoints/crd.api.ts
index 2f330feaf9..98f78a0716 100644
--- a/src/common/k8s-api/endpoints/crd.api.ts
+++ b/src/common/k8s-api/endpoints/crd.api.ts
@@ -9,12 +9,12 @@ import { crdResourcesURL } from "../../routes";
 import { isClusterPageContext } from "../../utils/cluster-id-url-parsing";
 import type { KubeJsonApiData } from "../kube-json-api";
 
-type AdditionalPrinterColumnsCommon = {
+interface AdditionalPrinterColumnsCommon {
   name: string;
   type: "integer" | "number" | "string" | "boolean" | "date";
   priority: number;
   description: string;
-};
+}
 
 export type AdditionalPrinterColumnsV1 = AdditionalPrinterColumnsCommon & {
   jsonPath: string;
diff --git a/src/common/k8s-api/kube-api.ts b/src/common/k8s-api/kube-api.ts
index b81b72eae4..151e89f03d 100644
--- a/src/common/k8s-api/kube-api.ts
+++ b/src/common/k8s-api/kube-api.ts
@@ -216,7 +216,7 @@ export function ensureObjectSelfLink(api: KubeApi<KubeObject>, object: KubeJsonA
 
 export type KubeApiWatchCallback = (data: IKubeWatchEvent<KubeJsonApiData>, error: any) => void;
 
-export type KubeApiWatchOptions = {
+export interface KubeApiWatchOptions {
   namespace: string;
   callback?: KubeApiWatchCallback;
   abortController?: AbortController;
@@ -225,7 +225,7 @@ export type KubeApiWatchOptions = {
 
   // timeout in seconds
   timeout?: number;
-};
+}
 
 export type KubeApiPatchType = "merge" | "json" | "strategic";
 
diff --git a/src/common/utils/index.ts b/src/common/utils/index.ts
index d9130cbb05..0ecb4bc71e 100644
--- a/src/common/utils/index.ts
+++ b/src/common/utils/index.ts
@@ -40,9 +40,10 @@ export * from "./splitArray";
 export * from "./tar";
 export * from "./toJS";
 export * from "./type-narrowing";
-export * from "./types";
 export * from "./wait-for-path";
 
+export type { Tuple } from "./tuple";
+
 import * as iter from "./iter";
 import * as array from "./array";
 import * as tuple from "./tuple";
diff --git a/src/common/utils/singleton.ts b/src/common/utils/singleton.ts
index aff4970be1..5f1172b660 100644
--- a/src/common/utils/singleton.ts
+++ b/src/common/utils/singleton.ts
@@ -3,7 +3,7 @@
  * Licensed under MIT License. See LICENSE in root directory for more information.
  */
 
-type StaticThis<T, R extends any[]> = { new(...args: R): T };
+interface StaticThis<T, R extends any[]> { new(...args: R): T }
 
 export class Singleton {
   private static instances = new WeakMap<object, Singleton>();
diff --git a/src/common/utils/tuple.ts b/src/common/utils/tuple.ts
index 9c86dea277..17586dda33 100644
--- a/src/common/utils/tuple.ts
+++ b/src/common/utils/tuple.ts
@@ -8,8 +8,14 @@ import * as array from "../utils/array";
 /**
  * A strict N-tuple of type T
  */
-export type Tuple<T, N extends number> = N extends N ? number extends N ? T[] : _TupleOf<T, N, []> : never;
-type _TupleOf<T, N extends number, R extends unknown[]> = R["length"] extends N ? R : _TupleOf<T, N, [T, ...R]>;
+export type Tuple<T, N extends number> = N extends N
+  ? number extends N
+    ? T[]
+    : TupleOfImpl<T, N, []>
+  : never;
+type TupleOfImpl<T, N extends number, R extends unknown[]> = R["length"] extends N
+  ? R
+  : TupleOfImpl<T, N, [T, ...R]>;
 
 /**
  * Iterates over `sources` yielding full tuples until one of the tuple arrays
diff --git a/src/common/utils/types.ts b/src/common/utils/types.ts
deleted file mode 100644
index f5c6a6b555..0000000000
--- a/src/common/utils/types.ts
+++ /dev/null
@@ -1,10 +0,0 @@
-/**
- * Copyright (c) OpenLens Authors. All rights reserved.
- * Licensed under MIT License. See LICENSE in root directory for more information.
- */
-
-/**
- * An N length tuple of T
- */
-export type Tuple<T, N extends number> = N extends N ? number extends N ? T[] : _TupleOf<T, N, []> : never;
-type _TupleOf<T, N extends number, R extends unknown[]> = R["length"] extends N ? R : _TupleOf<T, N, [T, ...R]>;
diff --git a/src/extensions/renderer-api/kube-object-status.ts b/src/extensions/renderer-api/kube-object-status.ts
index abc2354ca1..200bf35b5d 100644
--- a/src/extensions/renderer-api/kube-object-status.ts
+++ b/src/extensions/renderer-api/kube-object-status.ts
@@ -3,11 +3,11 @@
  * Licensed under MIT License. See LICENSE in root directory for more information.
  */
 
-export type KubeObjectStatus = {
+export interface KubeObjectStatus {
   level: KubeObjectStatusLevel;
   text: string;
   timestamp?: string;
-};
+}
 
 export enum KubeObjectStatusLevel {
   INFO = 1,
diff --git a/src/main/cluster-detectors/base-cluster-detector.ts b/src/main/cluster-detectors/base-cluster-detector.ts
index a29fae2adc..a5a2564ab4 100644
--- a/src/main/cluster-detectors/base-cluster-detector.ts
+++ b/src/main/cluster-detectors/base-cluster-detector.ts
@@ -7,10 +7,10 @@ import type { RequestPromiseOptions } from "request-promise-native";
 import type { Cluster } from "../../common/cluster/cluster";
 import { k8sRequest } from "../k8s-request";
 
-export type ClusterDetectionResult = {
+export interface ClusterDetectionResult {
   value: string | number | boolean;
   accuracy: number;
-};
+}
 
 export class BaseClusterDetector {
   key: string;
diff --git a/src/main/lens-binary.ts b/src/main/lens-binary.ts
index 2b8b5c27d3..63841585fd 100644
--- a/src/main/lens-binary.ts
+++ b/src/main/lens-binary.ts
@@ -11,13 +11,13 @@ import * as tar from "tar";
 import { isWindows } from "../common/vars";
 import type winston from "winston";
 
-export type LensBinaryOpts = {
+export interface LensBinaryOpts {
   version: string;
   baseDir: string;
   originalBinaryName: string;
   newBinaryName?: string;
   requestOpts?: request.Options;
-};
+}
 
 export class LensBinary {
 
diff --git a/src/main/prometheus/provider-registry.ts b/src/main/prometheus/provider-registry.ts
index 36d326e161..21c64d7a67 100644
--- a/src/main/prometheus/provider-registry.ts
+++ b/src/main/prometheus/provider-registry.ts
@@ -7,12 +7,12 @@ import type { CoreV1Api } from "@kubernetes/client-node";
 import { inspect } from "util";
 import { Singleton } from "../../common/utils";
 
-export type PrometheusService = {
+export interface PrometheusService {
   id: string;
   namespace: string;
   service: string;
   port: number;
-};
+}
 
 export abstract class PrometheusProvider {
   abstract readonly id: string;
diff --git a/src/renderer/components/+catalog/catalog-add-button.tsx b/src/renderer/components/+catalog/catalog-add-button.tsx
index 3034abd97a..8d5daa6025 100644
--- a/src/renderer/components/+catalog/catalog-add-button.tsx
+++ b/src/renderer/components/+catalog/catalog-add-button.tsx
@@ -15,9 +15,9 @@ import { EventEmitter } from "events";
 import { navigate } from "../../navigation";
 import { catalogCategoryRegistry } from "../../api/catalog-category-registry";
 
-export type CatalogAddButtonProps = {
+export interface CatalogAddButtonProps {
   category: CatalogCategory;
-};
+}
 
 type CategoryId = string;
 
diff --git a/src/renderer/components/+catalog/catalog-entity-details.tsx b/src/renderer/components/+catalog/catalog-entity-details.tsx
index 0603821322..569e6b60c1 100644
--- a/src/renderer/components/+catalog/catalog-entity-details.tsx
+++ b/src/renderer/components/+catalog/catalog-entity-details.tsx
@@ -16,14 +16,14 @@ import { cssNames } from "../../utils";
 import { Avatar } from "../avatar";
 import { getLabelBadges } from "./helpers";
 
-interface Props<T extends CatalogEntity> {
+export interface CatalogEntityDetailsProps<T extends CatalogEntity> {
   entity: T;
   hideDetails(): void;
   onRun: () => void;
 }
 
 @observer
-export class CatalogEntityDetails<T extends CatalogEntity> extends Component<Props<T>> {
+export class CatalogEntityDetails<T extends CatalogEntity> extends Component<CatalogEntityDetailsProps<T>> {
   categoryIcon(category: CatalogCategory) {
     if (Icon.isSvg(category.metadata.icon)) {
       return <Icon svg={category.metadata.icon} smallest />;
diff --git a/src/renderer/components/+catalog/catalog-menu.tsx b/src/renderer/components/+catalog/catalog-menu.tsx
index ccd347aefe..2cc543c25f 100644
--- a/src/renderer/components/+catalog/catalog-menu.tsx
+++ b/src/renderer/components/+catalog/catalog-menu.tsx
@@ -15,10 +15,10 @@ import { cssNames } from "../../utils";
 import type { CatalogCategory } from "../../api/catalog-entity";
 import { observer } from "mobx-react";
 
-type Props = {
+export interface CatalogMenuProps {
   activeItem: string;
   onItemClick: (id: string) => void;
-};
+}
 
 function getCategories() {
   return catalogCategoryRegistry.filteredItems;
@@ -42,7 +42,7 @@ function Item(props: TreeItemProps) {
   );
 }
 
-export const CatalogMenu = observer((props: Props) => {
+export const CatalogMenu = observer((props: CatalogMenuProps) => {
   return (
     // Overwrite Material UI styles with injectFirst https://material-ui.com/guides/interoperability/#controlling-priority-4
     <StylesProvider injectFirst>
diff --git a/src/renderer/components/+catalog/catalog.tsx b/src/renderer/components/+catalog/catalog.tsx
index 0287925e32..359e538ac5 100644
--- a/src/renderer/components/+catalog/catalog.tsx
+++ b/src/renderer/components/+catalog/catalog.tsx
@@ -37,7 +37,7 @@ import type { RegisteredCustomCategoryViewDecl } from "./custom-views.injectable
 import customCategoryViewsInjectable from "./custom-views.injectable";
 import type { CustomCategoryViewComponents } from "./custom-views";
 
-interface Props extends RouteComponentProps<CatalogViewRouteParam> {}
+export interface CatalogProps extends RouteComponentProps<CatalogViewRouteParam> {}
 
 interface Dependencies {
   catalogPreviousActiveTabStorage: { set: (value: string ) => void };
@@ -47,11 +47,11 @@ interface Dependencies {
 }
 
 @observer
-class NonInjectedCatalog extends React.Component<Props & Dependencies> {
+class NonInjectedCatalog extends React.Component<CatalogProps & Dependencies> {
   @observable private contextMenu: CatalogEntityContextMenuContext;
   @observable activeTab?: string;
 
-  constructor(props: Props & Dependencies) {
+  constructor(props: CatalogProps & Dependencies) {
     super(props);
     makeObservable(this);
   }
@@ -305,7 +305,7 @@ class NonInjectedCatalog extends React.Component<Props & Dependencies> {
   }
 }
 
-export const Catalog = withInjectables<Dependencies, Props>( NonInjectedCatalog, {
+export const Catalog = withInjectables<Dependencies, CatalogProps>( NonInjectedCatalog, {
   getProps: (di, props) => ({
     catalogEntityStore: di.inject(catalogEntityStoreInjectable),
     catalogPreviousActiveTabStorage: di.inject(catalogPreviousActiveTabStorageInjectable),
diff --git a/src/renderer/components/+cluster/cluster-issues.tsx b/src/renderer/components/+cluster/cluster-issues.tsx
index 3939ea7de6..b0218bbcfb 100644
--- a/src/renderer/components/+cluster/cluster-issues.tsx
+++ b/src/renderer/components/+cluster/cluster-issues.tsx
@@ -20,7 +20,7 @@ import { ThemeStore } from "../../theme.store";
 import { kubeSelectedUrlParam, toggleDetails } from "../kube-detail-params";
 import { apiManager } from "../../../common/k8s-api/api-manager";
 
-interface Props {
+export interface ClusterIssuesProps {
   className?: string;
 }
 
@@ -39,14 +39,14 @@ enum sortBy {
 }
 
 @observer
-export class ClusterIssues extends React.Component<Props> {
+export class ClusterIssues extends React.Component<ClusterIssuesProps> {
   private sortCallbacks = {
     [sortBy.type]: (warning: IWarning) => warning.kind,
     [sortBy.object]: (warning: IWarning) => warning.getName(),
     [sortBy.age]: (warning: IWarning) => warning.timeDiffFromNow,
   };
 
-  constructor(props: Props) {
+  constructor(props: ClusterIssuesProps) {
     super(props);
     makeObservable(this);
   }
diff --git a/src/renderer/components/+cluster/cluster-no-metrics.tsx b/src/renderer/components/+cluster/cluster-no-metrics.tsx
index 09494f56dd..c8638c2602 100644
--- a/src/renderer/components/+cluster/cluster-no-metrics.tsx
+++ b/src/renderer/components/+cluster/cluster-no-metrics.tsx
@@ -7,11 +7,11 @@ import React from "react";
 import { Icon } from "../icon";
 import { cssNames } from "../../utils";
 
-interface Props {
+export interface ClusterNoMetricsProps {
   className: string;
 }
 
-export function ClusterNoMetrics({ className }: Props) {
+export function ClusterNoMetrics({ className }: ClusterNoMetricsProps) {
   return (
     <div className={cssNames("ClusterNoMetrics flex column box grow justify-center align-center", className)}>
       <Icon material="info"/>
diff --git a/src/renderer/components/+config-autoscalers/hpa.tsx b/src/renderer/components/+config-autoscalers/hpa.tsx
index 34c57729fa..f0b0e98265 100644
--- a/src/renderer/components/+config-autoscalers/hpa.tsx
+++ b/src/renderer/components/+config-autoscalers/hpa.tsx
@@ -27,11 +27,11 @@ enum columnId {
   status = "status",
 }
 
-interface Props extends RouteComponentProps<HpaRouteParams> {
+export interface HorizontalPodAutoscalersProps extends RouteComponentProps<HpaRouteParams> {
 }
 
 @observer
-export class HorizontalPodAutoscalers extends React.Component<Props> {
+export class HorizontalPodAutoscalers extends React.Component<HorizontalPodAutoscalersProps> {
   getTargets(hpa: HorizontalPodAutoscaler) {
     const metrics = hpa.getMetrics();
 
diff --git a/src/renderer/components/+config-limit-ranges/limit-range-details.tsx b/src/renderer/components/+config-limit-ranges/limit-range-details.tsx
index 01255b7dc7..8f8c7d455e 100644
--- a/src/renderer/components/+config-limit-ranges/limit-range-details.tsx
+++ b/src/renderer/components/+config-limit-ranges/limit-range-details.tsx
@@ -14,7 +14,7 @@ import { DrawerItem } from "../drawer/drawer-item";
 import { Badge } from "../badge";
 import logger from "../../../common/logger";
 
-interface Props extends KubeObjectDetailsProps<LimitRange> {
+export interface LimitRangeDetailsProps extends KubeObjectDetailsProps<LimitRange> {
 }
 
 function renderLimit(limit: LimitRangeItem, part: LimitPart, resource: Resource) {
@@ -52,7 +52,7 @@ function renderLimitDetails(limits: LimitRangeItem[], resources: Resource[]) {
 }
 
 @observer
-export class LimitRangeDetails extends React.Component<Props> {
+export class LimitRangeDetails extends React.Component<LimitRangeDetailsProps> {
   render() {
     const { object: limitRange } = this.props;
 
diff --git a/src/renderer/components/+config-limit-ranges/limit-ranges.tsx b/src/renderer/components/+config-limit-ranges/limit-ranges.tsx
index 814b63ecad..db5c98e0d5 100644
--- a/src/renderer/components/+config-limit-ranges/limit-ranges.tsx
+++ b/src/renderer/components/+config-limit-ranges/limit-ranges.tsx
@@ -19,11 +19,11 @@ enum columnId {
   age = "age",
 }
 
-interface Props extends RouteComponentProps<LimitRangeRouteParams> {
+export interface LimitRangesProps extends RouteComponentProps<LimitRangeRouteParams> {
 }
 
 @observer
-export class LimitRanges extends React.Component<Props> {
+export class LimitRanges extends React.Component<LimitRangesProps> {
   render() {
     return (
       <KubeObjectListLayout
diff --git a/src/renderer/components/+config-maps/config-map-details.tsx b/src/renderer/components/+config-maps/config-map-details.tsx
index bdf153ff0e..074003a5bf 100644
--- a/src/renderer/components/+config-maps/config-map-details.tsx
+++ b/src/renderer/components/+config-maps/config-map-details.tsx
@@ -18,15 +18,15 @@ import { ConfigMap } from "../../../common/k8s-api/endpoints";
 import { KubeObjectMeta } from "../kube-object-meta";
 import logger from "../../../common/logger";
 
-interface Props extends KubeObjectDetailsProps<ConfigMap> {
+export interface ConfigMapDetailsProps extends KubeObjectDetailsProps<ConfigMap> {
 }
 
 @observer
-export class ConfigMapDetails extends React.Component<Props> {
+export class ConfigMapDetails extends React.Component<ConfigMapDetailsProps> {
   @observable isSaving = false;
   @observable data = observable.map<string, string>();
 
-  constructor(props: Props) {
+  constructor(props: ConfigMapDetailsProps) {
     super(props);
     makeObservable(this);
   }
diff --git a/src/renderer/components/+config-maps/config-maps.tsx b/src/renderer/components/+config-maps/config-maps.tsx
index 8edbb6833b..7d206f33d7 100644
--- a/src/renderer/components/+config-maps/config-maps.tsx
+++ b/src/renderer/components/+config-maps/config-maps.tsx
@@ -20,11 +20,11 @@ enum columnId {
   age = "age",
 }
 
-interface Props extends RouteComponentProps<ConfigMapsRouteParams> {
+export interface ConfigMapsProps extends RouteComponentProps<ConfigMapsRouteParams> {
 }
 
 @observer
-export class ConfigMaps extends React.Component<Props> {
+export class ConfigMaps extends React.Component<ConfigMapsProps> {
   render() {
     return (
       <KubeObjectListLayout
diff --git a/src/renderer/components/+config-pod-disruption-budgets/pod-disruption-budgets-details.tsx b/src/renderer/components/+config-pod-disruption-budgets/pod-disruption-budgets-details.tsx
index eee9861ef2..c223d94b76 100644
--- a/src/renderer/components/+config-pod-disruption-budgets/pod-disruption-budgets-details.tsx
+++ b/src/renderer/components/+config-pod-disruption-budgets/pod-disruption-budgets-details.tsx
@@ -14,11 +14,11 @@ import { PodDisruptionBudget } from "../../../common/k8s-api/endpoints";
 import { KubeObjectMeta } from "../kube-object-meta";
 import logger from "../../../common/logger";
 
-interface Props extends KubeObjectDetailsProps<PodDisruptionBudget> {
+export interface PodDisruptionBudgetDetailsProps extends KubeObjectDetailsProps<PodDisruptionBudget> {
 }
 
 @observer
-export class PodDisruptionBudgetDetails extends React.Component<Props> {
+export class PodDisruptionBudgetDetails extends React.Component<PodDisruptionBudgetDetailsProps> {
 
   render() {
     const { object: pdb } = this.props;
diff --git a/src/renderer/components/+config-pod-disruption-budgets/pod-disruption-budgets.tsx b/src/renderer/components/+config-pod-disruption-budgets/pod-disruption-budgets.tsx
index 2cf09db7a1..5556f957a1 100644
--- a/src/renderer/components/+config-pod-disruption-budgets/pod-disruption-budgets.tsx
+++ b/src/renderer/components/+config-pod-disruption-budgets/pod-disruption-budgets.tsx
@@ -23,11 +23,11 @@ enum columnId {
   age = "age",
 }
 
-interface Props extends KubeObjectDetailsProps<PodDisruptionBudget> {
+export interface PodDisruptionBudgetsProps extends KubeObjectDetailsProps<PodDisruptionBudget> {
 }
 
 @observer
-export class PodDisruptionBudgets extends React.Component<Props> {
+export class PodDisruptionBudgets extends React.Component<PodDisruptionBudgetsProps> {
   render() {
     return (
       <KubeObjectListLayout
diff --git a/src/renderer/components/+config-resource-quotas/add-quota-dialog.tsx b/src/renderer/components/+config-resource-quotas/add-quota-dialog.tsx
index bac8d3858f..6746e28fef 100644
--- a/src/renderer/components/+config-resource-quotas/add-quota-dialog.tsx
+++ b/src/renderer/components/+config-resource-quotas/add-quota-dialog.tsx
@@ -20,7 +20,7 @@ import { Notifications } from "../notifications";
 import { NamespaceSelect } from "../+namespaces/namespace-select";
 import { SubTitle } from "../layout/sub-title";
 
-interface Props extends DialogProps {
+export interface AddQuotaDialogProps extends DialogProps {
 }
 
 const dialogState = observable.object({
@@ -28,7 +28,7 @@ const dialogState = observable.object({
 });
 
 @observer
-export class AddQuotaDialog extends React.Component<Props> {
+export class AddQuotaDialog extends React.Component<AddQuotaDialogProps> {
   static defaultQuotas: IResourceQuotaValues = {
     "limits.cpu": "",
     "limits.memory": "",
@@ -58,7 +58,7 @@ export class AddQuotaDialog extends React.Component<Props> {
   @observable namespace = this.defaultNamespace;
   @observable quotas = AddQuotaDialog.defaultQuotas;
 
-  constructor(props: Props) {
+  constructor(props: AddQuotaDialogProps) {
     super(props);
     makeObservable(this);
   }
diff --git a/src/renderer/components/+config-resource-quotas/resource-quota-details.tsx b/src/renderer/components/+config-resource-quotas/resource-quota-details.tsx
index 2e4c91b677..363ba75662 100644
--- a/src/renderer/components/+config-resource-quotas/resource-quota-details.tsx
+++ b/src/renderer/components/+config-resource-quotas/resource-quota-details.tsx
@@ -16,7 +16,7 @@ import { Table, TableCell, TableHead, TableRow } from "../table";
 import { KubeObjectMeta } from "../kube-object-meta";
 import logger from "../../../common/logger";
 
-interface Props extends KubeObjectDetailsProps<ResourceQuota> {
+export interface ResourceQuotaDetailsProps extends KubeObjectDetailsProps<ResourceQuota> {
 }
 
 function transformUnit(name: string, value: string): number {
@@ -58,7 +58,7 @@ function renderQuotas(quota: ResourceQuota): JSX.Element[] {
 }
 
 @observer
-export class ResourceQuotaDetails extends React.Component<Props> {
+export class ResourceQuotaDetails extends React.Component<ResourceQuotaDetailsProps> {
   render() {
     const { object: quota } = this.props;
 
diff --git a/src/renderer/components/+config-resource-quotas/resource-quotas.tsx b/src/renderer/components/+config-resource-quotas/resource-quotas.tsx
index de7ef7a818..823eb8ced9 100644
--- a/src/renderer/components/+config-resource-quotas/resource-quotas.tsx
+++ b/src/renderer/components/+config-resource-quotas/resource-quotas.tsx
@@ -20,11 +20,11 @@ enum columnId {
   age = "age",
 }
 
-interface Props extends RouteComponentProps<ResourceQuotaRouteParams> {
+export interface ResourceQuotasProps extends RouteComponentProps<ResourceQuotaRouteParams> {
 }
 
 @observer
-export class ResourceQuotas extends React.Component<Props> {
+export class ResourceQuotas extends React.Component<ResourceQuotasProps> {
   render() {
     return (
       <>
diff --git a/src/renderer/components/+config-secrets/add-secret-dialog.tsx b/src/renderer/components/+config-secrets/add-secret-dialog.tsx
index 56ed65013e..cebc953b49 100644
--- a/src/renderer/components/+config-secrets/add-secret-dialog.tsx
+++ b/src/renderer/components/+config-secrets/add-secret-dialog.tsx
@@ -23,7 +23,7 @@ import { Notifications } from "../notifications";
 import upperFirst from "lodash/upperFirst";
 import { showDetails } from "../kube-detail-params";
 
-interface Props extends Partial<DialogProps> {
+export interface AddSecretDialogProps extends Partial<DialogProps> {
 }
 
 interface ISecretTemplateField {
@@ -46,8 +46,8 @@ const dialogState = observable.object({
 });
 
 @observer
-export class AddSecretDialog extends React.Component<Props> {
-  constructor(props: Props) {
+export class AddSecretDialog extends React.Component<AddSecretDialogProps> {
+  constructor(props: AddSecretDialogProps) {
     super(props);
     makeObservable(this);
   }
diff --git a/src/renderer/components/+config-secrets/secret-details.tsx b/src/renderer/components/+config-secrets/secret-details.tsx
index bce3022450..adb1877799 100644
--- a/src/renderer/components/+config-secrets/secret-details.tsx
+++ b/src/renderer/components/+config-secrets/secret-details.tsx
@@ -20,16 +20,16 @@ import { Secret } from "../../../common/k8s-api/endpoints";
 import { KubeObjectMeta } from "../kube-object-meta";
 import logger from "../../../common/logger";
 
-interface Props extends KubeObjectDetailsProps<Secret> {
+export interface SecretDetailsProps extends KubeObjectDetailsProps<Secret> {
 }
 
 @observer
-export class SecretDetails extends React.Component<Props> {
+export class SecretDetails extends React.Component<SecretDetailsProps> {
   @observable isSaving = false;
   @observable data: { [name: string]: string } = {};
   @observable revealSecret = observable.set<string>();
 
-  constructor(props: Props) {
+  constructor(props: SecretDetailsProps) {
     super(props);
     makeObservable(this);
   }
diff --git a/src/renderer/components/+config-secrets/secrets.tsx b/src/renderer/components/+config-secrets/secrets.tsx
index 227a9b0f51..07b737450c 100644
--- a/src/renderer/components/+config-secrets/secrets.tsx
+++ b/src/renderer/components/+config-secrets/secrets.tsx
@@ -24,11 +24,11 @@ enum columnId {
   age = "age",
 }
 
-interface Props extends RouteComponentProps<SecretsRouteParams> {
+export interface SecretsProps extends RouteComponentProps<SecretsRouteParams> {
 }
 
 @observer
-export class Secrets extends React.Component<Props> {
+export class Secrets extends React.Component<SecretsProps> {
   render() {
     return (
       <>
diff --git a/src/renderer/components/+custom-resources/crd-details.tsx b/src/renderer/components/+custom-resources/crd-details.tsx
index 788178544d..20961de66c 100644
--- a/src/renderer/components/+custom-resources/crd-details.tsx
+++ b/src/renderer/components/+custom-resources/crd-details.tsx
@@ -18,11 +18,11 @@ import { KubeObjectMeta } from "../kube-object-meta";
 import { MonacoEditor } from "../monaco-editor";
 import logger from "../../../common/logger";
 
-interface Props extends KubeObjectDetailsProps<CustomResourceDefinition> {
+export interface CRDDetailsProps extends KubeObjectDetailsProps<CustomResourceDefinition> {
 }
 
 @observer
-export class CRDDetails extends React.Component<Props> {
+export class CRDDetails extends React.Component<CRDDetailsProps> {
   render() {
     const { object: crd } = this.props;
 
diff --git a/src/renderer/components/+custom-resources/crd-list.tsx b/src/renderer/components/+custom-resources/crd-list.tsx
index 1806b99926..a14b472d2f 100644
--- a/src/renderer/components/+custom-resources/crd-list.tsx
+++ b/src/renderer/components/+custom-resources/crd-list.tsx
@@ -32,7 +32,7 @@ enum columnId {
 }
 
 @observer
-export class CrdList extends React.Component {
+export class CustomResourceDefinitions extends React.Component {
   constructor(props: {}) {
     super(props);
     makeObservable(this);
diff --git a/src/renderer/components/+custom-resources/crd-resource-details.tsx b/src/renderer/components/+custom-resources/crd-resource-details.tsx
index 8d99b141e5..ba69b456b5 100644
--- a/src/renderer/components/+custom-resources/crd-resource-details.tsx
+++ b/src/renderer/components/+custom-resources/crd-resource-details.tsx
@@ -19,7 +19,7 @@ import { parseJsonPath } from "../../utils/jsonPath";
 import { KubeObject, KubeObjectMetadata, KubeObjectStatus } from "../../../common/k8s-api/kube-object";
 import logger from "../../../common/logger";
 
-interface Props extends KubeObjectDetailsProps<KubeObject> {
+export interface CustomResourceDetailsProps extends KubeObjectDetailsProps<KubeObject> {
   crd: CustomResourceDefinition;
 }
 
@@ -44,7 +44,7 @@ function convertSpecValue(value: any): any {
 }
 
 @observer
-export class CrdResourceDetails extends React.Component<Props> {
+export class CustomResourceDetails extends React.Component<CustomResourceDetailsProps> {
   renderAdditionalColumns(resource: KubeObject, columns: AdditionalPrinterColumnsV1[]) {
     return columns.map(({ name, jsonPath: jp }) => (
       <DrawerItem key={name} name={name} renderBoolean>
diff --git a/src/renderer/components/+custom-resources/crd-resources.tsx b/src/renderer/components/+custom-resources/crd-resources.tsx
index 37f537ffaf..8c029e92c1 100644
--- a/src/renderer/components/+custom-resources/crd-resources.tsx
+++ b/src/renderer/components/+custom-resources/crd-resources.tsx
@@ -18,7 +18,7 @@ import { apiManager } from "../../../common/k8s-api/api-manager";
 import { parseJsonPath } from "../../utils/jsonPath";
 import type { CRDRouteParams } from "../../../common/routes";
 
-interface Props extends RouteComponentProps<CRDRouteParams> {
+export interface CustomResourceDefinitionResourcesProps extends RouteComponentProps<CRDRouteParams> {
 }
 
 enum columnId {
@@ -28,8 +28,8 @@ enum columnId {
 }
 
 @observer
-export class CrdResources extends React.Component<Props> {
-  constructor(props: Props) {
+export class CustomResourceDefinitionResources extends React.Component<CustomResourceDefinitionResourcesProps> {
+  constructor(props: CustomResourceDefinitionResourcesProps) {
     super(props);
     makeObservable(this);
   }
diff --git a/src/renderer/components/+custom-resources/route.tsx b/src/renderer/components/+custom-resources/route.tsx
index e3be5ff164..805d6216d6 100644
--- a/src/renderer/components/+custom-resources/route.tsx
+++ b/src/renderer/components/+custom-resources/route.tsx
@@ -7,13 +7,14 @@ import React from "react";
 import { Redirect, Route, Switch } from "react-router";
 import { TabLayout } from "../layout/tab-layout";
 import { crdDefinitionsRoute, crdResourcesRoute, crdURL } from "../../../common/routes";
-import { CrdList, CrdResources } from ".";
+import { CustomResourceDefinitions } from "./crd-list";
+import { CustomResourceDefinitionResources } from "./crd-resources";
 
 export const CustomResourcesRoute = () => (
   <TabLayout>
     <Switch>
-      <Route component={CrdList} {...crdDefinitionsRoute} exact/>
-      <Route component={CrdResources} {...crdResourcesRoute}/>
+      <Route component={CustomResourceDefinitions} {...crdDefinitionsRoute} exact/>
+      <Route component={CustomResourceDefinitionResources} {...crdResourcesRoute}/>
       <Redirect to={crdURL()}/>
     </Switch>
   </TabLayout>
diff --git a/src/renderer/components/+entity-settings/entity-settings.tsx b/src/renderer/components/+entity-settings/entity-settings.tsx
index 6bfa97195f..9b9df16acf 100644
--- a/src/renderer/components/+entity-settings/entity-settings.tsx
+++ b/src/renderer/components/+entity-settings/entity-settings.tsx
@@ -20,14 +20,14 @@ import { SettingLayout } from "../layout/setting-layout";
 import logger from "../../../common/logger";
 import { Avatar } from "../avatar";
 
-interface Props extends RouteComponentProps<EntitySettingsRouteParams> {
+export interface EntitySettingsProps extends RouteComponentProps<EntitySettingsRouteParams> {
 }
 
 @observer
-export class EntitySettings extends React.Component<Props> {
+export class EntitySettings extends React.Component<EntitySettingsProps> {
   @observable activeTab: string;
 
-  constructor(props: Props) {
+  constructor(props: EntitySettingsProps) {
     super(props);
     makeObservable(this);
 
diff --git a/src/renderer/components/+events/event-details.tsx b/src/renderer/components/+events/event-details.tsx
index 9df0547a21..74e711f839 100644
--- a/src/renderer/components/+events/event-details.tsx
+++ b/src/renderer/components/+events/event-details.tsx
@@ -19,11 +19,11 @@ import { getDetailsUrl } from "../kube-detail-params";
 import { apiManager } from "../../../common/k8s-api/api-manager";
 import logger from "../../../common/logger";
 
-interface Props extends KubeObjectDetailsProps<KubeEvent> {
+export interface EventDetailsProps extends KubeObjectDetailsProps<KubeEvent> {
 }
 
 @observer
-export class EventDetails extends React.Component<Props> {
+export class EventDetails extends React.Component<EventDetailsProps> {
   render() {
     const { object: event } = this.props;
 
diff --git a/src/renderer/components/+events/events.tsx b/src/renderer/components/+events/events.tsx
index 033189ea7d..332007e4dd 100644
--- a/src/renderer/components/+events/events.tsx
+++ b/src/renderer/components/+events/events.tsx
@@ -34,18 +34,18 @@ enum columnId {
   lastSeen = "last-seen",
 }
 
-interface Props extends Partial<KubeObjectListLayoutProps<KubeEvent>> {
+export interface EventsProps extends Partial<KubeObjectListLayoutProps<KubeEvent>> {
   className?: IClassName;
   compact?: boolean;
   compactLimit?: number;
 }
 
-const defaultProps: Partial<Props> = {
+const defaultProps: Partial<EventsProps> = {
   compactLimit: 10,
 };
 
 @observer
-export class Events extends React.Component<Props> {
+export class Events extends React.Component<EventsProps> {
   static defaultProps = defaultProps as object;
   now = Date.now();
 
@@ -63,7 +63,7 @@ export class Events extends React.Component<Props> {
     [columnId.lastSeen]: event => this.now - new Date(event.lastTimestamp).getTime(),
   };
 
-  constructor(props: Props) {
+  constructor(props: EventsProps) {
     super(props);
     makeObservable(this);
   }
diff --git a/src/renderer/components/+events/kube-event-icon.tsx b/src/renderer/components/+events/kube-event-icon.tsx
index dc60b8f4f3..7b6f224847 100644
--- a/src/renderer/components/+events/kube-event-icon.tsx
+++ b/src/renderer/components/+events/kube-event-icon.tsx
@@ -12,17 +12,18 @@ import { eventStore } from "./event.store";
 import { cssNames } from "../../utils";
 import type { KubeEvent } from "../../../common/k8s-api/endpoints/events.api";
 
-interface Props {
+export interface KubeEventIconProps {
   object: KubeObject;
   showWarningsOnly?: boolean;
   filterEvents?: (events: KubeEvent[]) => KubeEvent[];
 }
 
-const defaultProps: Partial<Props> = {
+
+const defaultProps: Partial<KubeEventIconProps> = {
   showWarningsOnly: true,
 };
 
-export class KubeEventIcon extends React.Component<Props> {
+export class KubeEventIcon extends React.Component<KubeEventIconProps> {
   static defaultProps = defaultProps as object;
 
   render() {
diff --git a/src/renderer/components/+extensions/install.tsx b/src/renderer/components/+extensions/install.tsx
index b7325fec00..46ddb69835 100644
--- a/src/renderer/components/+extensions/install.tsx
+++ b/src/renderer/components/+extensions/install.tsx
@@ -17,7 +17,7 @@ import extensionInstallationStateStoreInjectable
   from "../../../extensions/extension-installation-state-store/extension-installation-state-store.injectable";
 import { withInjectables } from "@ogre-tools/injectable-react";
 
-interface Props {
+export interface InstallProps {
   installPath: string;
   supportedFormats: string[];
   onChange: (path: string) => void;
@@ -42,7 +42,7 @@ const installInputValidator: InputValidator = {
   ),
 };
 
-const NonInjectedInstall: React.FC<Dependencies & Props> = ({
+const NonInjectedInstall: React.FC<Dependencies & InstallProps> = ({
   installPath,
   supportedFormats,
   onChange,
@@ -99,7 +99,7 @@ const NonInjectedInstall: React.FC<Dependencies & Props> = ({
   </section>
 );
 
-export const Install = withInjectables<Dependencies, Props>(
+export const Install = withInjectables<Dependencies, InstallProps>(
   observer(NonInjectedInstall),
   {
     getProps: (di, props) => ({
diff --git a/src/renderer/components/+extensions/installed-extensions.tsx b/src/renderer/components/+extensions/installed-extensions.tsx
index 6780a0df3a..768253008b 100644
--- a/src/renderer/components/+extensions/installed-extensions.tsx
+++ b/src/renderer/components/+extensions/installed-extensions.tsx
@@ -25,7 +25,7 @@ import extensionInstallationStateStoreInjectable
   from "../../../extensions/extension-installation-state-store/extension-installation-state-store.injectable";
 import type { ExtensionInstallationStateStore } from "../../../extensions/extension-installation-state-store/extension-installation-state-store";
 
-interface Props {
+export interface InstalledExtensionsProps {
   extensions: InstalledExtension[];
   enable: (id: LensExtensionId) => void;
   disable: (id: LensExtensionId) => void;
@@ -45,7 +45,7 @@ function getStatus(extension: InstalledExtension) {
   return extension.isEnabled ? "Enabled" : "Disabled";
 }
 
-const NonInjectedInstalledExtensions : React.FC<Dependencies & Props> = (({ extensionDiscovery, extensionInstallationStateStore, extensions, uninstall, enable, disable }) => {
+const NonInjectedInstalledExtensions = observer(({ extensionDiscovery, extensionInstallationStateStore, extensions, uninstall, enable, disable }: Dependencies & InstalledExtensionsProps) => {
   const filters = [
     (extension: InstalledExtension) => extension.manifest.name,
     (extension: InstalledExtension) => getStatus(extension),
@@ -175,15 +175,10 @@ const NonInjectedInstalledExtensions : React.FC<Dependencies & Props> = (({ exte
   );
 });
 
-export const InstalledExtensions = withInjectables<Dependencies, Props>(
-  observer(NonInjectedInstalledExtensions),
-
-  {
-    getProps: (di, props) => ({
-      extensionDiscovery: di.inject(extensionDiscoveryInjectable),
-      extensionInstallationStateStore: di.inject(extensionInstallationStateStoreInjectable),
-
-      ...props,
-    }),
-  },
-);
+export const InstalledExtensions = withInjectables<Dependencies, InstalledExtensionsProps>(NonInjectedInstalledExtensions, {
+  getProps: (di, props) => ({
+    extensionDiscovery: di.inject(extensionDiscoveryInjectable),
+    extensionInstallationStateStore: di.inject(extensionInstallationStateStoreInjectable),
+    ...props,
+  }),
+});
diff --git a/src/renderer/components/+extensions/notice.tsx b/src/renderer/components/+extensions/notice.tsx
index 6f8fcd7efe..31a6170fd7 100644
--- a/src/renderer/components/+extensions/notice.tsx
+++ b/src/renderer/components/+extensions/notice.tsx
@@ -7,11 +7,11 @@ import styles from "./notice.module.scss";
 import React, { DOMAttributes } from "react";
 import { cssNames } from "../../utils";
 
-interface Props extends DOMAttributes<any> {
+export interface NoticeProps extends DOMAttributes<any> {
   className?: string;
 }
 
-export function Notice(props: Props) {
+export function Notice(props: NoticeProps) {
   return (
     <div className={cssNames(styles.notice, props.className)}>
       {props.children}
diff --git a/src/renderer/components/+helm-charts/helm-chart-details.tsx b/src/renderer/components/+helm-charts/helm-chart-details.tsx
index 6b89b4579c..e5048d64fa 100644
--- a/src/renderer/components/+helm-charts/helm-chart-details.tsx
+++ b/src/renderer/components/+helm-charts/helm-chart-details.tsx
@@ -21,7 +21,7 @@ import { withInjectables } from "@ogre-tools/injectable-react";
 import createInstallChartTabInjectable from "../dock/install-chart/create-install-chart-tab.injectable";
 import { Notifications } from "../notifications";
 
-interface Props {
+export interface HelmChartDetailsProps {
   chart: HelmChart;
   hideDetails(): void;
 }
@@ -37,14 +37,14 @@ interface Dependencies {
 }
 
 @observer
-class NonInjectedHelmChartDetails extends Component<Props & Dependencies> {
+class NonInjectedHelmChartDetails extends Component<HelmChartDetailsProps & Dependencies> {
   @observable chartVersions: HelmChart[];
   @observable selectedChart?: HelmChart;
   @observable readme?: string;
 
   private abortController?: AbortController;
 
-  constructor(props: Props & Dependencies) {
+  constructor(props: HelmChartDetailsProps & Dependencies) {
     super(props);
     makeObservable(this);
   }
@@ -197,7 +197,7 @@ class NonInjectedHelmChartDetails extends Component<Props & Dependencies> {
   }
 }
 
-export const HelmChartDetails = withInjectables<Dependencies, Props>(
+export const HelmChartDetails = withInjectables<Dependencies, HelmChartDetailsProps>(
   NonInjectedHelmChartDetails,
 
   {
diff --git a/src/renderer/components/+helm-charts/helm-charts.tsx b/src/renderer/components/+helm-charts/helm-charts.tsx
index 0665416323..9cf8c81482 100644
--- a/src/renderer/components/+helm-charts/helm-charts.tsx
+++ b/src/renderer/components/+helm-charts/helm-charts.tsx
@@ -24,11 +24,11 @@ enum columnId {
   repo = "repo",
 }
 
-interface Props extends RouteComponentProps<HelmChartsRouteParams> {
+export interface HelmChartsProps extends RouteComponentProps<HelmChartsRouteParams> {
 }
 
 @observer
-export class HelmCharts extends Component<Props> {
+export class HelmCharts extends Component<HelmChartsProps> {
   componentDidMount() {
     helmChartStore.loadAll();
   }
diff --git a/src/renderer/components/+helm-releases/release-details/release-details.tsx b/src/renderer/components/+helm-releases/release-details/release-details.tsx
index 143f9d843c..6a2a71a8fd 100644
--- a/src/renderer/components/+helm-releases/release-details/release-details.tsx
+++ b/src/renderer/components/+helm-releases/release-details/release-details.tsx
@@ -34,7 +34,7 @@ import releaseDetailsInjectable from "./release-details.injectable";
 import releaseValuesInjectable from "./release-values.injectable";
 import userSuppliedValuesAreShownInjectable from "./user-supplied-values-are-shown.injectable";
 
-interface Props {
+export interface ReleaseDetailsProps {
   hideDetails(): void;
 }
 
@@ -48,12 +48,12 @@ interface Dependencies {
 }
 
 @observer
-class NonInjectedReleaseDetails extends Component<Props & Dependencies> {
+class NonInjectedReleaseDetails extends Component<ReleaseDetailsProps & Dependencies> {
   @observable saving = false;
 
   private nonSavedValues: string;
 
-  constructor(props: Props & Dependencies) {
+  constructor(props: ReleaseDetailsProps & Dependencies) {
     super(props);
     makeObservable(this);
   }
@@ -261,7 +261,7 @@ class NonInjectedReleaseDetails extends Component<Props & Dependencies> {
   }
 }
 
-export const ReleaseDetails = withInjectables<Dependencies, Props>(
+export const ReleaseDetails = withInjectables<Dependencies, ReleaseDetailsProps>(
   NonInjectedReleaseDetails,
 
   {
diff --git a/src/renderer/components/+helm-releases/release-menu.tsx b/src/renderer/components/+helm-releases/release-menu.tsx
index 679dc897fc..5852a8384e 100644
--- a/src/renderer/components/+helm-releases/release-menu.tsx
+++ b/src/renderer/components/+helm-releases/release-menu.tsx
@@ -14,7 +14,7 @@ import createUpgradeChartTabInjectable from "../dock/upgrade-chart/create-upgrad
 import releaseRollbackDialogModelInjectable from "./release-rollback-dialog-model/release-rollback-dialog-model.injectable";
 import deleteReleaseInjectable from "./delete-release/delete-release.injectable";
 
-interface Props extends MenuActionsProps {
+export interface HelmReleaseMenuProps extends MenuActionsProps {
   release: HelmRelease;
   hideDetails?(): void;
 }
@@ -25,7 +25,7 @@ interface Dependencies {
   openRollbackDialog: (release: HelmRelease) => void;
 }
 
-class NonInjectedHelmReleaseMenu extends React.Component<Props & Dependencies> {
+class NonInjectedHelmReleaseMenu extends React.Component<HelmReleaseMenuProps & Dependencies> {
   remove = () => {
     return this.props.deleteRelease(this.props.release);
   };
@@ -79,7 +79,7 @@ class NonInjectedHelmReleaseMenu extends React.Component<Props & Dependencies> {
   }
 }
 
-export const HelmReleaseMenu = withInjectables<Dependencies, Props>(
+export const HelmReleaseMenu = withInjectables<Dependencies, HelmReleaseMenuProps>(
   NonInjectedHelmReleaseMenu,
 
   {
diff --git a/src/renderer/components/+helm-releases/release-rollback-dialog.tsx b/src/renderer/components/+helm-releases/release-rollback-dialog.tsx
index 39d32d7f5d..2698393ed6 100644
--- a/src/renderer/components/+helm-releases/release-rollback-dialog.tsx
+++ b/src/renderer/components/+helm-releases/release-rollback-dialog.tsx
@@ -20,7 +20,7 @@ import releaseRollbackDialogModelInjectable
 import type { ReleaseRollbackDialogModel } from "./release-rollback-dialog-model/release-rollback-dialog-model";
 import rollbackReleaseInjectable from "./rollback-release/rollback-release.injectable";
 
-interface Props extends DialogProps {
+export interface ReleaseRollbackDialogProps extends DialogProps {
 }
 
 interface Dependencies {
@@ -29,12 +29,12 @@ interface Dependencies {
 }
 
 @observer
-class NonInjectedReleaseRollbackDialog extends React.Component<Props & Dependencies> {
+class NonInjectedReleaseRollbackDialog extends React.Component<ReleaseRollbackDialogProps & Dependencies> {
   @observable isLoading = false;
   @observable revision: IReleaseRevision;
   @observable revisions = observable.array<IReleaseRevision>();
 
-  constructor(props: Props & Dependencies) {
+  constructor(props: ReleaseRollbackDialogProps & Dependencies) {
     super(props);
     makeObservable(this);
   }
@@ -114,7 +114,7 @@ class NonInjectedReleaseRollbackDialog extends React.Component<Props & Dependenc
   }
 }
 
-export const ReleaseRollbackDialog = withInjectables<Dependencies, Props>(
+export const ReleaseRollbackDialog = withInjectables<Dependencies, ReleaseRollbackDialogProps>(
   NonInjectedReleaseRollbackDialog,
 
   {
diff --git a/src/renderer/components/+helm-releases/releases.tsx b/src/renderer/components/+helm-releases/releases.tsx
index 1a10303df0..2e5d9b862a 100644
--- a/src/renderer/components/+helm-releases/releases.tsx
+++ b/src/renderer/components/+helm-releases/releases.tsx
@@ -37,7 +37,7 @@ enum columnId {
   updated = "update",
 }
 
-interface Props extends RouteComponentProps<ReleaseRouteParams> {
+export interface HelmReleasesProps extends RouteComponentProps<ReleaseRouteParams> {
 }
 
 interface Dependencies {
@@ -46,7 +46,7 @@ interface Dependencies {
   selectNamespace: (namespace: string) => void;
 }
 
-class NonInjectedHelmReleases extends Component<Dependencies & Props> {
+class NonInjectedHelmReleases extends Component<Dependencies & HelmReleasesProps> {
   componentDidMount() {
     const { match: { params: { namespace }}} = this.props;
 
@@ -223,7 +223,7 @@ class NonInjectedHelmReleases extends Component<Dependencies & Props> {
   }
 }
 
-export const HelmReleases = withInjectables<Dependencies, Props>(
+export const HelmReleases = withInjectables<Dependencies, HelmReleasesProps>(
   NonInjectedHelmReleases,
 
   {
diff --git a/src/renderer/components/+namespaces/add-namespace-dialog.tsx b/src/renderer/components/+namespaces/add-namespace-dialog.tsx
index 406d4eec7a..ef82f9ca81 100644
--- a/src/renderer/components/+namespaces/add-namespace-dialog.tsx
+++ b/src/renderer/components/+namespaces/add-namespace-dialog.tsx
@@ -21,7 +21,7 @@ import addNamespaceDialogModelInjectable
   from "./add-namespace-dialog-model/add-namespace-dialog-model.injectable";
 import type { NamespaceStore } from "./namespace-store/namespace.store";
 
-interface Props extends DialogProps {
+export interface AddNamespaceDialogProps extends DialogProps {
   onSuccess?(ns: Namespace): void;
   onError?(error: any): void;
 }
@@ -32,10 +32,10 @@ interface Dependencies {
 }
 
 @observer
-class NonInjectedAddNamespaceDialog extends React.Component<Props & Dependencies> {
+class NonInjectedAddNamespaceDialog extends React.Component<AddNamespaceDialogProps & Dependencies> {
   @observable namespace = "";
 
-  constructor(props: Props & Dependencies) {
+  constructor(props: AddNamespaceDialogProps & Dependencies) {
     super(props);
     makeObservable(this);
   }
@@ -93,7 +93,7 @@ class NonInjectedAddNamespaceDialog extends React.Component<Props & Dependencies
   }
 }
 
-export const AddNamespaceDialog = withInjectables<Dependencies, Props>(
+export const AddNamespaceDialog = withInjectables<Dependencies, AddNamespaceDialogProps>(
   NonInjectedAddNamespaceDialog,
 
   {
diff --git a/src/renderer/components/+namespaces/namespace-details.tsx b/src/renderer/components/+namespaces/namespace-details.tsx
index a2b0f12df8..9d0ce85b4f 100644
--- a/src/renderer/components/+namespaces/namespace-details.tsx
+++ b/src/renderer/components/+namespaces/namespace-details.tsx
@@ -29,7 +29,7 @@ import { withInjectables } from "@ogre-tools/injectable-react";
 import kubeWatchApiInjectable
   from "../../kube-watch-api/kube-watch-api.injectable";
 
-interface Props extends KubeObjectDetailsProps<Namespace> {
+export interface NamespaceDetailsProps extends KubeObjectDetailsProps<Namespace> {
 }
 
 interface Dependencies {
@@ -37,10 +37,10 @@ interface Dependencies {
 }
 
 @observer
-class NonInjectedNamespaceDetails extends React.Component<Props & Dependencies> {
+class NonInjectedNamespaceDetails extends React.Component<NamespaceDetailsProps & Dependencies> {
   @observable metrics: IPodMetrics = null;
 
-  constructor(props: Props & Dependencies) {
+  constructor(props: NamespaceDetailsProps & Dependencies) {
     super(props);
     makeObservable(this);
   }
@@ -132,7 +132,7 @@ class NonInjectedNamespaceDetails extends React.Component<Props & Dependencies>
   }
 }
 
-export const NamespaceDetails = withInjectables<Dependencies, Props>(
+export const NamespaceDetails = withInjectables<Dependencies, NamespaceDetailsProps>(
   NonInjectedNamespaceDetails,
 
   {
diff --git a/src/renderer/components/+namespaces/namespace-select-filter.tsx b/src/renderer/components/+namespaces/namespace-select-filter.tsx
index 2968ad7f2e..9a216a8f9f 100644
--- a/src/renderer/components/+namespaces/namespace-select-filter.tsx
+++ b/src/renderer/components/+namespaces/namespace-select-filter.tsx
@@ -7,7 +7,7 @@ import "./namespace-select-filter.scss";
 
 import React from "react";
 import { observer } from "mobx-react";
-import { components, PlaceholderProps } from "react-select";
+import { components, OptionTypeBase, PlaceholderProps } from "react-select";
 
 import { Icon } from "../icon";
 import { NamespaceSelect } from "./namespace-select";
@@ -23,38 +23,33 @@ interface Dependencies {
   model: NamespaceSelectFilterModel;
 }
 
-class NonInjectedNamespaceSelectFilter extends React.Component<
-  SelectProps & Dependencies
-> {
-  render() {
-    return (
-      <div
-        onKeyUp={this.props.model.onKeyUp}
-        onKeyDown={this.props.model.onKeyDown}
-        onClick={this.props.model.onClick}
-      >
-        <NamespaceSelect
-          isMulti={true}
-          menuIsOpen={this.props.model.menuIsOpen}
-          components={{ Placeholder }}
-          showAllNamespacesOption={true}
-          closeMenuOnSelect={false}
-          controlShouldRenderValue={false}
-          placeholder={""}
-          onChange={this.props.model.onChange}
-          onBlur={this.props.model.reset}
-          formatOptionLabel={formatOptionLabelFor(this.props.model)}
-          className="NamespaceSelectFilter"
-          menuClass="NamespaceSelectFilterMenu"
-          sort={(left, right) =>
-            +this.props.model.selectedNames.has(right.value) -
-            +this.props.model.selectedNames.has(left.value)
-          }
-        />
-      </div>
-    );
-  }
-}
+const NonInjectedNamespaceSelectFilter = observer(({ model }: SelectProps & Dependencies) => (
+  <div
+    onKeyUp={model.onKeyUp}
+    onKeyDown={model.onKeyDown}
+    onClick={model.onClick}
+  >
+    <NamespaceSelect
+      isMulti={true}
+      menuIsOpen={model.menuIsOpen}
+      components={{ Placeholder }}
+      showAllNamespacesOption={true}
+      closeMenuOnSelect={false}
+      controlShouldRenderValue={false}
+      placeholder={""}
+      onChange={model.onChange}
+      onBlur={model.reset}
+      formatOptionLabel={formatOptionLabelFor(model)}
+      className="NamespaceSelectFilter"
+      menuClass="NamespaceSelectFilterMenu"
+      sort={(left, right) =>
+        +model.selectedNames.has(right.value)
+        - +model.selectedNames.has(left.value)
+      }
+    />
+  </div>
+));
+
 
 const formatOptionLabelFor =
   (model: NamespaceSelectFilterModel) =>
@@ -74,54 +69,45 @@ const formatOptionLabelFor =
       return label;
     };
 
-export const NamespaceSelectFilter = withInjectables<Dependencies, SelectProps>(
-  observer(NonInjectedNamespaceSelectFilter),
+export const NamespaceSelectFilter = withInjectables<Dependencies, SelectProps>(NonInjectedNamespaceSelectFilter, {
+  getProps: (di, props) => ({
+    model: di.inject(namespaceSelectFilterModelInjectable),
+    ...props,
+  }),
+});
 
-  {
-    getProps: (di, props) => ({
-      model: di.inject(namespaceSelectFilterModelInjectable),
-      ...props,
-    }),
-  },
-);
-
-type CustomPlaceholderProps = PlaceholderProps<any, boolean>;
+export interface CustomPlaceholderProps extends PlaceholderProps<OptionTypeBase, boolean> {}
 
 interface PlaceholderDependencies {
   namespaceStore: NamespaceStore;
 }
 
-const NonInjectedPlaceholder = observer(
-  ({ namespaceStore, ...props }: CustomPlaceholderProps & PlaceholderDependencies) => {
-    const getPlaceholder = (): React.ReactNode => {
-      const namespaces = namespaceStore.contextNamespaces;
+const NonInjectedPlaceholder = observer(({ namespaceStore, ...props }: CustomPlaceholderProps & PlaceholderDependencies) => {
+  const getPlaceholder = () => {
+    const namespaces = namespaceStore.contextNamespaces;
 
-      if (namespaceStore.areAllSelectedImplicitly || !namespaces.length) {
-        return <>All namespaces</>;
-      }
+    if (namespaceStore.areAllSelectedImplicitly || namespaces.length === 0) {
+      return "All namespaces";
+    }
 
-      if (namespaces.length === 1) {
-        return <>Namespace: {namespaces[0]}</>;
-      }
+    const prefix = namespaces.length === 1
+      ? "Namespace"
+      : "Namespaces";
 
-      return <>Namespaces: {namespaces.join(", ")}</>;
-    };
+    return `${prefix}: ${namespaces.join(", ")}`;
+  };
 
-    return (
-      <components.Placeholder {...props}>
-        {getPlaceholder()}
-      </components.Placeholder>
-    );
-  },
+  return (
+    <components.Placeholder {...props}>
+      {getPlaceholder()}
+    </components.Placeholder>
+  );
+},
 );
 
-const Placeholder = withInjectables<PlaceholderDependencies, CustomPlaceholderProps>(
-  NonInjectedPlaceholder,
-
-  {
-    getProps: (di, props) => ({
-      namespaceStore: di.inject(namespaceStoreInjectable),
-      ...props,
-    }),
-  },
-);
+const Placeholder = withInjectables<PlaceholderDependencies, CustomPlaceholderProps>( NonInjectedPlaceholder, {
+  getProps: (di, props) => ({
+    namespaceStore: di.inject(namespaceStoreInjectable),
+    ...props,
+  }),
+});
diff --git a/src/renderer/components/+namespaces/namespace-select.tsx b/src/renderer/components/+namespaces/namespace-select.tsx
index 885ddba8c0..dc51cbf0b9 100644
--- a/src/renderer/components/+namespaces/namespace-select.tsx
+++ b/src/renderer/components/+namespaces/namespace-select.tsx
@@ -15,14 +15,14 @@ import type { NamespaceStore } from "./namespace-store/namespace.store";
 import { withInjectables } from "@ogre-tools/injectable-react";
 import namespaceStoreInjectable from "./namespace-store/namespace-store.injectable";
 
-interface Props extends SelectProps {
+export interface NamespaceSelectProps extends SelectProps {
   showIcons?: boolean;
   sort?: (a: SelectOption<string>, b: SelectOption<string>) => number;
   showAllNamespacesOption?: boolean; // show "All namespaces" option on the top (default: false)
   customizeOptions?(options: SelectOption[]): SelectOption[];
 }
 
-const defaultProps: Partial<Props> = {
+const defaultProps: Partial<NamespaceSelectProps> = {
   showIcons: true,
 };
 
@@ -31,10 +31,10 @@ interface Dependencies {
 }
 
 @observer
-class NonInjectedNamespaceSelect extends React.Component<Props & Dependencies> {
+class NonInjectedNamespaceSelect extends React.Component<NamespaceSelectProps & Dependencies> {
   static defaultProps = defaultProps as object;
 
-  constructor(props: Props & Dependencies) {
+  constructor(props: NamespaceSelectProps & Dependencies) {
     super(props);
     makeObservable(this);
   }
@@ -88,7 +88,7 @@ class NonInjectedNamespaceSelect extends React.Component<Props & Dependencies> {
   }
 }
 
-export const NamespaceSelect = withInjectables<Dependencies, Props>(
+export const NamespaceSelect = withInjectables<Dependencies, NamespaceSelectProps>(
   NonInjectedNamespaceSelect,
 
   {
diff --git a/src/renderer/components/+network-endpoints/endpoint-details.tsx b/src/renderer/components/+network-endpoints/endpoint-details.tsx
index 797ce59a91..5de9fdfe18 100644
--- a/src/renderer/components/+network-endpoints/endpoint-details.tsx
+++ b/src/renderer/components/+network-endpoints/endpoint-details.tsx
@@ -14,11 +14,11 @@ import { KubeObjectMeta } from "../kube-object-meta";
 import { EndpointSubsetList } from "./endpoint-subset-list";
 import logger from "../../../common/logger";
 
-interface Props extends KubeObjectDetailsProps<Endpoint> {
+export interface EndpointDetailsProps extends KubeObjectDetailsProps<Endpoint> {
 }
 
 @observer
-export class EndpointDetails extends React.Component<Props> {
+export class EndpointDetails extends React.Component<EndpointDetailsProps> {
   render() {
     const { object: endpoint } = this.props;
 
diff --git a/src/renderer/components/+network-endpoints/endpoint-subset-list.tsx b/src/renderer/components/+network-endpoints/endpoint-subset-list.tsx
index 53c0a98b37..38b9dedb1e 100644
--- a/src/renderer/components/+network-endpoints/endpoint-subset-list.tsx
+++ b/src/renderer/components/+network-endpoints/endpoint-subset-list.tsx
@@ -14,13 +14,13 @@ import { apiManager } from "../../../common/k8s-api/api-manager";
 import { Link } from "react-router-dom";
 import { getDetailsUrl } from "../kube-detail-params";
 
-interface Props {
+export interface EndpointSubsetListProps {
   subset: EndpointSubset;
   endpoint: Endpoint;
 }
 
 @observer
-export class EndpointSubsetList extends React.Component<Props> {
+export class EndpointSubsetList extends React.Component<EndpointSubsetListProps> {
 
   getAddressTableRow(ip: string) {
     const { subset } = this.props;
diff --git a/src/renderer/components/+network-endpoints/endpoints.tsx b/src/renderer/components/+network-endpoints/endpoints.tsx
index 0af44470c8..f5d5b31911 100644
--- a/src/renderer/components/+network-endpoints/endpoints.tsx
+++ b/src/renderer/components/+network-endpoints/endpoints.tsx
@@ -20,11 +20,11 @@ enum columnId {
   age = "age",
 }
 
-interface Props extends RouteComponentProps<EndpointRouteParams> {
+export interface EndpointsProps extends RouteComponentProps<EndpointRouteParams> {
 }
 
 @observer
-export class Endpoints extends React.Component<Props> {
+export class Endpoints extends React.Component<EndpointsProps> {
   render() {
     return (
       <KubeObjectListLayout
diff --git a/src/renderer/components/+network-ingresses/ingress-details.tsx b/src/renderer/components/+network-ingresses/ingress-details.tsx
index a29cf09571..5254b2c663 100644
--- a/src/renderer/components/+network-ingresses/ingress-details.tsx
+++ b/src/renderer/components/+network-ingresses/ingress-details.tsx
@@ -21,14 +21,14 @@ import { ClusterMetricsResourceType } from "../../../common/cluster-types";
 import { boundMethod } from "../../utils";
 import logger from "../../../common/logger";
 
-interface Props extends KubeObjectDetailsProps<Ingress> {
+export interface IngressDetailsProps extends KubeObjectDetailsProps<Ingress> {
 }
 
 @observer
-export class IngressDetails extends React.Component<Props> {
+export class IngressDetails extends React.Component<IngressDetailsProps> {
   @observable metrics: IIngressMetrics = null;
 
-  constructor(props: Props) {
+  constructor(props: IngressDetailsProps) {
     super(props);
     makeObservable(this);
   }
diff --git a/src/renderer/components/+network-ingresses/ingresses.tsx b/src/renderer/components/+network-ingresses/ingresses.tsx
index c6b41d920d..21aa2ca207 100644
--- a/src/renderer/components/+network-ingresses/ingresses.tsx
+++ b/src/renderer/components/+network-ingresses/ingresses.tsx
@@ -21,11 +21,11 @@ enum columnId {
   age = "age",
 }
 
-interface Props extends RouteComponentProps<IngressRouteParams> {
+export interface IngressesProps extends RouteComponentProps<IngressRouteParams> {
 }
 
 @observer
-export class Ingresses extends React.Component<Props> {
+export class Ingresses extends React.Component<IngressesProps> {
   render() {
     return (
       <KubeObjectListLayout
diff --git a/src/renderer/components/+network-policies/network-policies.tsx b/src/renderer/components/+network-policies/network-policies.tsx
index 79f012452f..db3701ae45 100644
--- a/src/renderer/components/+network-policies/network-policies.tsx
+++ b/src/renderer/components/+network-policies/network-policies.tsx
@@ -20,11 +20,11 @@ enum columnId {
   age = "age",
 }
 
-interface Props extends RouteComponentProps<NetworkPoliciesRouteParams> {
+export interface NetworkPoliciesProps extends RouteComponentProps<NetworkPoliciesRouteParams> {
 }
 
 @observer
-export class NetworkPolicies extends React.Component<Props> {
+export class NetworkPolicies extends React.Component<NetworkPoliciesProps> {
   render() {
     return (
       <KubeObjectListLayout
diff --git a/src/renderer/components/+network-policies/network-policy-details.tsx b/src/renderer/components/+network-policies/network-policy-details.tsx
index d343707557..cc73a7ae1b 100644
--- a/src/renderer/components/+network-policies/network-policy-details.tsx
+++ b/src/renderer/components/+network-policies/network-policy-details.tsx
@@ -17,11 +17,11 @@ import logger from "../../../common/logger";
 import type { LabelMatchExpression, LabelSelector } from "../../../common/k8s-api/kube-object";
 import { isEmpty } from "lodash";
 
-interface Props extends KubeObjectDetailsProps<NetworkPolicy> {
+export interface NetworkPolicyDetailsProps extends KubeObjectDetailsProps<NetworkPolicy> {
 }
 
 @observer
-export class NetworkPolicyDetails extends React.Component<Props> {
+export class NetworkPolicyDetails extends React.Component<NetworkPolicyDetailsProps> {
   renderIPolicyIpBlock(ipBlock: IPolicyIpBlock | undefined) {
     if (!ipBlock) {
       return null;
diff --git a/src/renderer/components/+network-port-forwards/port-forward-details.tsx b/src/renderer/components/+network-port-forwards/port-forward-details.tsx
index cd69a04bce..b3eebff181 100644
--- a/src/renderer/components/+network-port-forwards/port-forward-details.tsx
+++ b/src/renderer/components/+network-port-forwards/port-forward-details.tsx
@@ -14,12 +14,12 @@ import { podsApi, serviceApi } from "../../../common/k8s-api/endpoints";
 import { getDetailsUrl } from "../kube-detail-params";
 import { PortForwardMenu } from "./port-forward-menu";
 
-interface Props {
+export interface PortForwardDetailsProps {
   portForward: PortForwardItem;
   hideDetails(): void;
 }
 
-export class PortForwardDetails extends React.Component<Props> {
+export class PortForwardDetails extends React.Component<PortForwardDetailsProps> {
 
   renderResourceName() {
     const { portForward } = this.props;
diff --git a/src/renderer/components/+network-port-forwards/port-forward-menu.tsx b/src/renderer/components/+network-port-forwards/port-forward-menu.tsx
index 691ba63cda..b1d1264db3 100644
--- a/src/renderer/components/+network-port-forwards/port-forward-menu.tsx
+++ b/src/renderer/components/+network-port-forwards/port-forward-menu.tsx
@@ -14,7 +14,7 @@ import { withInjectables } from "@ogre-tools/injectable-react";
 import portForwardDialogModelInjectable from "../../port-forward/port-forward-dialog-model/port-forward-dialog-model.injectable";
 import portForwardStoreInjectable from "../../port-forward/port-forward-store/port-forward-store.injectable";
 
-interface Props extends MenuActionsProps {
+export interface PortForwardMenuProps extends MenuActionsProps {
   portForward: PortForwardItem;
   hideDetails?(): void;
 }
@@ -24,7 +24,7 @@ interface Dependencies {
   openPortForwardDialog: (item: PortForwardItem) => void;
 }
 
-class NonInjectedPortForwardMenu extends React.Component<Props & Dependencies> {
+class NonInjectedPortForwardMenu extends React.Component<PortForwardMenuProps & Dependencies> {
   @boundMethod
   remove() {
     const { portForward } = this.props;
@@ -109,7 +109,7 @@ class NonInjectedPortForwardMenu extends React.Component<Props & Dependencies> {
   }
 }
 
-export const PortForwardMenu = withInjectables<Dependencies, Props>(
+export const PortForwardMenu = withInjectables<Dependencies, PortForwardMenuProps>(
   NonInjectedPortForwardMenu,
 
   {
diff --git a/src/renderer/components/+network-port-forwards/port-forwards.tsx b/src/renderer/components/+network-port-forwards/port-forwards.tsx
index 082c0cc89f..1a079cd598 100644
--- a/src/renderer/components/+network-port-forwards/port-forwards.tsx
+++ b/src/renderer/components/+network-port-forwards/port-forwards.tsx
@@ -27,7 +27,7 @@ enum columnId {
   status = "status",
 }
 
-interface Props extends RouteComponentProps<PortForwardsRouteParams> {
+export interface PortForwardsProps extends RouteComponentProps<PortForwardsRouteParams> {
 }
 
 interface Dependencies {
@@ -35,7 +35,7 @@ interface Dependencies {
 }
 
 @observer
-class NonInjectedPortForwards extends React.Component<Props & Dependencies> {
+class NonInjectedPortForwards extends React.Component<PortForwardsProps & Dependencies> {
 
   componentDidMount() {
     disposeOnUnmount(this, [
@@ -143,7 +143,7 @@ class NonInjectedPortForwards extends React.Component<Props & Dependencies> {
   }
 }
 
-export const PortForwards = withInjectables<Dependencies, Props>(
+export const PortForwards = withInjectables<Dependencies, PortForwardsProps>(
   NonInjectedPortForwards,
 
   {
diff --git a/src/renderer/components/+network-services/service-details-endpoint.tsx b/src/renderer/components/+network-services/service-details-endpoint.tsx
index 0943427aad..936bec2302 100644
--- a/src/renderer/components/+network-services/service-details-endpoint.tsx
+++ b/src/renderer/components/+network-services/service-details-endpoint.tsx
@@ -12,12 +12,12 @@ import { endpointStore } from "../+network-endpoints/endpoints.store";
 import { Spinner } from "../spinner";
 import { showDetails } from "../kube-detail-params";
 
-interface Props {
+export interface ServiceDetailsEndpointProps {
   endpoint: KubeObject;
 }
 
 @observer
-export class ServiceDetailsEndpoint extends React.Component<Props> {
+export class ServiceDetailsEndpoint extends React.Component<ServiceDetailsEndpointProps> {
   render() {
     const { endpoint } = this.props;
 
diff --git a/src/renderer/components/+network-services/service-details.tsx b/src/renderer/components/+network-services/service-details.tsx
index 1f7fe41c0d..833fd7b59d 100644
--- a/src/renderer/components/+network-services/service-details.tsx
+++ b/src/renderer/components/+network-services/service-details.tsx
@@ -26,7 +26,7 @@ import kubeWatchApiInjectable
 import portForwardStoreInjectable from "../../port-forward/port-forward-store/port-forward-store.injectable";
 import type { KubeWatchSubscribeStoreOptions } from "../../kube-watch-api/kube-watch-api";
 
-interface Props extends KubeObjectDetailsProps<Service> {
+export interface ServiceDetailsProps extends KubeObjectDetailsProps<Service> {
 }
 
 interface Dependencies {
@@ -35,7 +35,7 @@ interface Dependencies {
 }
 
 @observer
-class NonInjectedServiceDetails extends React.Component<Props & Dependencies> {
+class NonInjectedServiceDetails extends React.Component<ServiceDetailsProps & Dependencies> {
   componentDidMount() {
     const { object: service } = this.props;
 
@@ -137,7 +137,7 @@ class NonInjectedServiceDetails extends React.Component<Props & Dependencies> {
   }
 }
 
-export const ServiceDetails = withInjectables<Dependencies, Props>(
+export const ServiceDetails = withInjectables<Dependencies, ServiceDetailsProps>(
   NonInjectedServiceDetails,
 
   {
diff --git a/src/renderer/components/+network-services/service-port-component.tsx b/src/renderer/components/+network-services/service-port-component.tsx
index 098b233e9c..39baf0da09 100644
--- a/src/renderer/components/+network-services/service-port-component.tsx
+++ b/src/renderer/components/+network-services/service-port-component.tsx
@@ -25,7 +25,7 @@ import portForwardStoreInjectable from "../../port-forward/port-forward-store/po
 import portForwardDialogModelInjectable from "../../port-forward/port-forward-dialog-model/port-forward-dialog-model.injectable";
 import logger from "../../../common/logger";
 
-interface Props {
+export interface ServicePortComponentProps {
   service: Service;
   port: ServicePort;
 }
@@ -36,13 +36,13 @@ interface Dependencies {
 }
 
 @observer
-class NonInjectedServicePortComponent extends React.Component<Props & Dependencies> {
+class NonInjectedServicePortComponent extends React.Component<ServicePortComponentProps & Dependencies> {
   @observable waiting = false;
   @observable forwardPort = 0;
   @observable isPortForwarded = false;
   @observable isActive = false;
 
-  constructor(props: Props & Dependencies) {
+  constructor(props: ServicePortComponentProps & Dependencies) {
     super(props);
     makeObservable(this);
     this.checkExistingPortForwarding();
@@ -186,7 +186,7 @@ class NonInjectedServicePortComponent extends React.Component<Props & Dependenci
   }
 }
 
-export const ServicePortComponent = withInjectables<Dependencies, Props>(
+export const ServicePortComponent = withInjectables<Dependencies, ServicePortComponentProps>(
   NonInjectedServicePortComponent,
 
   {
diff --git a/src/renderer/components/+network-services/services.tsx b/src/renderer/components/+network-services/services.tsx
index 84d608cb43..78cb97907c 100644
--- a/src/renderer/components/+network-services/services.tsx
+++ b/src/renderer/components/+network-services/services.tsx
@@ -26,11 +26,11 @@ enum columnId {
   status = "status",
 }
 
-interface Props extends RouteComponentProps<ServicesRouteParams> {
+export interface ServicesProps extends RouteComponentProps<ServicesRouteParams> {
 }
 
 @observer
-export class Services extends React.Component<Props> {
+export class Services extends React.Component<ServicesProps> {
   render() {
     return (
       <KubeObjectListLayout
diff --git a/src/renderer/components/+nodes/details-resources.tsx b/src/renderer/components/+nodes/details-resources.tsx
index 50d3a7cb7c..1a1de47a12 100644
--- a/src/renderer/components/+nodes/details-resources.tsx
+++ b/src/renderer/components/+nodes/details-resources.tsx
@@ -12,12 +12,12 @@ import React from "react";
 import type { Node } from "../../../common/k8s-api/endpoints";
 import { TableCell } from "../table/table-cell";
 
-interface Props {
+export interface NodeDetailsResourcesProps {
   node: Node;
   type: "allocatable" | "capacity";
 }
 
-export class NodeDetailsResources extends React.Component<Props> {
+export class NodeDetailsResources extends React.Component<NodeDetailsResourcesProps> {
   toMi(resource: string) {
     if (resource?.endsWith("Ki")) {
       return `${(parseInt(resource) / 1024).toFixed(1)}Mi`;
diff --git a/src/renderer/components/+nodes/details.tsx b/src/renderer/components/+nodes/details.tsx
index baa2557ad9..f9646478c1 100644
--- a/src/renderer/components/+nodes/details.tsx
+++ b/src/renderer/components/+nodes/details.tsx
@@ -31,7 +31,7 @@ import { withInjectables } from "@ogre-tools/injectable-react";
 import kubeWatchApiInjectable
   from "../../kube-watch-api/kube-watch-api.injectable";
 
-interface Props extends KubeObjectDetailsProps<Node> {
+export interface NodeDetailsProps extends KubeObjectDetailsProps<Node> {
 }
 
 interface Dependencies {
@@ -39,10 +39,10 @@ interface Dependencies {
 }
 
 @observer
-class NonInjectedNodeDetails extends React.Component<Props & Dependencies> {
+class NonInjectedNodeDetails extends React.Component<NodeDetailsProps & Dependencies> {
   @observable metrics: Partial<IClusterMetrics>;
 
-  constructor(props: Props & Dependencies) {
+  constructor(props: NodeDetailsProps & Dependencies) {
     super(props);
     makeObservable(this);
   }
@@ -184,7 +184,7 @@ class NonInjectedNodeDetails extends React.Component<Props & Dependencies> {
   }
 }
 
-export const NodeDetails = withInjectables<Dependencies, Props>(
+export const NodeDetails = withInjectables<Dependencies, NodeDetailsProps>(
   NonInjectedNodeDetails,
 
   {
diff --git a/src/renderer/components/+nodes/route.tsx b/src/renderer/components/+nodes/route.tsx
index 8801e6e832..a4b4cbb660 100644
--- a/src/renderer/components/+nodes/route.tsx
+++ b/src/renderer/components/+nodes/route.tsx
@@ -37,7 +37,7 @@ enum columnId {
   status = "status",
 }
 
-interface Props extends RouteComponentProps<NodesRouteParams> {
+export interface NodesRouteProps extends RouteComponentProps<NodesRouteParams> {
 }
 
 type MetricsTooltipFormatter = (metrics: [number, number]) => string;
@@ -50,11 +50,11 @@ interface UsageArgs {
 }
 
 @observer
-export class NodesRoute extends React.Component<Props> {
+export class NodesRoute extends React.Component<NodesRouteProps> {
   @observable.ref metrics: Partial<INodeMetrics> = {};
   private metricsWatcher = interval(30, async () => this.metrics = await getMetricsForAllNodes());
 
-  constructor(props: Props) {
+  constructor(props: NodesRouteProps) {
     super(props);
     makeObservable(this);
   }
diff --git a/src/renderer/components/+pod-security-policies/pod-security-policy-details.tsx b/src/renderer/components/+pod-security-policies/pod-security-policy-details.tsx
index 71d82cd506..9c556d1082 100644
--- a/src/renderer/components/+pod-security-policies/pod-security-policy-details.tsx
+++ b/src/renderer/components/+pod-security-policies/pod-security-policy-details.tsx
@@ -15,7 +15,7 @@ import { Table, TableCell, TableHead, TableRow } from "../table";
 import { KubeObjectMeta } from "../kube-object-meta";
 import logger from "../../../common/logger";
 
-interface Props extends KubeObjectDetailsProps<PodSecurityPolicy> {
+export interface PodSecurityPolicyDetailsProps extends KubeObjectDetailsProps<PodSecurityPolicy> {
 }
 
 interface RuleGroup {
@@ -27,7 +27,7 @@ interface RuleGroup {
 }
 
 @observer
-export class PodSecurityPolicyDetails extends React.Component<Props> {
+export class PodSecurityPolicyDetails extends React.Component<PodSecurityPolicyDetailsProps> {
   renderRuleGroup( title: React.ReactNode, group: RuleGroup) {
     if (!group) return null;
     const { rule, ranges } = group;
diff --git a/src/renderer/components/+preferences/add-helm-repo-dialog.tsx b/src/renderer/components/+preferences/add-helm-repo-dialog.tsx
index c47f343e21..a8768db1e1 100644
--- a/src/renderer/components/+preferences/add-helm-repo-dialog.tsx
+++ b/src/renderer/components/+preferences/add-helm-repo-dialog.tsx
@@ -21,8 +21,8 @@ import { Notifications } from "../notifications";
 import { type HelmRepo, HelmRepoManager } from "../../../main/helm/helm-repo-manager";
 import { requestOpenFilePickingDialog } from "../../ipc";
 
-interface Props extends Partial<DialogProps> {
-  onAddRepo: Function;
+export interface AddHelmRepoDialogProps extends Partial<DialogProps> {
+  onAddRepo: () => void;
 }
 
 enum FileType {
@@ -40,11 +40,11 @@ function getEmptyRepo(): HelmRepo {
 }
 
 @observer
-export class AddHelmRepoDialog extends React.Component<Props> {
+export class AddHelmRepoDialog extends React.Component<AddHelmRepoDialogProps> {
   private static keyExtensions = ["key", "keystore", "jks", "p12", "pfx", "pem"];
   private static certExtensions = ["crt", "cer", "ca-bundle", "p7b", "p7c", "p7s", "p12", "pfx", "pem"];
 
-  constructor(props: Props) {
+  constructor(props: AddHelmRepoDialogProps) {
     super(props);
     makeObservable(this);
   }
diff --git a/src/renderer/components/+preferences/extension-settings.tsx b/src/renderer/components/+preferences/extension-settings.tsx
index e3822531f4..eb4970976b 100644
--- a/src/renderer/components/+preferences/extension-settings.tsx
+++ b/src/renderer/components/+preferences/extension-settings.tsx
@@ -7,7 +7,7 @@ import type { AppPreferenceRegistration } from "./app-preferences/app-preference
 import React from "react";
 import { cssNames } from "../../../renderer/utils";
 
-interface ExtensionSettingsProps {
+export interface ExtensionSettingsProps {
   setting: AppPreferenceRegistration;
   size: "small" | "normal";
 }
diff --git a/src/renderer/components/+preferences/removable-item.tsx b/src/renderer/components/+preferences/removable-item.tsx
index d2f4d51f82..390b30f36c 100644
--- a/src/renderer/components/+preferences/removable-item.tsx
+++ b/src/renderer/components/+preferences/removable-item.tsx
@@ -9,13 +9,13 @@ import React, { DOMAttributes } from "react";
 import { cssNames } from "../../utils";
 import { Icon } from "../icon";
 
-interface Props extends DOMAttributes<any>{
+export interface RemovableItemProps extends DOMAttributes<any>{
   icon?: string;
   onRemove: () => void;
   className?: string;
 }
 
-export function RemovableItem({ icon, onRemove, children, className, ...rest }: Props) {
+export function RemovableItem({ icon, onRemove, children, className, ...rest }: RemovableItemProps) {
   return (
     <div className={cssNames(styles.item, "flex gaps align-center justify-space-between", className)} {...rest}>
       {icon && (
diff --git a/src/renderer/components/+storage-classes/storage-class-details.tsx b/src/renderer/components/+storage-classes/storage-class-details.tsx
index 8cc9075122..dc8a118d6b 100644
--- a/src/renderer/components/+storage-classes/storage-class-details.tsx
+++ b/src/renderer/components/+storage-classes/storage-class-details.tsx
@@ -24,7 +24,7 @@ import { withInjectables } from "@ogre-tools/injectable-react";
 import kubeWatchApiInjectable
   from "../../kube-watch-api/kube-watch-api.injectable";
 
-interface Props extends KubeObjectDetailsProps<StorageClass> {
+export interface StorageClassDetailsProps extends KubeObjectDetailsProps<StorageClass> {
 }
 
 interface Dependencies {
@@ -32,7 +32,7 @@ interface Dependencies {
 }
 
 @observer
-class NonInjectedStorageClassDetails extends React.Component<Props & Dependencies> {
+class NonInjectedStorageClassDetails extends React.Component<StorageClassDetailsProps & Dependencies> {
   componentDidMount() {
     disposeOnUnmount(this, [
       this.props.subscribeStores([
@@ -96,7 +96,7 @@ class NonInjectedStorageClassDetails extends React.Component<Props & Dependencie
   }
 }
 
-export const StorageClassDetails = withInjectables<Dependencies, Props>(
+export const StorageClassDetails = withInjectables<Dependencies, StorageClassDetailsProps>(
   NonInjectedStorageClassDetails,
 
   {
diff --git a/src/renderer/components/+storage-classes/storage-classes.tsx b/src/renderer/components/+storage-classes/storage-classes.tsx
index 4214133540..06c646c7c6 100644
--- a/src/renderer/components/+storage-classes/storage-classes.tsx
+++ b/src/renderer/components/+storage-classes/storage-classes.tsx
@@ -21,11 +21,11 @@ enum columnId {
   reclaimPolicy = "reclaim",
 }
 
-interface Props extends RouteComponentProps<StorageClassesRouteParams> {
+export interface StorageClassesProps extends RouteComponentProps<StorageClassesRouteParams> {
 }
 
 @observer
-export class StorageClasses extends React.Component<Props> {
+export class StorageClasses extends React.Component<StorageClassesProps> {
   render() {
     return (
       <KubeObjectListLayout
diff --git a/src/renderer/components/+storage-volume-claims/volume-claim-details.tsx b/src/renderer/components/+storage-volume-claims/volume-claim-details.tsx
index 3a418ce795..a13d2175a5 100644
--- a/src/renderer/components/+storage-volume-claims/volume-claim-details.tsx
+++ b/src/renderer/components/+storage-volume-claims/volume-claim-details.tsx
@@ -23,14 +23,14 @@ import { getDetailsUrl } from "../kube-detail-params";
 import { boundMethod } from "../../utils";
 import logger from "../../../common/logger";
 
-interface Props extends KubeObjectDetailsProps<PersistentVolumeClaim> {
+export interface PersistentVolumeClaimDetailsProps extends KubeObjectDetailsProps<PersistentVolumeClaim> {
 }
 
 @observer
-export class PersistentVolumeClaimDetails extends React.Component<Props> {
+export class PersistentVolumeClaimDetails extends React.Component<PersistentVolumeClaimDetailsProps> {
   @observable metrics: IPvcMetrics = null;
 
-  constructor(props: Props) {
+  constructor(props: PersistentVolumeClaimDetailsProps) {
     super(props);
     makeObservable(this);
   }
diff --git a/src/renderer/components/+storage-volume-claims/volume-claims.tsx b/src/renderer/components/+storage-volume-claims/volume-claims.tsx
index dec3a1fcce..30f0077901 100644
--- a/src/renderer/components/+storage-volume-claims/volume-claims.tsx
+++ b/src/renderer/components/+storage-volume-claims/volume-claims.tsx
@@ -28,11 +28,11 @@ enum columnId {
   age = "age",
 }
 
-interface Props extends RouteComponentProps<VolumeClaimsRouteParams> {
+export interface PersistentVolumeClaimsProps extends RouteComponentProps<VolumeClaimsRouteParams> {
 }
 
 @observer
-export class PersistentVolumeClaims extends React.Component<Props> {
+export class PersistentVolumeClaims extends React.Component<PersistentVolumeClaimsProps> {
   render() {
     return (
       <KubeObjectListLayout
diff --git a/src/renderer/components/+storage-volumes/volume-details-list.tsx b/src/renderer/components/+storage-volumes/volume-details-list.tsx
index c6dd985925..a58d41f6cf 100644
--- a/src/renderer/components/+storage-volumes/volume-details-list.tsx
+++ b/src/renderer/components/+storage-volumes/volume-details-list.tsx
@@ -20,7 +20,7 @@ import { TableHead } from "../table/table-head";
 import { volumesStore } from "./volumes.store";
 import kebabCase from "lodash/kebabCase";
 
-interface Props {
+export interface VolumeDetailsListProps {
   persistentVolumes: PersistentVolume[];
 }
 
@@ -31,7 +31,7 @@ enum sortBy {
 }
 
 @observer
-export class VolumeDetailsList extends React.Component<Props> {
+export class VolumeDetailsList extends React.Component<VolumeDetailsListProps> {
   private sortingCallbacks = {
     [sortBy.name]: (volume: PersistentVolume) => volume.getName(),
     [sortBy.capacity]: (volume: PersistentVolume) => volume.getCapacity(),
diff --git a/src/renderer/components/+storage-volumes/volume-details.tsx b/src/renderer/components/+storage-volumes/volume-details.tsx
index 5cfa954402..8c8f75f817 100644
--- a/src/renderer/components/+storage-volumes/volume-details.tsx
+++ b/src/renderer/components/+storage-volumes/volume-details.tsx
@@ -17,11 +17,11 @@ import { KubeObjectMeta } from "../kube-object-meta";
 import { getDetailsUrl } from "../kube-detail-params";
 import logger from "../../../common/logger";
 
-interface Props extends KubeObjectDetailsProps<PersistentVolume> {
+export interface PersistentVolumeDetailsProps extends KubeObjectDetailsProps<PersistentVolume> {
 }
 
 @observer
-export class PersistentVolumeDetails extends React.Component<Props> {
+export class PersistentVolumeDetails extends React.Component<PersistentVolumeDetailsProps> {
   render() {
     const { object: volume } = this.props;
 
diff --git a/src/renderer/components/+storage-volumes/volumes.tsx b/src/renderer/components/+storage-volumes/volumes.tsx
index b271585455..0c458ea567 100644
--- a/src/renderer/components/+storage-volumes/volumes.tsx
+++ b/src/renderer/components/+storage-volumes/volumes.tsx
@@ -25,11 +25,11 @@ enum columnId {
   age = "age",
 }
 
-interface Props extends RouteComponentProps<VolumesRouteParams> {
+export interface PersistentVolumesProps extends RouteComponentProps<VolumesRouteParams> {
 }
 
 @observer
-export class PersistentVolumes extends React.Component<Props> {
+export class PersistentVolumes extends React.Component<PersistentVolumesProps> {
   render() {
     return (
       <KubeObjectListLayout
diff --git a/src/renderer/components/+user-management/+cluster-role-bindings/details.tsx b/src/renderer/components/+user-management/+cluster-role-bindings/details.tsx
index 842ee97121..6730227768 100644
--- a/src/renderer/components/+user-management/+cluster-role-bindings/details.tsx
+++ b/src/renderer/components/+user-management/+cluster-role-bindings/details.tsx
@@ -21,14 +21,14 @@ import { ClusterRoleBindingDialog } from "./dialog";
 import { clusterRoleBindingsStore } from "./store";
 import { hashClusterRoleBindingSubject } from "./hashers";
 
-interface Props extends KubeObjectDetailsProps<ClusterRoleBinding> {
+export interface ClusterRoleBindingDetailsProps extends KubeObjectDetailsProps<ClusterRoleBinding> {
 }
 
 @observer
-export class ClusterRoleBindingDetails extends React.Component<Props> {
+export class ClusterRoleBindingDetails extends React.Component<ClusterRoleBindingDetailsProps> {
   selectedSubjects = new ObservableHashSet<ClusterRoleBindingSubject>([], hashClusterRoleBindingSubject);
 
-  constructor(props: Props) {
+  constructor(props: ClusterRoleBindingDetailsProps) {
     super(props);
     autoBind(this);
   }
diff --git a/src/renderer/components/+user-management/+cluster-role-bindings/dialog.tsx b/src/renderer/components/+user-management/+cluster-role-bindings/dialog.tsx
index 3823b2213e..54f626397e 100644
--- a/src/renderer/components/+user-management/+cluster-role-bindings/dialog.tsx
+++ b/src/renderer/components/+user-management/+cluster-role-bindings/dialog.tsx
@@ -25,7 +25,7 @@ import { ObservableHashSet, nFircate } from "../../../utils";
 import { Input } from "../../input";
 import { TooltipPosition } from "../../tooltip";
 
-interface Props extends Partial<DialogProps> {
+export interface ClusterRoleBindingDialogProps extends Partial<DialogProps> {
 }
 
 interface DialogState {
@@ -34,12 +34,12 @@ interface DialogState {
 }
 
 @observer
-export class ClusterRoleBindingDialog extends React.Component<Props> {
+export class ClusterRoleBindingDialog extends React.Component<ClusterRoleBindingDialogProps> {
   static state = observable.object<DialogState>({
     isOpen: false,
   });
 
-  constructor(props: Props) {
+  constructor(props: ClusterRoleBindingDialogProps) {
     super(props);
     makeObservable(this);
   }
diff --git a/src/renderer/components/+user-management/+cluster-role-bindings/view.tsx b/src/renderer/components/+user-management/+cluster-role-bindings/view.tsx
index aac85971d4..e24a73243f 100644
--- a/src/renderer/components/+user-management/+cluster-role-bindings/view.tsx
+++ b/src/renderer/components/+user-management/+cluster-role-bindings/view.tsx
@@ -23,11 +23,11 @@ enum columnId {
   age = "age",
 }
 
-interface Props extends RouteComponentProps<ClusterRoleBindingsRouteParams> {
+export interface ClusterRoleBindingsProps extends RouteComponentProps<ClusterRoleBindingsRouteParams> {
 }
 
 @observer
-export class ClusterRoleBindings extends React.Component<Props> {
+export class ClusterRoleBindings extends React.Component<ClusterRoleBindingsProps> {
   render() {
     return (
       <>
diff --git a/src/renderer/components/+user-management/+cluster-roles/add-dialog.tsx b/src/renderer/components/+user-management/+cluster-roles/add-dialog.tsx
index dedd371764..86e5ca90f4 100644
--- a/src/renderer/components/+user-management/+cluster-roles/add-dialog.tsx
+++ b/src/renderer/components/+user-management/+cluster-roles/add-dialog.tsx
@@ -16,16 +16,16 @@ import { Notifications } from "../../notifications";
 import { Wizard, WizardStep } from "../../wizard";
 import { clusterRolesStore } from "./store";
 
-interface Props extends Partial<DialogProps> {
+export interface AddClusterRoleDialogProps extends Partial<DialogProps> {
 }
 
 @observer
-export class AddClusterRoleDialog extends React.Component<Props> {
+export class AddClusterRoleDialog extends React.Component<AddClusterRoleDialogProps> {
   static isOpen = observable.box(false);
 
   @observable clusterRoleName = "";
 
-  constructor(props: Props) {
+  constructor(props: AddClusterRoleDialogProps) {
     super(props);
     makeObservable(this);
   }
diff --git a/src/renderer/components/+user-management/+cluster-roles/details.tsx b/src/renderer/components/+user-management/+cluster-roles/details.tsx
index 4fadd76bbe..96584e7f2c 100644
--- a/src/renderer/components/+user-management/+cluster-roles/details.tsx
+++ b/src/renderer/components/+user-management/+cluster-roles/details.tsx
@@ -13,11 +13,11 @@ import type { KubeObjectDetailsProps } from "../../kube-object-details";
 import { KubeObjectMeta } from "../../kube-object-meta";
 import type { ClusterRole } from "../../../../common/k8s-api/endpoints";
 
-interface Props extends KubeObjectDetailsProps<ClusterRole> {
+export interface ClusterRoleDetailsProps extends KubeObjectDetailsProps<ClusterRole> {
 }
 
 @observer
-export class ClusterRoleDetails extends React.Component<Props> {
+export class ClusterRoleDetails extends React.Component<ClusterRoleDetailsProps> {
   render() {
     const { object: clusterRole } = this.props;
 
diff --git a/src/renderer/components/+user-management/+cluster-roles/view.tsx b/src/renderer/components/+user-management/+cluster-roles/view.tsx
index 89c918c721..ca2a8755d0 100644
--- a/src/renderer/components/+user-management/+cluster-roles/view.tsx
+++ b/src/renderer/components/+user-management/+cluster-roles/view.tsx
@@ -20,11 +20,11 @@ enum columnId {
   age = "age",
 }
 
-interface Props extends RouteComponentProps<ClusterRolesRouteParams> {
+export interface ClusterRolesProps extends RouteComponentProps<ClusterRolesRouteParams> {
 }
 
 @observer
-export class ClusterRoles extends React.Component<Props> {
+export class ClusterRoles extends React.Component<ClusterRolesProps> {
   render() {
     return (
       <>
diff --git a/src/renderer/components/+user-management/+role-bindings/details.tsx b/src/renderer/components/+user-management/+role-bindings/details.tsx
index dd82a11b89..2961a148cc 100644
--- a/src/renderer/components/+user-management/+role-bindings/details.tsx
+++ b/src/renderer/components/+user-management/+role-bindings/details.tsx
@@ -21,11 +21,11 @@ import { roleBindingsStore } from "./store";
 import { ObservableHashSet } from "../../../../common/utils/hash-set";
 import { hashRoleBindingSubject } from "./hashers";
 
-interface Props extends KubeObjectDetailsProps<RoleBinding> {
+export interface RoleBindingDetailsProps extends KubeObjectDetailsProps<RoleBinding> {
 }
 
 @observer
-export class RoleBindingDetails extends React.Component<Props> {
+export class RoleBindingDetails extends React.Component<RoleBindingDetailsProps> {
   selectedSubjects = new ObservableHashSet<RoleBindingSubject>([], hashRoleBindingSubject);
 
   async componentDidMount() {
diff --git a/src/renderer/components/+user-management/+role-bindings/dialog.tsx b/src/renderer/components/+user-management/+role-bindings/dialog.tsx
index 29cb771432..3add013dc3 100644
--- a/src/renderer/components/+user-management/+role-bindings/dialog.tsx
+++ b/src/renderer/components/+user-management/+role-bindings/dialog.tsx
@@ -26,7 +26,7 @@ import { clusterRolesStore } from "../+cluster-roles/store";
 import { Input } from "../../input";
 import { ObservableHashSet, nFircate } from "../../../utils";
 
-interface Props extends Partial<DialogProps> {
+export interface RoleBindingDialogProps extends Partial<DialogProps> {
 }
 
 interface DialogState {
@@ -35,12 +35,12 @@ interface DialogState {
 }
 
 @observer
-export class RoleBindingDialog extends React.Component<Props> {
+export class RoleBindingDialog extends React.Component<RoleBindingDialogProps> {
   static state = observable.object<DialogState>({
     isOpen: false,
   });
 
-  constructor(props: Props) {
+  constructor(props: RoleBindingDialogProps) {
     super(props);
     makeObservable(this);
   }
diff --git a/src/renderer/components/+user-management/+role-bindings/view.tsx b/src/renderer/components/+user-management/+role-bindings/view.tsx
index c97974661b..60a0307df4 100644
--- a/src/renderer/components/+user-management/+role-bindings/view.tsx
+++ b/src/renderer/components/+user-management/+role-bindings/view.tsx
@@ -23,11 +23,11 @@ enum columnId {
   age = "age",
 }
 
-interface Props extends RouteComponentProps<RoleBindingsRouteParams> {
+export interface RoleBindingsProps extends RouteComponentProps<RoleBindingsRouteParams> {
 }
 
 @observer
-export class RoleBindings extends React.Component<Props> {
+export class RoleBindings extends React.Component<RoleBindingsProps> {
   render() {
     return (
       <>
diff --git a/src/renderer/components/+user-management/+roles/add-dialog.tsx b/src/renderer/components/+user-management/+roles/add-dialog.tsx
index 8197974833..6bf6b6ef1f 100644
--- a/src/renderer/components/+user-management/+roles/add-dialog.tsx
+++ b/src/renderer/components/+user-management/+roles/add-dialog.tsx
@@ -18,17 +18,17 @@ import { Notifications } from "../../notifications";
 import { Wizard, WizardStep } from "../../wizard";
 import { rolesStore } from "./store";
 
-interface Props extends Partial<DialogProps> {
+export interface AddRoleDialogProps extends Partial<DialogProps> {
 }
 
 @observer
-export class AddRoleDialog extends React.Component<Props> {
+export class AddRoleDialog extends React.Component<AddRoleDialogProps> {
   static isOpen = observable.box(false);
 
   @observable roleName = "";
   @observable namespace = "";
 
-  constructor(props: Props) {
+  constructor(props: AddRoleDialogProps) {
     super(props);
     makeObservable(this);
   }
diff --git a/src/renderer/components/+user-management/+roles/details.tsx b/src/renderer/components/+user-management/+roles/details.tsx
index 36675382ef..7342715fd1 100644
--- a/src/renderer/components/+user-management/+roles/details.tsx
+++ b/src/renderer/components/+user-management/+roles/details.tsx
@@ -13,11 +13,11 @@ import { DrawerTitle } from "../../drawer";
 import type { KubeObjectDetailsProps } from "../../kube-object-details";
 import { KubeObjectMeta } from "../../kube-object-meta";
 
-interface Props extends KubeObjectDetailsProps<Role> {
+export interface RoleDetailsProps extends KubeObjectDetailsProps<Role> {
 }
 
 @observer
-export class RoleDetails extends React.Component<Props> {
+export class RoleDetails extends React.Component<RoleDetailsProps> {
   render() {
     const { object: role } = this.props;
 
diff --git a/src/renderer/components/+user-management/+roles/view.tsx b/src/renderer/components/+user-management/+roles/view.tsx
index 1acd0b2f35..4939642e95 100644
--- a/src/renderer/components/+user-management/+roles/view.tsx
+++ b/src/renderer/components/+user-management/+roles/view.tsx
@@ -20,11 +20,11 @@ enum columnId {
   age = "age",
 }
 
-interface Props extends RouteComponentProps<RolesRouteParams> {
+export interface RolesProps extends RouteComponentProps<RolesRouteParams> {
 }
 
 @observer
-export class Roles extends React.Component<Props> {
+export class Roles extends React.Component<RolesProps> {
   render() {
     return (
       <>
diff --git a/src/renderer/components/+user-management/+service-accounts/create-dialog.tsx b/src/renderer/components/+user-management/+service-accounts/create-dialog.tsx
index 1804880d64..c041d502f4 100644
--- a/src/renderer/components/+user-management/+service-accounts/create-dialog.tsx
+++ b/src/renderer/components/+user-management/+service-accounts/create-dialog.tsx
@@ -19,17 +19,17 @@ import { Notifications } from "../../notifications";
 import { Wizard, WizardStep } from "../../wizard";
 import { serviceAccountsStore } from "./store";
 
-interface Props extends Partial<DialogProps> {
+export interface CreateServiceAccountDialogProps extends Partial<DialogProps> {
 }
 
 @observer
-export class CreateServiceAccountDialog extends React.Component<Props> {
+export class CreateServiceAccountDialog extends React.Component<CreateServiceAccountDialogProps> {
   static isOpen = observable.box(false);
 
   @observable name = "";
   @observable namespace = "default";
 
-  constructor(props: Props) {
+  constructor(props: CreateServiceAccountDialogProps) {
     super(props);
     makeObservable(this);
   }
diff --git a/src/renderer/components/+user-management/+service-accounts/details.tsx b/src/renderer/components/+user-management/+service-accounts/details.tsx
index dec10fa678..f627b04b21 100644
--- a/src/renderer/components/+user-management/+service-accounts/details.tsx
+++ b/src/renderer/components/+user-management/+service-accounts/details.tsx
@@ -20,11 +20,11 @@ import { Spinner } from "../../spinner";
 import { ServiceAccountsSecret } from "./secret";
 import { getDetailsUrl } from "../../kube-detail-params";
 
-interface Props extends KubeObjectDetailsProps<ServiceAccount> {
+export interface ServiceAccountsDetailsProps extends KubeObjectDetailsProps<ServiceAccount> {
 }
 
 @observer
-export class ServiceAccountsDetails extends React.Component<Props> {
+export class ServiceAccountsDetails extends React.Component<ServiceAccountsDetailsProps> {
   @observable secrets: Secret[];
   @observable imagePullSecrets: Secret[];
 
@@ -53,7 +53,7 @@ export class ServiceAccountsDetails extends React.Component<Props> {
     ]);
   }
 
-  constructor(props: Props) {
+  constructor(props: ServiceAccountsDetailsProps) {
     super(props);
     makeObservable(this);
   }
diff --git a/src/renderer/components/+user-management/+service-accounts/secret.tsx b/src/renderer/components/+user-management/+service-accounts/secret.tsx
index 97959dbac9..04f4f86899 100644
--- a/src/renderer/components/+user-management/+service-accounts/secret.tsx
+++ b/src/renderer/components/+user-management/+service-accounts/secret.tsx
@@ -12,7 +12,7 @@ import type { Secret } from "../../../../common/k8s-api/endpoints/secret.api";
 import { prevDefault } from "../../../utils";
 import { Icon } from "../../icon";
 
-interface Props {
+export interface ServiceAccountsSecretProps {
   secret: Secret;
 }
 
@@ -20,7 +20,7 @@ interface State {
   showToken: boolean;
 }
 
-export class ServiceAccountsSecret extends React.Component<Props, State> {
+export class ServiceAccountsSecret extends React.Component<ServiceAccountsSecretProps, State> {
   public state: State = {
     showToken: false,
   };
diff --git a/src/renderer/components/+user-management/+service-accounts/view.tsx b/src/renderer/components/+user-management/+service-accounts/view.tsx
index 94c7370639..bc768f5874 100644
--- a/src/renderer/components/+user-management/+service-accounts/view.tsx
+++ b/src/renderer/components/+user-management/+service-accounts/view.tsx
@@ -20,11 +20,11 @@ enum columnId {
   age = "age",
 }
 
-interface Props extends RouteComponentProps<ServiceAccountsRouteParams> {
+export interface ServiceAccountsProps extends RouteComponentProps<ServiceAccountsRouteParams> {
 }
 
 @observer
-export class ServiceAccounts extends React.Component<Props> {
+export class ServiceAccounts extends React.Component<ServiceAccountsProps> {
   render() {
     return (
       <>
diff --git a/src/renderer/components/+workloads-cronjobs/cronjob-details.tsx b/src/renderer/components/+workloads-cronjobs/cronjob-details.tsx
index 1a3b70cb85..19d49b2de8 100644
--- a/src/renderer/components/+workloads-cronjobs/cronjob-details.tsx
+++ b/src/renderer/components/+workloads-cronjobs/cronjob-details.tsx
@@ -25,7 +25,7 @@ import { withInjectables } from "@ogre-tools/injectable-react";
 import kubeWatchApiInjectable
   from "../../kube-watch-api/kube-watch-api.injectable";
 
-interface Props extends KubeObjectDetailsProps<CronJob> {
+export interface CronJobDetailsProps extends KubeObjectDetailsProps<CronJob> {
 }
 
 interface Dependencies {
@@ -33,7 +33,7 @@ interface Dependencies {
 }
 
 @observer
-class NonInjectedCronJobDetails extends React.Component<Props & Dependencies> {
+class NonInjectedCronJobDetails extends React.Component<CronJobDetailsProps & Dependencies> {
   componentDidMount() {
     disposeOnUnmount(this, [
       this.props.subscribeStores([
@@ -113,7 +113,7 @@ class NonInjectedCronJobDetails extends React.Component<Props & Dependencies> {
   }
 }
 
-export const CronJobDetails = withInjectables<Dependencies, Props>(
+export const CronJobDetails = withInjectables<Dependencies, CronJobDetailsProps>(
   NonInjectedCronJobDetails,
 
   {
diff --git a/src/renderer/components/+workloads-cronjobs/cronjob-trigger-dialog.tsx b/src/renderer/components/+workloads-cronjobs/cronjob-trigger-dialog.tsx
index 689dd87ee1..b545bdf44f 100644
--- a/src/renderer/components/+workloads-cronjobs/cronjob-trigger-dialog.tsx
+++ b/src/renderer/components/+workloads-cronjobs/cronjob-trigger-dialog.tsx
@@ -17,7 +17,7 @@ import { Input } from "../input";
 import { systemName, maxLength } from "../input/input_validators";
 import type { KubeObjectMetadata } from "../../../common/k8s-api/kube-object";
 
-interface Props extends Partial<DialogProps> {
+export interface CronJobTriggerDialogProps extends Partial<DialogProps> {
 }
 
 const dialogState = observable.object({
@@ -26,11 +26,11 @@ const dialogState = observable.object({
 });
 
 @observer
-export class CronJobTriggerDialog extends Component<Props> {
+export class CronJobTriggerDialog extends Component<CronJobTriggerDialogProps> {
   @observable jobName = "";
   @observable ready = false;
 
-  constructor(props: Props) {
+  constructor(props: CronJobTriggerDialogProps) {
     super(props);
     makeObservable(this);
   }
diff --git a/src/renderer/components/+workloads-cronjobs/cronjobs.tsx b/src/renderer/components/+workloads-cronjobs/cronjobs.tsx
index 30e476502e..5b0dff6ce5 100644
--- a/src/renderer/components/+workloads-cronjobs/cronjobs.tsx
+++ b/src/renderer/components/+workloads-cronjobs/cronjobs.tsx
@@ -26,11 +26,11 @@ enum columnId {
   age = "age",
 }
 
-interface Props extends RouteComponentProps<CronJobsRouteParams> {
+export interface CronJobsProps extends RouteComponentProps<CronJobsRouteParams> {
 }
 
 @observer
-export class CronJobs extends React.Component<Props> {
+export class CronJobs extends React.Component<CronJobsProps> {
   render() {
     return (
       <KubeObjectListLayout
diff --git a/src/renderer/components/+workloads-daemonsets/daemonset-details.tsx b/src/renderer/components/+workloads-daemonsets/daemonset-details.tsx
index 052a4abadb..b6b76db605 100644
--- a/src/renderer/components/+workloads-daemonsets/daemonset-details.tsx
+++ b/src/renderer/components/+workloads-daemonsets/daemonset-details.tsx
@@ -31,7 +31,7 @@ import { withInjectables } from "@ogre-tools/injectable-react";
 import kubeWatchApiInjectable
   from "../../kube-watch-api/kube-watch-api.injectable";
 
-interface Props extends KubeObjectDetailsProps<DaemonSet> {
+export interface DaemonSetDetailsProps extends KubeObjectDetailsProps<DaemonSet> {
 }
 
 interface Dependencies {
@@ -39,10 +39,10 @@ interface Dependencies {
 }
 
 @observer
-class NonInjectedDaemonSetDetails extends React.Component<Props & Dependencies> {
+class NonInjectedDaemonSetDetails extends React.Component<DaemonSetDetailsProps & Dependencies> {
   @observable metrics: IPodMetrics = null;
 
-  constructor(props: Props & Dependencies) {
+  constructor(props: DaemonSetDetailsProps & Dependencies) {
     super(props);
     makeObservable(this);
   }
@@ -132,7 +132,7 @@ class NonInjectedDaemonSetDetails extends React.Component<Props & Dependencies>
   }
 }
 
-export const DaemonSetDetails = withInjectables<Dependencies, Props>(
+export const DaemonSetDetails = withInjectables<Dependencies, DaemonSetDetailsProps>(
   NonInjectedDaemonSetDetails,
 
   {
diff --git a/src/renderer/components/+workloads-daemonsets/daemonsets.tsx b/src/renderer/components/+workloads-daemonsets/daemonsets.tsx
index 73befe42df..6aad52d788 100644
--- a/src/renderer/components/+workloads-daemonsets/daemonsets.tsx
+++ b/src/renderer/components/+workloads-daemonsets/daemonsets.tsx
@@ -25,11 +25,11 @@ enum columnId {
   age = "age",
 }
 
-interface Props extends RouteComponentProps<DaemonSetsRouteParams> {
+export interface DaemonSetsProps extends RouteComponentProps<DaemonSetsRouteParams> {
 }
 
 @observer
-export class DaemonSets extends React.Component<Props> {
+export class DaemonSets extends React.Component<DaemonSetsProps> {
   getPodsLength(daemonSet: DaemonSet) {
     return daemonSetStore.getChildPods(daemonSet).length;
   }
diff --git a/src/renderer/components/+workloads-deployments/deployment-details.tsx b/src/renderer/components/+workloads-deployments/deployment-details.tsx
index 17ac7899fb..56f4070e80 100644
--- a/src/renderer/components/+workloads-deployments/deployment-details.tsx
+++ b/src/renderer/components/+workloads-deployments/deployment-details.tsx
@@ -33,7 +33,7 @@ import { withInjectables } from "@ogre-tools/injectable-react";
 import kubeWatchApiInjectable
   from "../../kube-watch-api/kube-watch-api.injectable";
 
-interface Props extends KubeObjectDetailsProps<Deployment> {
+export interface DeploymentDetailsProps extends KubeObjectDetailsProps<Deployment> {
 }
 
 interface Dependencies {
@@ -41,10 +41,10 @@ interface Dependencies {
 }
 
 @observer
-class NonInjectedDeploymentDetails extends React.Component<Props & Dependencies> {
+class NonInjectedDeploymentDetails extends React.Component<DeploymentDetailsProps & Dependencies> {
   @observable metrics: IPodMetrics = null;
 
-  constructor(props: Props & Dependencies) {
+  constructor(props: DeploymentDetailsProps & Dependencies) {
     super(props);
     makeObservable(this);
   }
@@ -156,7 +156,7 @@ class NonInjectedDeploymentDetails extends React.Component<Props & Dependencies>
   }
 }
 
-export const DeploymentDetails = withInjectables<Dependencies, Props>(
+export const DeploymentDetails = withInjectables<Dependencies, DeploymentDetailsProps>(
   NonInjectedDeploymentDetails,
 
   {
diff --git a/src/renderer/components/+workloads-deployments/deployment-replicasets.tsx b/src/renderer/components/+workloads-deployments/deployment-replicasets.tsx
index 2905c1accb..2bb1510f19 100644
--- a/src/renderer/components/+workloads-deployments/deployment-replicasets.tsx
+++ b/src/renderer/components/+workloads-deployments/deployment-replicasets.tsx
@@ -25,12 +25,12 @@ enum sortBy {
   age = "age",
 }
 
-interface Props {
+export interface DeploymentReplicaSetsProps {
   replicaSets: ReplicaSet[];
 }
 
 @observer
-export class DeploymentReplicaSets extends React.Component<Props> {
+export class DeploymentReplicaSets extends React.Component<DeploymentReplicaSetsProps> {
   private sortingCallbacks = {
     [sortBy.name]: (replicaSet: ReplicaSet) => replicaSet.getName(),
     [sortBy.namespace]: (replicaSet: ReplicaSet) => replicaSet.getNs(),
diff --git a/src/renderer/components/+workloads-deployments/deployment-scale-dialog.tsx b/src/renderer/components/+workloads-deployments/deployment-scale-dialog.tsx
index c8741b72fd..a9cf32c61e 100644
--- a/src/renderer/components/+workloads-deployments/deployment-scale-dialog.tsx
+++ b/src/renderer/components/+workloads-deployments/deployment-scale-dialog.tsx
@@ -16,7 +16,7 @@ import { Slider } from "../slider";
 import { Notifications } from "../notifications";
 import { cssNames } from "../../utils";
 
-interface Props extends Partial<DialogProps> {
+export interface DeploymentScaleDialogProps extends Partial<DialogProps> {
   deploymentApi: DeploymentApi;
 }
 
@@ -26,7 +26,7 @@ const dialogState = observable.object({
 });
 
 @observer
-export class DeploymentScaleDialog extends Component<Props> {
+export class DeploymentScaleDialog extends Component<DeploymentScaleDialogProps> {
   static defaultProps = {
     deploymentApi,
   };
@@ -35,7 +35,7 @@ export class DeploymentScaleDialog extends Component<Props> {
   @observable currentReplicas = 0;
   @observable desiredReplicas = 0;
 
-  constructor(props: Props) {
+  constructor(props: DeploymentScaleDialogProps) {
     super(props);
     makeObservable(this);
   }
diff --git a/src/renderer/components/+workloads-deployments/deployments.tsx b/src/renderer/components/+workloads-deployments/deployments.tsx
index 3506db0486..3dcbeac0b8 100644
--- a/src/renderer/components/+workloads-deployments/deployments.tsx
+++ b/src/renderer/components/+workloads-deployments/deployments.tsx
@@ -27,11 +27,11 @@ enum columnId {
   condition = "condition",
 }
 
-interface Props extends RouteComponentProps<DeploymentsRouteParams> {
+export interface DeploymentsProps extends RouteComponentProps<DeploymentsRouteParams> {
 }
 
 @observer
-export class Deployments extends React.Component<Props> {
+export class Deployments extends React.Component<DeploymentsProps> {
   renderPods(deployment: Deployment) {
     const { replicas, availableReplicas } = deployment.status;
 
diff --git a/src/renderer/components/+workloads-jobs/job-details.tsx b/src/renderer/components/+workloads-jobs/job-details.tsx
index 7c5c8157ed..a571a1a4b7 100644
--- a/src/renderer/components/+workloads-jobs/job-details.tsx
+++ b/src/renderer/components/+workloads-jobs/job-details.tsx
@@ -36,7 +36,7 @@ import { withInjectables } from "@ogre-tools/injectable-react";
 import kubeWatchApiInjectable
   from "../../kube-watch-api/kube-watch-api.injectable";
 
-interface Props extends KubeObjectDetailsProps<Job> {
+export interface JobDetailsProps extends KubeObjectDetailsProps<Job> {
 }
 
 interface Dependencies {
@@ -44,10 +44,10 @@ interface Dependencies {
 }
 
 @observer
-class NonInjectedJobDetails extends React.Component<Props & Dependencies> {
+class NonInjectedJobDetails extends React.Component<JobDetailsProps & Dependencies> {
   @observable metrics: IPodMetrics = null;
 
-  constructor(props: Props & Dependencies) {
+  constructor(props: JobDetailsProps & Dependencies) {
     super(props);
     makeObservable(this);
   }
@@ -165,7 +165,7 @@ class NonInjectedJobDetails extends React.Component<Props & Dependencies> {
   }
 }
 
-export const JobDetails = withInjectables<Dependencies, Props>(
+export const JobDetails = withInjectables<Dependencies, JobDetailsProps>(
   NonInjectedJobDetails,
 
   {
diff --git a/src/renderer/components/+workloads-jobs/jobs.tsx b/src/renderer/components/+workloads-jobs/jobs.tsx
index ae3c8c931d..15a49bafb0 100644
--- a/src/renderer/components/+workloads-jobs/jobs.tsx
+++ b/src/renderer/components/+workloads-jobs/jobs.tsx
@@ -23,11 +23,11 @@ enum columnId {
   age = "age",
 }
 
-interface Props extends RouteComponentProps<JobsRouteParams> {
+export interface JobsProps extends RouteComponentProps<JobsRouteParams> {
 }
 
 @observer
-export class Jobs extends React.Component<Props> {
+export class Jobs extends React.Component<JobsProps> {
   render() {
     return (
       <KubeObjectListLayout
diff --git a/src/renderer/components/+workloads-overview/overview-workload-status.tsx b/src/renderer/components/+workloads-overview/overview-workload-status.tsx
index d042ba1597..fea3955b6e 100644
--- a/src/renderer/components/+workloads-overview/overview-workload-status.tsx
+++ b/src/renderer/components/+workloads-overview/overview-workload-status.tsx
@@ -13,12 +13,12 @@ import { cssVar } from "../../utils";
 import type { ChartData } from "chart.js";
 import { ThemeStore } from "../../theme.store";
 
-interface Props {
+export interface OverviewWorkloadStatusProps {
   status: Record<string, number>;
 }
 
 @observer
-export class OverviewWorkloadStatus extends React.Component<Props> {
+export class OverviewWorkloadStatus extends React.Component<OverviewWorkloadStatusProps> {
   elem?: HTMLElement;
 
   renderChart() {
diff --git a/src/renderer/components/+workloads-overview/overview.tsx b/src/renderer/components/+workloads-overview/overview.tsx
index 51e247ac57..b4ee166ca9 100644
--- a/src/renderer/components/+workloads-overview/overview.tsx
+++ b/src/renderer/components/+workloads-overview/overview.tsx
@@ -31,7 +31,7 @@ import type { Disposer } from "../../../common/utils";
 import kubeWatchApiInjectable from "../../kube-watch-api/kube-watch-api.injectable";
 import type { KubeWatchSubscribeStoreOptions } from "../../kube-watch-api/kube-watch-api";
 
-interface Props extends RouteComponentProps<WorkloadsOverviewRouteParams> {
+export interface WorkloadsOverviewProps extends RouteComponentProps<WorkloadsOverviewRouteParams> {
 }
 
 interface Dependencies {
@@ -40,10 +40,10 @@ interface Dependencies {
 }
 
 @observer
-class NonInjectedWorkloadsOverview extends React.Component<Props & Dependencies> {
+class NonInjectedWorkloadsOverview extends React.Component<WorkloadsOverviewProps & Dependencies> {
   @observable loadErrors: string[] = [];
 
-  constructor(props: Props & Dependencies) {
+  constructor(props: WorkloadsOverviewProps & Dependencies) {
     super(props);
     makeObservable(this);
   }
@@ -111,7 +111,7 @@ class NonInjectedWorkloadsOverview extends React.Component<Props & Dependencies>
   }
 }
 
-export const WorkloadsOverview = withInjectables<Dependencies, Props>(
+export const WorkloadsOverview = withInjectables<Dependencies, WorkloadsOverviewProps>(
   NonInjectedWorkloadsOverview,
 
   {
diff --git a/src/renderer/components/+workloads-pods/pod-container-env.tsx b/src/renderer/components/+workloads-pods/pod-container-env.tsx
index ecf711007c..b6cc7b733a 100644
--- a/src/renderer/components/+workloads-pods/pod-container-env.tsx
+++ b/src/renderer/components/+workloads-pods/pod-container-env.tsx
@@ -16,12 +16,12 @@ import { Icon } from "../icon";
 import { base64, cssNames, iter } from "../../utils";
 import _ from "lodash";
 
-interface Props {
+export interface ContainerEnvironmentProps {
   container: IPodContainer;
   namespace: string;
 }
 
-export const ContainerEnvironment = observer((props: Props) => {
+export const ContainerEnvironment = observer((props: ContainerEnvironmentProps) => {
   const { container: { env, envFrom }, namespace } = props;
 
   useEffect( () => autorun(() => {
@@ -149,7 +149,7 @@ export const ContainerEnvironment = observer((props: Props) => {
   );
 });
 
-interface SecretKeyProps {
+export interface SecretKeyProps {
   reference: {
     name: string;
     key: string;
diff --git a/src/renderer/components/+workloads-pods/pod-container-port.tsx b/src/renderer/components/+workloads-pods/pod-container-port.tsx
index a80fb48911..386554bec3 100644
--- a/src/renderer/components/+workloads-pods/pod-container-port.tsx
+++ b/src/renderer/components/+workloads-pods/pod-container-port.tsx
@@ -27,7 +27,7 @@ import portForwardStoreInjectable from "../../port-forward/port-forward-store/po
 import portForwardDialogModelInjectable from "../../port-forward/port-forward-dialog-model/port-forward-dialog-model.injectable";
 import logger from "../../../common/logger";
 
-interface Props {
+export interface PodContainerPortProps {
   pod: Pod;
   port: {
     name?: string;
@@ -42,13 +42,13 @@ interface Dependencies {
 }
 
 @observer
-class NonInjectedPodContainerPort extends React.Component<Props & Dependencies> {
+class NonInjectedPodContainerPort extends React.Component<PodContainerPortProps & Dependencies> {
   @observable waiting = false;
   @observable forwardPort = 0;
   @observable isPortForwarded = false;
   @observable isActive = false;
 
-  constructor(props: Props & Dependencies) {
+  constructor(props: PodContainerPortProps & Dependencies) {
     super(props);
     makeObservable(this);
     this.checkExistingPortForwarding();
@@ -192,7 +192,7 @@ class NonInjectedPodContainerPort extends React.Component<Props & Dependencies>
   }
 }
 
-export const PodContainerPort = withInjectables<Dependencies, Props>(
+export const PodContainerPort = withInjectables<Dependencies, PodContainerPortProps>(
   NonInjectedPodContainerPort,
 
   {
diff --git a/src/renderer/components/+workloads-pods/pod-details-affinities.tsx b/src/renderer/components/+workloads-pods/pod-details-affinities.tsx
index d0a5de60f0..4b51771d57 100644
--- a/src/renderer/components/+workloads-pods/pod-details-affinities.tsx
+++ b/src/renderer/components/+workloads-pods/pod-details-affinities.tsx
@@ -9,11 +9,11 @@ import { DrawerItem, DrawerParamToggler } from "../drawer";
 import type { DaemonSet, Deployment, Job, Pod, ReplicaSet, StatefulSet } from "../../../common/k8s-api/endpoints";
 import { MonacoEditor } from "../monaco-editor";
 
-interface Props {
+export interface PodDetailsAffinitiesProps {
   workload: Pod | Deployment | DaemonSet | StatefulSet | ReplicaSet | Job;
 }
 
-export class PodDetailsAffinities extends React.Component<Props> {
+export class PodDetailsAffinities extends React.Component<PodDetailsAffinitiesProps> {
   render() {
     const { workload } = this.props;
     const affinitiesNum = workload.getAffinityNumber();
diff --git a/src/renderer/components/+workloads-pods/pod-details-container.tsx b/src/renderer/components/+workloads-pods/pod-details-container.tsx
index 5a81fbaa47..d6af5ba59a 100644
--- a/src/renderer/components/+workloads-pods/pod-details-container.tsx
+++ b/src/renderer/components/+workloads-pods/pod-details-container.tsx
@@ -24,7 +24,7 @@ import { disposeOnUnmount, observer } from "mobx-react";
 import { withInjectables } from "@ogre-tools/injectable-react";
 import portForwardStoreInjectable from "../../port-forward/port-forward-store/port-forward-store.injectable";
 
-interface Props {
+export interface PodDetailsContainerProps {
   pod: Pod;
   container: IPodContainer;
   metrics?: { [key: string]: IMetrics };
@@ -35,7 +35,7 @@ interface Dependencies {
 }
 
 @observer
-class NonInjectedPodDetailsContainer extends React.Component<Props & Dependencies> {
+class NonInjectedPodDetailsContainer extends React.Component<PodDetailsContainerProps & Dependencies> {
 
   componentDidMount() {
     disposeOnUnmount(this, [
@@ -191,7 +191,7 @@ class NonInjectedPodDetailsContainer extends React.Component<Props & Dependencie
   }
 }
 
-export const PodDetailsContainer = withInjectables<Dependencies, Props>(
+export const PodDetailsContainer = withInjectables<Dependencies, PodDetailsContainerProps>(
   NonInjectedPodDetailsContainer,
 
   {
diff --git a/src/renderer/components/+workloads-pods/pod-details-list.tsx b/src/renderer/components/+workloads-pods/pod-details-list.tsx
index 52a2ede8f7..c7679706fd 100644
--- a/src/renderer/components/+workloads-pods/pod-details-list.tsx
+++ b/src/renderer/components/+workloads-pods/pod-details-list.tsx
@@ -27,18 +27,15 @@ enum sortBy {
   memory = "memory",
 }
 
-interface Props extends OptionalProps {
+export interface PodDetailsListProps {
   pods: Pod[];
   owner: KubeObject;
-}
-
-interface OptionalProps {
   maxCpu?: number;
   maxMemory?: number;
 }
 
 @observer
-export class PodDetailsList extends React.Component<Props> {
+export class PodDetailsList extends React.Component<PodDetailsListProps> {
   private metricsWatcher = interval(120, () => {
     podsStore.loadKubeMetrics(this.props.owner.getNs());
   });
diff --git a/src/renderer/components/+workloads-pods/pod-details-secrets.tsx b/src/renderer/components/+workloads-pods/pod-details-secrets.tsx
index 86896ce934..d7affcef66 100644
--- a/src/renderer/components/+workloads-pods/pod-details-secrets.tsx
+++ b/src/renderer/components/+workloads-pods/pod-details-secrets.tsx
@@ -12,12 +12,12 @@ import { disposeOnUnmount, observer } from "mobx-react";
 import { Pod, Secret, secretsApi } from "../../../common/k8s-api/endpoints";
 import { getDetailsUrl } from "../kube-detail-params";
 
-interface Props {
+export interface PodDetailsSecretsProps {
   pod: Pod;
 }
 
 @observer
-export class PodDetailsSecrets extends Component<Props> {
+export class PodDetailsSecrets extends Component<PodDetailsSecretsProps> {
   @observable secrets: Map<string, Secret> = observable.map<string, Secret>();
 
   componentDidMount(): void {
@@ -37,7 +37,7 @@ export class PodDetailsSecrets extends Component<Props> {
     ]);
   }
 
-  constructor(props: Props) {
+  constructor(props: PodDetailsSecretsProps) {
     super(props);
     makeObservable(this);
   }
diff --git a/src/renderer/components/+workloads-pods/pod-details-statuses.tsx b/src/renderer/components/+workloads-pods/pod-details-statuses.tsx
index 056ae41d21..980bdd2628 100644
--- a/src/renderer/components/+workloads-pods/pod-details-statuses.tsx
+++ b/src/renderer/components/+workloads-pods/pod-details-statuses.tsx
@@ -9,11 +9,11 @@ import countBy from "lodash/countBy";
 import kebabCase from "lodash/kebabCase";
 import type { Pod } from "../../../common/k8s-api/endpoints";
 
-interface Props {
+export interface PodDetailsStatusesProps {
   pods: Pod[];
 }
 
-export class PodDetailsStatuses extends React.Component<Props> {
+export class PodDetailsStatuses extends React.Component<PodDetailsStatusesProps> {
   render() {
     const { pods } = this.props;
 
diff --git a/src/renderer/components/+workloads-pods/pod-details-tolerations.tsx b/src/renderer/components/+workloads-pods/pod-details-tolerations.tsx
index dec8d7d79c..176ed86dcc 100644
--- a/src/renderer/components/+workloads-pods/pod-details-tolerations.tsx
+++ b/src/renderer/components/+workloads-pods/pod-details-tolerations.tsx
@@ -9,11 +9,11 @@ import { DrawerParamToggler, DrawerItem } from "../drawer";
 import type  { WorkloadKubeObject } from "../../../common/k8s-api/workload-kube-object";
 import { PodTolerations } from "./pod-tolerations";
 
-interface Props {
+export interface PodDetailsTolerationsProps {
   workload: WorkloadKubeObject;
 }
 
-export class PodDetailsTolerations extends React.Component<Props> {
+export class PodDetailsTolerations extends React.Component<PodDetailsTolerationsProps> {
   render() {
     const { workload } = this.props;
     const tolerations = workload.getTolerations();
diff --git a/src/renderer/components/+workloads-pods/pod-details.tsx b/src/renderer/components/+workloads-pods/pod-details.tsx
index 2b8b271138..2b592ebe04 100644
--- a/src/renderer/components/+workloads-pods/pod-details.tsx
+++ b/src/renderer/components/+workloads-pods/pod-details.tsx
@@ -29,15 +29,15 @@ import { ClusterMetricsResourceType } from "../../../common/cluster-types";
 import { getDetailsUrl } from "../kube-detail-params";
 import logger from "../../../common/logger";
 
-interface Props extends KubeObjectDetailsProps<Pod> {
+export interface PodDetailsProps extends KubeObjectDetailsProps<Pod> {
 }
 
 @observer
-export class PodDetails extends React.Component<Props> {
+export class PodDetails extends React.Component<PodDetailsProps> {
   @observable metrics: IPodMetrics;
   @observable containerMetrics: IPodMetrics;
 
-  constructor(props: Props) {
+  constructor(props: PodDetailsProps) {
     super(props);
     makeObservable(this);
   }
diff --git a/src/renderer/components/+workloads-pods/pod-tolerations.tsx b/src/renderer/components/+workloads-pods/pod-tolerations.tsx
index c113f495e6..8eb41d8911 100644
--- a/src/renderer/components/+workloads-pods/pod-tolerations.tsx
+++ b/src/renderer/components/+workloads-pods/pod-tolerations.tsx
@@ -10,7 +10,7 @@ import uniqueId from "lodash/uniqueId";
 import type { IToleration } from "../../../common/k8s-api/workload-kube-object";
 import { Table, TableCell, TableHead, TableRow } from "../table";
 
-interface Props {
+export interface PodTolerationsProps {
   tolerations: IToleration[];
 }
 
@@ -40,7 +40,7 @@ const getTableRow = (toleration: IToleration) => {
   );
 };
 
-export function PodTolerations({ tolerations }: Props) {
+export function PodTolerations({ tolerations }: PodTolerationsProps) {
   return (
     <Table
       tableId="workloads_pod_tolerations"
diff --git a/src/renderer/components/+workloads-pods/pods.tsx b/src/renderer/components/+workloads-pods/pods.tsx
index 9e8616e04b..2780a5f9d7 100644
--- a/src/renderer/components/+workloads-pods/pods.tsx
+++ b/src/renderer/components/+workloads-pods/pods.tsx
@@ -36,11 +36,11 @@ enum columnId {
   status = "status",
 }
 
-interface Props extends RouteComponentProps<PodsRouteParams> {
+export interface PodsProps extends RouteComponentProps<PodsRouteParams> {
 }
 
 @observer
-export class Pods extends React.Component<Props> {
+export class Pods extends React.Component<PodsProps> {
   renderContainersStatus(pod: Pod) {
     return pod.getContainerStatuses().map(containerStatus => {
       const { name, state, ready } = containerStatus;
diff --git a/src/renderer/components/+workloads-replicasets/replicaset-details.tsx b/src/renderer/components/+workloads-replicasets/replicaset-details.tsx
index a5a46ac979..997f8c27f5 100644
--- a/src/renderer/components/+workloads-replicasets/replicaset-details.tsx
+++ b/src/renderer/components/+workloads-replicasets/replicaset-details.tsx
@@ -30,7 +30,7 @@ import { withInjectables } from "@ogre-tools/injectable-react";
 import kubeWatchApiInjectable
   from "../../kube-watch-api/kube-watch-api.injectable";
 
-interface Props extends KubeObjectDetailsProps<ReplicaSet> {
+export interface ReplicaSetDetailsProps extends KubeObjectDetailsProps<ReplicaSet> {
 }
 
 interface Dependencies {
@@ -38,10 +38,10 @@ interface Dependencies {
 }
 
 @observer
-class NonInjectedReplicaSetDetails extends React.Component<Props & Dependencies> {
+class NonInjectedReplicaSetDetails extends React.Component<ReplicaSetDetailsProps & Dependencies> {
   @observable metrics: IPodMetrics = null;
 
-  constructor(props: Props & Dependencies) {
+  constructor(props: ReplicaSetDetailsProps & Dependencies) {
     super(props);
     makeObservable(this);
   }
@@ -134,7 +134,7 @@ class NonInjectedReplicaSetDetails extends React.Component<Props & Dependencies>
   }
 }
 
-export const ReplicaSetDetails = withInjectables<Dependencies, Props>(
+export const ReplicaSetDetails = withInjectables<Dependencies, ReplicaSetDetailsProps>(
   NonInjectedReplicaSetDetails,
 
   {
diff --git a/src/renderer/components/+workloads-replicasets/replicaset-scale-dialog.tsx b/src/renderer/components/+workloads-replicasets/replicaset-scale-dialog.tsx
index a9b8865d0c..b601e69f89 100644
--- a/src/renderer/components/+workloads-replicasets/replicaset-scale-dialog.tsx
+++ b/src/renderer/components/+workloads-replicasets/replicaset-scale-dialog.tsx
@@ -16,7 +16,7 @@ import { Notifications } from "../notifications";
 import { cssNames } from "../../utils";
 import { ReplicaSet, ReplicaSetApi, replicaSetApi } from "../../../common/k8s-api/endpoints/replica-set.api";
 
-interface Props extends Partial<DialogProps> {
+export interface ReplicaSetScaleDialogProps extends Partial<DialogProps> {
   replicaSetApi: ReplicaSetApi;
 }
 
@@ -26,7 +26,7 @@ const dialogState = observable.object({
 });
 
 @observer
-export class ReplicaSetScaleDialog extends Component<Props> {
+export class ReplicaSetScaleDialog extends Component<ReplicaSetScaleDialogProps> {
   static defaultProps = {
     replicaSetApi,
   };
@@ -35,7 +35,7 @@ export class ReplicaSetScaleDialog extends Component<Props> {
   @observable currentReplicas = 0;
   @observable desiredReplicas = 0;
 
-  constructor(props: Props) {
+  constructor(props: ReplicaSetScaleDialogProps) {
     super(props);
     makeObservable(this);
   }
diff --git a/src/renderer/components/+workloads-replicasets/replicasets.tsx b/src/renderer/components/+workloads-replicasets/replicasets.tsx
index be21604719..1a8b68898f 100644
--- a/src/renderer/components/+workloads-replicasets/replicasets.tsx
+++ b/src/renderer/components/+workloads-replicasets/replicasets.tsx
@@ -23,11 +23,11 @@ enum columnId {
   age = "age",
 }
 
-interface Props extends RouteComponentProps<ReplicaSetsRouteParams> {
+export interface ReplicaSetsProps extends RouteComponentProps<ReplicaSetsRouteParams> {
 }
 
 @observer
-export class ReplicaSets extends React.Component<Props> {
+export class ReplicaSets extends React.Component<ReplicaSetsProps> {
   render() {
     return (
       <KubeObjectListLayout
diff --git a/src/renderer/components/+workloads-statefulsets/statefulset-details.tsx b/src/renderer/components/+workloads-statefulsets/statefulset-details.tsx
index 91ddf239af..2a9aad08fd 100644
--- a/src/renderer/components/+workloads-statefulsets/statefulset-details.tsx
+++ b/src/renderer/components/+workloads-statefulsets/statefulset-details.tsx
@@ -31,7 +31,7 @@ import { withInjectables } from "@ogre-tools/injectable-react";
 import kubeWatchApiInjectable
   from "../../kube-watch-api/kube-watch-api.injectable";
 
-interface Props extends KubeObjectDetailsProps<StatefulSet> {
+export interface StatefulSetDetailsProps extends KubeObjectDetailsProps<StatefulSet> {
 }
 
 interface Dependencies {
@@ -39,10 +39,10 @@ interface Dependencies {
 }
 
 @observer
-class NonInjectedStatefulSetDetails extends React.Component<Props & Dependencies> {
+class NonInjectedStatefulSetDetails extends React.Component<StatefulSetDetailsProps & Dependencies> {
   @observable metrics: IPodMetrics = null;
 
-  constructor(props: Props & Dependencies) {
+  constructor(props: StatefulSetDetailsProps & Dependencies) {
     super(props);
     makeObservable(this);
   }
@@ -131,7 +131,7 @@ class NonInjectedStatefulSetDetails extends React.Component<Props & Dependencies
   }
 }
 
-export const StatefulSetDetails = withInjectables<Dependencies, Props>(
+export const StatefulSetDetails = withInjectables<Dependencies, StatefulSetDetailsProps>(
   NonInjectedStatefulSetDetails,
 
   {
diff --git a/src/renderer/components/+workloads-statefulsets/statefulset-scale-dialog.tsx b/src/renderer/components/+workloads-statefulsets/statefulset-scale-dialog.tsx
index 66bf37dc8e..2f9d8067ff 100644
--- a/src/renderer/components/+workloads-statefulsets/statefulset-scale-dialog.tsx
+++ b/src/renderer/components/+workloads-statefulsets/statefulset-scale-dialog.tsx
@@ -16,7 +16,7 @@ import { Slider } from "../slider";
 import { Notifications } from "../notifications";
 import { cssNames } from "../../utils";
 
-interface Props extends Partial<DialogProps> {
+export interface StatefulSetScaleDialogProps extends Partial<DialogProps> {
   statefulSetApi: StatefulSetApi;
 }
 
@@ -26,7 +26,7 @@ const dialogState = observable.object({
 });
 
 @observer
-export class StatefulSetScaleDialog extends Component<Props> {
+export class StatefulSetScaleDialog extends Component<StatefulSetScaleDialogProps> {
   static defaultProps = {
     statefulSetApi,
   };
@@ -34,7 +34,7 @@ export class StatefulSetScaleDialog extends Component<Props> {
   @observable currentReplicas = 0;
   @observable desiredReplicas = 0;
 
-  constructor(props: Props) {
+  constructor(props: StatefulSetScaleDialogProps) {
     super(props);
     makeObservable(this);
   }
diff --git a/src/renderer/components/+workloads-statefulsets/statefulsets.tsx b/src/renderer/components/+workloads-statefulsets/statefulsets.tsx
index d7aa9e847f..135e563c4a 100644
--- a/src/renderer/components/+workloads-statefulsets/statefulsets.tsx
+++ b/src/renderer/components/+workloads-statefulsets/statefulsets.tsx
@@ -24,11 +24,11 @@ enum columnId {
   replicas = "replicas",
 }
 
-interface Props extends RouteComponentProps<StatefulSetsRouteParams> {
+export interface StatefulSetsProps extends RouteComponentProps<StatefulSetsRouteParams> {
 }
 
 @observer
-export class StatefulSets extends React.Component<Props> {
+export class StatefulSets extends React.Component<StatefulSetsProps> {
   renderPods(statefulSet: StatefulSet) {
     const { readyReplicas, currentReplicas } = statefulSet.status;
 
diff --git a/src/renderer/components/chart/bar-chart.tsx b/src/renderer/components/chart/bar-chart.tsx
index d906b7b1c9..f53bed6e51 100644
--- a/src/renderer/components/chart/bar-chart.tsx
+++ b/src/renderer/components/chart/bar-chart.tsx
@@ -15,18 +15,18 @@ import { ZebraStripes } from "./zebra-stripes.plugin";
 import { ThemeStore } from "../../theme.store";
 import { NoMetrics } from "../resource-metrics/no-metrics";
 
-interface Props extends ChartProps {
+export interface BarChartProps extends ChartProps {
   name?: string;
   timeLabelStep?: number;  // Minute labels appearance step
 }
 
-const defaultProps: Partial<Props> = {
+const defaultProps: Partial<BarChartProps> = {
   timeLabelStep: 10,
   plugins: [ZebraStripes],
 };
 
 @observer
-export class BarChart extends React.Component<Props> {
+export class BarChart extends React.Component<BarChartProps> {
   static defaultProps = defaultProps as object;
 
   render() {
diff --git a/src/renderer/components/chart/pie-chart.tsx b/src/renderer/components/chart/pie-chart.tsx
index 3c5f0a9e19..bc6cd318f3 100644
--- a/src/renderer/components/chart/pie-chart.tsx
+++ b/src/renderer/components/chart/pie-chart.tsx
@@ -11,11 +11,11 @@ import { Chart, ChartProps } from "./chart";
 import { cssNames } from "../../utils";
 import { ThemeStore } from "../../theme.store";
 
-interface Props extends ChartProps {
+export interface PieChartProps extends ChartProps {
 }
 
 @observer
-export class PieChart extends React.Component<Props> {
+export class PieChart extends React.Component<PieChartProps> {
   render() {
     const { data, className, options, ...chartProps } = this.props;
     const { contentColor } = ThemeStore.getInstance().activeTheme.colors;
diff --git a/src/renderer/components/cluster-manager/cluster-status.tsx b/src/renderer/components/cluster-manager/cluster-status.tsx
index 408f45b1bb..e2e002c8b7 100644
--- a/src/renderer/components/cluster-manager/cluster-status.tsx
+++ b/src/renderer/components/cluster-manager/cluster-status.tsx
@@ -20,17 +20,17 @@ import type { KubeAuthUpdate } from "../../../common/cluster-types";
 import { catalogEntityRegistry } from "../../api/catalog-entity-registry";
 import { requestClusterActivation } from "../../ipc";
 
-interface Props {
+export interface ClusterStatusProps {
   className?: IClassName;
   cluster: Cluster;
 }
 
 @observer
-export class ClusterStatus extends React.Component<Props> {
+export class ClusterStatus extends React.Component<ClusterStatusProps> {
   @observable authOutput: KubeAuthUpdate[] = [];
   @observable isReconnecting = false;
 
-  constructor(props: Props) {
+  constructor(props: ClusterStatusProps) {
     super(props);
     makeObservable(this);
   }
diff --git a/src/renderer/components/cluster-manager/cluster-view.tsx b/src/renderer/components/cluster-manager/cluster-view.tsx
index 5187866ef3..7f4c50ddff 100644
--- a/src/renderer/components/cluster-manager/cluster-view.tsx
+++ b/src/renderer/components/cluster-manager/cluster-view.tsx
@@ -17,14 +17,14 @@ import { navigate } from "../../navigation";
 import { catalogURL, ClusterViewRouteParams } from "../../../common/routes";
 import { requestClusterActivation } from "../../ipc";
 
-interface Props extends RouteComponentProps<ClusterViewRouteParams> {
+export interface ClusterViewProps extends RouteComponentProps<ClusterViewRouteParams> {
 }
 
 @observer
-export class ClusterView extends React.Component<Props> {
+export class ClusterView extends React.Component<ClusterViewProps> {
   private store = ClusterStore.getInstance();
 
-  constructor(props: Props) {
+  constructor(props: ClusterViewProps) {
     super(props);
     makeObservable(this);
   }
diff --git a/src/renderer/components/cluster-settings/components/cluster-accessible-namespaces.tsx b/src/renderer/components/cluster-settings/components/cluster-accessible-namespaces.tsx
index 5948ba8b55..8dc11d622d 100644
--- a/src/renderer/components/cluster-settings/components/cluster-accessible-namespaces.tsx
+++ b/src/renderer/components/cluster-settings/components/cluster-accessible-namespaces.tsx
@@ -11,15 +11,15 @@ import { EditableList } from "../../editable-list";
 import { observable, makeObservable } from "mobx";
 import { systemName } from "../../input/input_validators";
 
-interface Props {
+export interface ClusterAccessibleNamespacesProps {
   cluster: Cluster;
 }
 
 @observer
-export class ClusterAccessibleNamespaces extends React.Component<Props> {
+export class ClusterAccessibleNamespaces extends React.Component<ClusterAccessibleNamespacesProps> {
   @observable namespaces = new Set(this.props.cluster.accessibleNamespaces);
 
-  constructor(props: Props) {
+  constructor(props: ClusterAccessibleNamespacesProps) {
     super(props);
     makeObservable(this);
   }
diff --git a/src/renderer/components/cluster-settings/components/cluster-icon-settings.tsx b/src/renderer/components/cluster-settings/components/cluster-icon-settings.tsx
index 9c7834807e..ec4e3c3595 100644
--- a/src/renderer/components/cluster-settings/components/cluster-icon-settings.tsx
+++ b/src/renderer/components/cluster-settings/components/cluster-icon-settings.tsx
@@ -18,13 +18,13 @@ enum GeneralInputStatus {
   ERROR = "error",
 }
 
-interface Props {
+export interface ClusterIconSettingProps {
   cluster: Cluster;
   entity: KubernetesCluster;
 }
 
 @observer
-export class ClusterIconSetting extends React.Component<Props> {
+export class ClusterIconSetting extends React.Component<ClusterIconSettingProps> {
   @observable status = GeneralInputStatus.CLEAN;
   @observable errorText?: string;
 
diff --git a/src/renderer/components/cluster-settings/components/cluster-kubeconfig.tsx b/src/renderer/components/cluster-settings/components/cluster-kubeconfig.tsx
index 0d91a3f861..b6b6db3b4b 100644
--- a/src/renderer/components/cluster-settings/components/cluster-kubeconfig.tsx
+++ b/src/renderer/components/cluster-settings/components/cluster-kubeconfig.tsx
@@ -11,12 +11,12 @@ import { boundMethod } from "../../../../common/utils";
 import { shell } from "electron";
 import { Notice } from "../../+extensions/notice";
 
-interface Props {
+export interface ClusterKubeconfigProps {
   cluster: Cluster;
 }
 
 @observer
-export class ClusterKubeconfig extends React.Component<Props> {
+export class ClusterKubeconfig extends React.Component<ClusterKubeconfigProps> {
 
   @boundMethod
   openKubeconfig() {
diff --git a/src/renderer/components/cluster-settings/components/cluster-local-terminal-settings.tsx b/src/renderer/components/cluster-settings/components/cluster-local-terminal-settings.tsx
index f941b2cbdf..43c810a593 100644
--- a/src/renderer/components/cluster-settings/components/cluster-local-terminal-settings.tsx
+++ b/src/renderer/components/cluster-settings/components/cluster-local-terminal-settings.tsx
@@ -18,7 +18,7 @@ import type { Stats } from "fs";
 import logger from "../../../../common/logger";
 import { lowerFirst } from "lodash";
 
-interface Props {
+export interface ClusterLocalTerminalSettingProps {
   cluster: Cluster;
 }
 
@@ -80,7 +80,7 @@ async function validateDirectory(dir: string): Promise<string | false> {
   }
 }
 
-export const ClusterLocalTerminalSetting = observer(({ cluster }: Props) => {
+export const ClusterLocalTerminalSetting = observer(({ cluster }: ClusterLocalTerminalSettingProps) => {
   if (!cluster) {
     return null;
   }
diff --git a/src/renderer/components/cluster-settings/components/cluster-metrics-setting.tsx b/src/renderer/components/cluster-settings/components/cluster-metrics-setting.tsx
index 4416a449ac..f67b233372 100644
--- a/src/renderer/components/cluster-settings/components/cluster-metrics-setting.tsx
+++ b/src/renderer/components/cluster-settings/components/cluster-metrics-setting.tsx
@@ -13,15 +13,15 @@ import type { Cluster } from "../../../../common/cluster/cluster";
 import { observable, reaction, makeObservable } from "mobx";
 import { ClusterMetricsResourceType } from "../../../../common/cluster-types";
 
-interface Props {
+export interface ClusterMetricsSettingProps {
   cluster: Cluster;
 }
 
 @observer
-export class ClusterMetricsSetting extends React.Component<Props> {
+export class ClusterMetricsSetting extends React.Component<ClusterMetricsSettingProps> {
   @observable hiddenMetrics = observable.set<string>();
 
-  constructor(props: Props) {
+  constructor(props: ClusterMetricsSettingProps) {
     super(props);
     makeObservable(this);
   }
diff --git a/src/renderer/components/cluster-settings/components/cluster-name-setting.tsx b/src/renderer/components/cluster-settings/components/cluster-name-setting.tsx
index 4802d79d41..bac6741268 100644
--- a/src/renderer/components/cluster-settings/components/cluster-name-setting.tsx
+++ b/src/renderer/components/cluster-settings/components/cluster-name-setting.tsx
@@ -12,16 +12,16 @@ import { SubTitle } from "../../layout/sub-title";
 import { isRequired } from "../../input/input_validators";
 import type { KubernetesCluster } from "../../../../common/catalog-entities";
 
-interface Props {
+export interface ClusterNameSettingProps {
   cluster: Cluster;
   entity: KubernetesCluster;
 }
 
 @observer
-export class ClusterNameSetting extends React.Component<Props> {
+export class ClusterNameSetting extends React.Component<ClusterNameSettingProps> {
   @observable name = "";
 
-  constructor(props: Props) {
+  constructor(props: ClusterNameSettingProps) {
     super(props);
     makeObservable(this);
   }
diff --git a/src/renderer/components/cluster-settings/components/cluster-node-shell-setting.tsx b/src/renderer/components/cluster-settings/components/cluster-node-shell-setting.tsx
index b74d8e9479..f21b725226 100644
--- a/src/renderer/components/cluster-settings/components/cluster-node-shell-setting.tsx
+++ b/src/renderer/components/cluster-settings/components/cluster-node-shell-setting.tsx
@@ -12,16 +12,16 @@ import { observer } from "mobx-react";
 import { Icon } from "../../icon/icon";
 import { initialNodeShellImage } from "../../../../common/cluster-types";
 
-interface Props {
+export interface ClusterNodeShellSettingProps {
   cluster: Cluster;
 }
 
 @observer
-export class ClusterNodeShellSetting extends React.Component<Props> {
+export class ClusterNodeShellSetting extends React.Component<ClusterNodeShellSettingProps> {
   @observable nodeShellImage = this.props.cluster.preferences?.nodeShellImage || "";
   @observable imagePullSecret = this.props.cluster.preferences?.imagePullSecret || "";
 
-  constructor(props: Props) {
+  constructor(props: ClusterNodeShellSettingProps) {
     super(props);
     makeObservable(this);
   }
diff --git a/src/renderer/components/cluster-settings/components/cluster-prometheus-setting.tsx b/src/renderer/components/cluster-settings/components/cluster-prometheus-setting.tsx
index 696b2756e4..a5a390cb79 100644
--- a/src/renderer/components/cluster-settings/components/cluster-prometheus-setting.tsx
+++ b/src/renderer/components/cluster-settings/components/cluster-prometheus-setting.tsx
@@ -14,12 +14,12 @@ import { productName } from "../../../../common/vars";
 import { MetricProviderInfo, metricsApi } from "../../../../common/k8s-api/endpoints/metrics.api";
 import { Spinner } from "../../spinner";
 
-interface Props {
+export interface ClusterPrometheusSettingProps {
   cluster: Cluster;
 }
 
 @observer
-export class ClusterPrometheusSetting extends React.Component<Props> {
+export class ClusterPrometheusSetting extends React.Component<ClusterPrometheusSettingProps> {
   @observable path = "";
   @observable provider = "";
   @observable loading = true;
@@ -32,7 +32,7 @@ export class ClusterPrometheusSetting extends React.Component<Props> {
     ];
   }
 
-  constructor(props: Props) {
+  constructor(props: ClusterPrometheusSettingProps) {
     super(props);
     makeObservable(this);
   }
diff --git a/src/renderer/components/cluster-settings/components/cluster-proxy-setting.tsx b/src/renderer/components/cluster-settings/components/cluster-proxy-setting.tsx
index a156c0afe8..bdb6747748 100644
--- a/src/renderer/components/cluster-settings/components/cluster-proxy-setting.tsx
+++ b/src/renderer/components/cluster-settings/components/cluster-proxy-setting.tsx
@@ -10,15 +10,15 @@ import type { Cluster } from "../../../../common/cluster/cluster";
 import { Input, InputValidators } from "../../input";
 import { SubTitle } from "../../layout/sub-title";
 
-interface Props {
+export interface ClusterProxySettingProps {
   cluster: Cluster;
 }
 
 @observer
-export class ClusterProxySetting extends React.Component<Props> {
+export class ClusterProxySetting extends React.Component<ClusterProxySettingProps> {
   @observable proxy = "";
 
-  constructor(props: Props) {
+  constructor(props: ClusterProxySettingProps) {
     super(props);
     makeObservable(this);
   }
diff --git a/src/renderer/components/cluster-settings/components/cluster-show-metrics.tsx b/src/renderer/components/cluster-settings/components/cluster-show-metrics.tsx
index 235966aa59..29bfcd2e21 100644
--- a/src/renderer/components/cluster-settings/components/cluster-show-metrics.tsx
+++ b/src/renderer/components/cluster-settings/components/cluster-show-metrics.tsx
@@ -11,15 +11,15 @@ import { Badge } from "../../badge/badge";
 import { Icon } from "../../icon/icon";
 import { Notice } from "../../+extensions/notice";
 
-interface Props {
+export interface ShowMetricsSettingProps {
   cluster: Cluster;
 }
 
 @observer
-export class ShowMetricsSetting extends React.Component<Props> {
+export class ShowMetricsSetting extends React.Component<ShowMetricsSettingProps> {
   @observable hiddenMetrics = observable.set<string>();
 
-  constructor(props: Props) {
+  constructor(props: ShowMetricsSettingProps) {
     super(props);
     makeObservable(this);
   }
diff --git a/src/renderer/components/delete-cluster-dialog/delete-cluster-dialog.tsx b/src/renderer/components/delete-cluster-dialog/delete-cluster-dialog.tsx
index f0733eb2c4..a49dcde13e 100644
--- a/src/renderer/components/delete-cluster-dialog/delete-cluster-dialog.tsx
+++ b/src/renderer/components/delete-cluster-dialog/delete-cluster-dialog.tsx
@@ -21,24 +21,24 @@ import { Select } from "../select";
 import { Checkbox } from "../checkbox";
 import { requestClearClusterAsDeleting, requestDeleteCluster, requestSetClusterAsDeleting } from "../../ipc";
 
-type DialogState = {
+interface DialogState {
   isOpen: boolean;
   config?: KubeConfig;
   cluster?: Cluster;
-};
+}
 
 const dialogState: DialogState = observable({
   isOpen: false,
 });
 
-type Props = {};
+export interface DeleteClusterDialogProps {}
 
 @observer
-export class DeleteClusterDialog extends React.Component {
+export class DeleteClusterDialog extends React.Component<DeleteClusterDialogProps> {
   @observable showContextSwitch = false;
   @observable newCurrentContext = "";
 
-  constructor(props: Props) {
+  constructor(props: DeleteClusterDialogProps) {
     super(props);
     makeObservable(this);
   }
diff --git a/src/renderer/components/dialog/logs-dialog.tsx b/src/renderer/components/dialog/logs-dialog.tsx
index 57abcf6618..a46cdf0a78 100644
--- a/src/renderer/components/dialog/logs-dialog.tsx
+++ b/src/renderer/components/dialog/logs-dialog.tsx
@@ -15,12 +15,12 @@ import { clipboard } from "electron";
 
 // todo: make as external BrowserWindow (?)
 
-interface Props extends DialogProps {
+export interface LogsDialogProps extends DialogProps {
   title: string;
   logs: string;
 }
 
-export class LogsDialog extends React.Component<Props> {
+export class LogsDialog extends React.Component<LogsDialogProps> {
   public logsElem: HTMLElement;
 
   copyToClipboard = () => {
diff --git a/src/renderer/components/dock/create-resource/view.tsx b/src/renderer/components/dock/create-resource/view.tsx
index 5c27c0e06d..d30d819851 100644
--- a/src/renderer/components/dock/create-resource/view.tsx
+++ b/src/renderer/components/dock/create-resource/view.tsx
@@ -25,7 +25,7 @@ import createResourceTabStoreInjectable from "./store.injectable";
 import createResourceTemplatesInjectable from "./create-resource-templates.injectable";
 import { Spinner } from "../../spinner";
 
-interface Props {
+export interface CreateResourceProps {
   tab: DockTab;
 }
 
@@ -35,10 +35,10 @@ interface Dependencies {
 }
 
 @observer
-class NonInjectedCreateResource extends React.Component<Props & Dependencies> {
+class NonInjectedCreateResource extends React.Component<CreateResourceProps & Dependencies> {
   @observable error = "";
 
-  constructor(props: Props & Dependencies) {
+  constructor(props: CreateResourceProps & Dependencies) {
     super(props);
     makeObservable(this);
   }
@@ -143,7 +143,7 @@ class NonInjectedCreateResource extends React.Component<Props & Dependencies> {
   }
 }
 
-export const CreateResource = withInjectables<Dependencies, Props>(NonInjectedCreateResource, {
+export const CreateResource = withInjectables<Dependencies, CreateResourceProps>(NonInjectedCreateResource, {
   getPlaceholder: () => <Spinner center />,
 
   getProps: async (di, props) => ({
diff --git a/src/renderer/components/dock/dock-tabs.tsx b/src/renderer/components/dock/dock-tabs.tsx
index e3d87fe84b..f988ae426c 100644
--- a/src/renderer/components/dock/dock-tabs.tsx
+++ b/src/renderer/components/dock/dock-tabs.tsx
@@ -12,14 +12,14 @@ import type { DockTab as DockTabModel } from "./dock/store";
 import { TabKind } from "./dock/store";
 import { TerminalTab } from "./terminal/dock-tab";
 
-interface Props {
+export interface DockTabsProps {
   tabs: DockTabModel[];
   autoFocus: boolean;
   selectedTab: DockTabModel;
   onChangeTab: (tab: DockTabModel) => void;
 }
 
-export const DockTabs = ({ tabs, autoFocus, selectedTab, onChangeTab }: Props) => {
+export const DockTabs = ({ tabs, autoFocus, selectedTab, onChangeTab }: DockTabsProps) => {
   const renderTab = (tab?: DockTabModel) => {
     if (!tab) {
       return null;
diff --git a/src/renderer/components/dock/dock.tsx b/src/renderer/components/dock/dock.tsx
index 049c3268c9..ca61b3ba93 100644
--- a/src/renderer/components/dock/dock.tsx
+++ b/src/renderer/components/dock/dock.tsx
@@ -27,7 +27,7 @@ import dockStoreInjectable from "./dock/store.injectable";
 import createTerminalTabInjectable from "./terminal/create-terminal-tab.injectable";
 import { ErrorBoundary } from "../error-boundary";
 
-interface Props {
+export interface DockProps {
   className?: string;
 }
 
@@ -38,7 +38,7 @@ interface Dependencies {
 }
 
 @observer
-class NonInjectedDock extends React.Component<Props & Dependencies> {
+class NonInjectedDock extends React.Component<DockProps & Dependencies> {
   private element = React.createRef<HTMLDivElement>();
 
   componentDidMount() {
@@ -169,7 +169,7 @@ class NonInjectedDock extends React.Component<Props & Dependencies> {
   }
 }
 
-export const Dock = withInjectables<Dependencies, Props>(
+export const Dock = withInjectables<Dependencies, DockProps>(
   NonInjectedDock,
 
   {
diff --git a/src/renderer/components/dock/edit-resource/view.tsx b/src/renderer/components/dock/edit-resource/view.tsx
index aa23af9cea..61d2ffa2ef 100644
--- a/src/renderer/components/dock/edit-resource/view.tsx
+++ b/src/renderer/components/dock/edit-resource/view.tsx
@@ -20,7 +20,7 @@ import editResourceTabStoreInjectable from "./store.injectable";
 import { noop } from "../../../utils";
 import closeDockTabInjectable from "../dock/close-dock-tab.injectable";
 
-interface Props {
+export interface EditResourceProps {
   tab: DockTab;
 }
 
@@ -30,10 +30,10 @@ interface Dependencies {
 }
 
 @observer
-class NonInjectedEditResource extends React.Component<Props & Dependencies> {
+class NonInjectedEditResource extends React.Component<EditResourceProps & Dependencies> {
   @observable error = "";
 
-  constructor(props: Props & Dependencies) {
+  constructor(props: EditResourceProps & Dependencies) {
     super(props);
     makeObservable(this);
   }
@@ -153,7 +153,7 @@ class NonInjectedEditResource extends React.Component<Props & Dependencies> {
   }
 }
 
-export const EditResource = withInjectables<Dependencies, Props>(NonInjectedEditResource, {
+export const EditResource = withInjectables<Dependencies, EditResourceProps>(NonInjectedEditResource, {
   getProps: (di, props) => ({
     editResourceStore: di.inject(editResourceTabStoreInjectable),
     closeTab: di.inject(closeDockTabInjectable),
diff --git a/src/renderer/components/dock/info-panel.tsx b/src/renderer/components/dock/info-panel.tsx
index f075b3c438..28d68e1f39 100644
--- a/src/renderer/components/dock/info-panel.tsx
+++ b/src/renderer/components/dock/info-panel.tsx
@@ -17,12 +17,12 @@ import { Notifications } from "../notifications";
 import { withInjectables } from "@ogre-tools/injectable-react";
 import dockStoreInjectable from "./dock/store.injectable";
 
-interface Props extends OptionalProps {
+export interface InfoPanelProps extends OptionalProps {
   tabId: TabId;
   submit?: () => Promise<ReactNode | string | void>;
 }
 
-interface OptionalProps {
+export interface OptionalProps {
   className?: string;
   error?: string;
   controls?: ReactNode;
@@ -41,7 +41,7 @@ interface Dependencies {
 }
 
 @observer
-class NonInjectedInfoPanel extends Component<Props & Dependencies> {
+class NonInjectedInfoPanel extends Component<InfoPanelProps & Dependencies> {
   static defaultProps: OptionalProps = {
     submitLabel: "Submit",
     submittingMessage: "Submitting..",
@@ -55,7 +55,7 @@ class NonInjectedInfoPanel extends Component<Props & Dependencies> {
   @observable error = "";
   @observable waiting = false;
 
-  constructor(props: Props & Dependencies) {
+  constructor(props: InfoPanelProps & Dependencies) {
     super(props);
     makeObservable(this);
   }
@@ -150,7 +150,7 @@ class NonInjectedInfoPanel extends Component<Props & Dependencies> {
   }
 }
 
-export const InfoPanel = withInjectables<Dependencies, Props>(
+export const InfoPanel = withInjectables<Dependencies, InfoPanelProps>(
   NonInjectedInfoPanel,
 
   {
diff --git a/src/renderer/components/dock/install-chart/view.tsx b/src/renderer/components/dock/install-chart/view.tsx
index a93bbebd02..897f15d450 100644
--- a/src/renderer/components/dock/install-chart/view.tsx
+++ b/src/renderer/components/dock/install-chart/view.tsx
@@ -30,7 +30,7 @@ import dockStoreInjectable from "../dock/store.injectable";
 import createReleaseInjectable from "../../+helm-releases/create-release/create-release.injectable";
 import { Notifications } from "../../notifications";
 
-interface Props {
+export interface InstallCharProps {
   tab: DockTab;
 }
 
@@ -41,11 +41,11 @@ interface Dependencies {
 }
 
 @observer
-class NonInjectedInstallChart extends Component<Props & Dependencies> {
+class NonInjectedInstallChart extends Component<InstallCharProps & Dependencies> {
   @observable error = "";
   @observable showNotes = false;
 
-  constructor(props: Props & Dependencies) {
+  constructor(props: InstallCharProps & Dependencies) {
     super(props);
     makeObservable(this);
   }
@@ -218,7 +218,7 @@ class NonInjectedInstallChart extends Component<Props & Dependencies> {
   }
 }
 
-export const InstallChart = withInjectables<Dependencies, Props>(
+export const InstallChart = withInjectables<Dependencies, InstallCharProps>(
   NonInjectedInstallChart,
 
   {
diff --git a/src/renderer/components/dock/terminal/dock-tab.tsx b/src/renderer/components/dock/terminal/dock-tab.tsx
index 5538ff5c23..dda2a37aca 100644
--- a/src/renderer/components/dock/terminal/dock-tab.tsx
+++ b/src/renderer/components/dock/terminal/dock-tab.tsx
@@ -16,7 +16,7 @@ import { withInjectables } from "@ogre-tools/injectable-react";
 import dockStoreInjectable from "../dock/store.injectable";
 import terminalStoreInjectable from "./store.injectable";
 
-interface Props extends DockTabProps {
+export interface TerminalTabProps extends DockTabProps {
 }
 
 interface Dependencies {
@@ -25,7 +25,7 @@ interface Dependencies {
 }
 
 @observer
-class NonInjectedTerminalTab extends React.Component<Props & Dependencies> {
+class NonInjectedTerminalTab extends React.Component<TerminalTabProps & Dependencies> {
   componentDidMount() {
     reaction(() => this.isDisconnected === true, () => {
       this.props.dockStore.closeTab(this.tabId);
@@ -72,7 +72,7 @@ class NonInjectedTerminalTab extends React.Component<Props & Dependencies> {
   }
 }
 
-export const TerminalTab = withInjectables<Dependencies, Props>(NonInjectedTerminalTab, {
+export const TerminalTab = withInjectables<Dependencies, TerminalTabProps>(NonInjectedTerminalTab, {
   getProps: (di, props) => ({
     dockStore: di.inject(dockStoreInjectable),
     terminalStore: di.inject(terminalStoreInjectable),
diff --git a/src/renderer/components/dock/terminal/view.tsx b/src/renderer/components/dock/terminal/view.tsx
index f1e0279539..ec58a2a83b 100644
--- a/src/renderer/components/dock/terminal/view.tsx
+++ b/src/renderer/components/dock/terminal/view.tsx
@@ -16,7 +16,7 @@ import { withInjectables } from "@ogre-tools/injectable-react";
 import dockStoreInjectable from "../dock/store.injectable";
 import terminalStoreInjectable from "./store.injectable";
 
-interface Props {
+export interface TerminalWindowProps {
   tab: DockTab;
 }
 
@@ -26,7 +26,7 @@ interface Dependencies {
 }
 
 @observer
-class NonInjectedTerminalWindow extends React.Component<Props & Dependencies> {
+class NonInjectedTerminalWindow extends React.Component<TerminalWindowProps & Dependencies> {
   public elem: HTMLElement;
   public terminal: Terminal;
 
@@ -64,7 +64,7 @@ class NonInjectedTerminalWindow extends React.Component<Props & Dependencies> {
   }
 }
 
-export const TerminalWindow = withInjectables<Dependencies, Props>(NonInjectedTerminalWindow, {
+export const TerminalWindow = withInjectables<Dependencies, TerminalWindowProps>(NonInjectedTerminalWindow, {
   getProps: (di, props) => ({
     dockStore: di.inject(dockStoreInjectable),
     terminalStore: di.inject(terminalStoreInjectable),
diff --git a/src/renderer/components/dock/upgrade-chart/view.tsx b/src/renderer/components/dock/upgrade-chart/view.tsx
index 2aaa8bbdaa..4e157726b5 100644
--- a/src/renderer/components/dock/upgrade-chart/view.tsx
+++ b/src/renderer/components/dock/upgrade-chart/view.tsx
@@ -23,7 +23,7 @@ import upgradeChartTabStoreInjectable from "./store.injectable";
 import updateReleaseInjectable from "../../+helm-releases/update-release/update-release.injectable";
 import releasesInjectable from "../../+helm-releases/releases.injectable";
 
-interface Props {
+export interface UpgradeChartProps {
   className?: string;
   tab: DockTab;
 }
@@ -35,12 +35,12 @@ interface Dependencies {
 }
 
 @observer
-export class NonInjectedUpgradeChart extends React.Component<Props & Dependencies> {
+export class NonInjectedUpgradeChart extends React.Component<UpgradeChartProps & Dependencies> {
   @observable error: string;
   @observable versions = observable.array<IChartVersion>();
   @observable version: IChartVersion;
 
-  constructor(props: Props & Dependencies) {
+  constructor(props: UpgradeChartProps & Dependencies) {
     super(props);
     makeObservable(this);
   }
@@ -179,7 +179,7 @@ export class NonInjectedUpgradeChart extends React.Component<Props & Dependencie
   }
 }
 
-export const UpgradeChart = withInjectables<Dependencies, Props>(NonInjectedUpgradeChart, {
+export const UpgradeChart = withInjectables<Dependencies, UpgradeChartProps>(NonInjectedUpgradeChart, {
   getProps: (di, props) => ({
     releases: di.inject(releasesInjectable),
     updateRelease: di.inject(updateReleaseInjectable),
diff --git a/src/renderer/components/editable-list/editable-list.tsx b/src/renderer/components/editable-list/editable-list.tsx
index 44913e3f86..c712d44974 100644
--- a/src/renderer/components/editable-list/editable-list.tsx
+++ b/src/renderer/components/editable-list/editable-list.tsx
@@ -12,7 +12,7 @@ import { Icon } from "../icon";
 import { Input, InputProps, InputValidator } from "../input";
 import { boundMethod } from "../../utils";
 
-export interface Props<T> {
+export interface EditableListProps<T> {
   items: T[];
   add: (newItem: string) => void;
   remove: (info: { oldItem: T; index: number }) => void;
@@ -25,15 +25,15 @@ export interface Props<T> {
   inputTheme?: InputProps["theme"];
 }
 
-const defaultProps: Partial<Props<any>> = {
+const defaultProps: Partial<EditableListProps<any>> = {
   placeholder: "Add new item...",
   renderItem: (item: any, index: number) => <React.Fragment key={index}>{item}</React.Fragment>,
   inputTheme: "round",
 };
 
 @observer
-export class EditableList<T> extends React.Component<Props<T>> {
-  static defaultProps = defaultProps as Props<any>;
+export class EditableList<T> extends React.Component<EditableListProps<T>> {
+  static defaultProps = defaultProps as EditableListProps<any>;
 
   @boundMethod
   onSubmit(val: string, evt: React.KeyboardEvent) {
diff --git a/src/renderer/components/error-boundary/error-boundary.tsx b/src/renderer/components/error-boundary/error-boundary.tsx
index 4c4cca2b51..e4bf9aa63b 100644
--- a/src/renderer/components/error-boundary/error-boundary.tsx
+++ b/src/renderer/components/error-boundary/error-boundary.tsx
@@ -11,7 +11,7 @@ import { Button } from "../button";
 import { navigation } from "../../navigation";
 import { issuesTrackerUrl, slackUrl } from "../../../common/vars";
 
-interface Props {
+export interface ErrorBoundaryProps {
 }
 
 interface State {
@@ -20,7 +20,7 @@ interface State {
 }
 
 @observer
-export class ErrorBoundary extends React.Component<Props, State> {
+export class ErrorBoundary extends React.Component<ErrorBoundaryProps, State> {
   public state: State = {};
 
   componentDidCatch(error: Error, errorInfo: ErrorInfo) {
diff --git a/src/renderer/components/file-picker/file-picker.tsx b/src/renderer/components/file-picker/file-picker.tsx
index 5c622bc6d6..e89f7b75d5 100644
--- a/src/renderer/components/file-picker/file-picker.tsx
+++ b/src/renderer/components/file-picker/file-picker.tsx
@@ -69,9 +69,9 @@ export interface BaseProps {
     onOverTotalSizeLimit?: OverTotalSizeLimitStyle;
 }
 
-export type Props = BaseProps & (MemoryUseProps | FileUploadProps);
+export type FilePickerProps = BaseProps & (MemoryUseProps | FileUploadProps);
 
-const defaultProps: Partial<Props> = {
+const defaultProps: Partial<FilePickerProps> = {
   maxSize: Infinity,
   onOverSizeLimit: OverSizeLimitStyle.REJECT,
   maxTotalSize: Infinity,
@@ -80,13 +80,13 @@ const defaultProps: Partial<Props> = {
 };
 
 @observer
-export class FilePicker extends React.Component<Props> {
+export class FilePicker extends React.Component<FilePickerProps> {
   static defaultProps = defaultProps as Object;
 
   @observable status = FileInputStatus.CLEAR;
   @observable errorText?: string;
 
-  constructor(props: Props) {
+  constructor(props: FilePickerProps) {
     super(props);
     makeObservable(this);
   }
diff --git a/src/renderer/components/hotbar/hotbar-cell.tsx b/src/renderer/components/hotbar/hotbar-cell.tsx
index a35f35a02a..8baa14b17a 100644
--- a/src/renderer/components/hotbar/hotbar-cell.tsx
+++ b/src/renderer/components/hotbar/hotbar-cell.tsx
@@ -8,13 +8,13 @@ import React, { HTMLAttributes, ReactNode, useState } from "react";
 
 import { cssNames } from "../../utils";
 
-interface Props extends HTMLAttributes<HTMLDivElement> {
+export interface HotbarCellProps extends HTMLAttributes<HTMLDivElement> {
   children?: ReactNode;
   index: number;
   innerRef?: React.Ref<HTMLDivElement>;
 }
 
-export function HotbarCell({ innerRef, children, className, ...rest }: Props) {
+export function HotbarCell({ innerRef, children, className, ...rest }: HotbarCellProps) {
   const [animating, setAnimating] = useState(false);
   const onAnimationEnd = () => { setAnimating(false); };
   const onClick = () => {
diff --git a/src/renderer/components/hotbar/hotbar-entity-icon.tsx b/src/renderer/components/hotbar/hotbar-entity-icon.tsx
index 58b3e8f18e..8bc4572050 100644
--- a/src/renderer/components/hotbar/hotbar-entity-icon.tsx
+++ b/src/renderer/components/hotbar/hotbar-entity-icon.tsx
@@ -18,7 +18,7 @@ import { Icon } from "../icon";
 import { HotbarIcon } from "./hotbar-icon";
 import { LensKubernetesClusterStatus } from "../../../common/catalog-entities/kubernetes-cluster";
 
-interface Props extends HTMLAttributes<HTMLElement> {
+export interface HotbarEntityIconProps extends HTMLAttributes<HTMLElement> {
   entity: CatalogEntity;
   index: number;
   errorClass?: IClassName;
@@ -28,13 +28,13 @@ interface Props extends HTMLAttributes<HTMLElement> {
 }
 
 @observer
-export class HotbarEntityIcon extends React.Component<Props> {
+export class HotbarEntityIcon extends React.Component<HotbarEntityIconProps> {
   @observable private contextMenu: CatalogEntityContextMenuContext = {
     menuItems: [],
     navigate: (url: string) => navigate(url),
   };
 
-  constructor(props: Props) {
+  constructor(props: HotbarEntityIconProps) {
     super(props);
     makeObservable(this);
   }
diff --git a/src/renderer/components/hotbar/hotbar-icon.tsx b/src/renderer/components/hotbar/hotbar-icon.tsx
index f22b30c66e..e4b09d14a9 100644
--- a/src/renderer/components/hotbar/hotbar-icon.tsx
+++ b/src/renderer/components/hotbar/hotbar-icon.tsx
@@ -16,7 +16,7 @@ import { Avatar, AvatarProps } from "../avatar";
 import { Icon } from "../icon";
 import { Tooltip } from "../tooltip";
 
-export interface Props extends AvatarProps {
+export interface HotbarIconProps extends AvatarProps {
   uid: string;
   source: string;
   material?: string;
@@ -44,7 +44,7 @@ function onMenuItemClick(menuItem: CatalogEntityContextMenu) {
   }
 }
 
-export const HotbarIcon = observer(({ menuItems = [], size = 40, tooltip, ...props }: Props) => {
+export const HotbarIcon = observer(({ menuItems = [], size = 40, tooltip, ...props }: HotbarIconProps) => {
   const { uid, title, src, material, active, className, source, disabled, onMenuOpen, onClick, children, ...rest } = props;
   const id = `hotbarIcon-${uid}`;
   const [menuOpen, setMenuOpen] = useState(false);
diff --git a/src/renderer/components/hotbar/hotbar-menu.tsx b/src/renderer/components/hotbar/hotbar-menu.tsx
index 870b9e0eee..d994d7536c 100644
--- a/src/renderer/components/hotbar/hotbar-menu.tsx
+++ b/src/renderer/components/hotbar/hotbar-menu.tsx
@@ -19,15 +19,15 @@ import { HotbarIcon } from "./hotbar-icon";
 import { defaultHotbarCells, HotbarItem } from "../../../common/hotbar-types";
 import { action, makeObservable, observable } from "mobx";
 
-interface Props {
+export interface HotbarMenuProps {
   className?: IClassName;
 }
 
 @observer
-export class HotbarMenu extends React.Component<Props> {
+export class HotbarMenu extends React.Component<HotbarMenuProps> {
   @observable draggingOver = false;
 
-  constructor(props: Props) {
+  constructor(props: HotbarMenuProps) {
     super(props);
     makeObservable(this);
   }
diff --git a/src/renderer/components/input/file-input.tsx b/src/renderer/components/input/file-input.tsx
index b054d57ed3..6649a00332 100644
--- a/src/renderer/components/input/file-input.tsx
+++ b/src/renderer/components/input/file-input.tsx
@@ -11,7 +11,7 @@ export interface FileInputSelection<T = string> {
   error?: string;
 }
 
-interface Props extends InputHTMLAttributes<any> {
+export interface FileInputProps extends InputHTMLAttributes<any> {
   id?: string; // could be used with <label htmlFor={id}/> to open filesystem dialog
   accept?: string; // allowed file types to select, e.g. "application/json"
   readAsText?: boolean; // provide files content as text in selection-callback
@@ -19,7 +19,7 @@ interface Props extends InputHTMLAttributes<any> {
   onSelectFiles(...selectedFiles: FileInputSelection[]): void;
 }
 
-export class FileInput extends React.Component<Props> {
+export class FileInput extends React.Component<FileInputProps> {
   protected input: HTMLInputElement;
 
   protected style: React.CSSProperties = {
diff --git a/src/renderer/components/input/input.tsx b/src/renderer/components/input/input.tsx
index 9e961201b4..788bc142f0 100644
--- a/src/renderer/components/input/input.tsx
+++ b/src/renderer/components/input/input.tsx
@@ -22,7 +22,7 @@ export { InputValidators };
 export type { InputValidator };
 
 type InputElement = HTMLInputElement | HTMLTextAreaElement;
-type InputElementProps = InputHTMLAttributes<InputElement> & TextareaHTMLAttributes<InputElement> & DOMAttributes<InputElement>;
+type InputElementProps = InputHTMLAttributes<HTMLInputElement> & TextareaHTMLAttributes<HTMLTextAreaElement> & DOMAttributes<InputElement>;
 
 export interface IconDataFnArg {
   isDirty: boolean;
diff --git a/src/renderer/components/input/search-input.tsx b/src/renderer/components/input/search-input.tsx
index 36bcc135c4..edeab21d77 100644
--- a/src/renderer/components/input/search-input.tsx
+++ b/src/renderer/components/input/search-input.tsx
@@ -12,14 +12,14 @@ import { Icon } from "../icon";
 import { Input, InputProps } from "./input";
 import { isMac } from "../../../common/vars";
 
-interface Props extends InputProps {
+export interface SearchInputProps extends InputProps {
   compact?: boolean; // show only search-icon when not focused
   bindGlobalFocusHotkey?: boolean;
   showClearIcon?: boolean;
   onClear?(): void;
 }
 
-const defaultProps: Partial<Props> = {
+const defaultProps: Partial<SearchInputProps> = {
   autoFocus: true,
   bindGlobalFocusHotkey: true,
   showClearIcon: true,
@@ -27,7 +27,7 @@ const defaultProps: Partial<Props> = {
 };
 
 @observer
-export class SearchInput extends React.Component<Props> {
+export class SearchInput extends React.Component<SearchInputProps> {
   static defaultProps = defaultProps as object;
 
   private inputRef = createRef<Input>();
diff --git a/src/renderer/components/item-object-list/content.tsx b/src/renderer/components/item-object-list/content.tsx
index d8c4e178cf..69f72cffb7 100644
--- a/src/renderer/components/item-object-list/content.tsx
+++ b/src/renderer/components/item-object-list/content.tsx
@@ -22,7 +22,7 @@ import { MenuItem } from "../menu";
 import { Checkbox } from "../checkbox";
 import { UserStore } from "../../../common/user-store";
 
-interface ItemListLayoutContentProps<I extends ItemObject> {
+export interface ItemListLayoutContentProps<I extends ItemObject> {
   getFilters: () => Filter[];
   tableId?: string;
   className: IClassName;
diff --git a/src/renderer/components/item-object-list/filter-icon.tsx b/src/renderer/components/item-object-list/filter-icon.tsx
index 543151f412..28dd9aec02 100644
--- a/src/renderer/components/item-object-list/filter-icon.tsx
+++ b/src/renderer/components/item-object-list/filter-icon.tsx
@@ -7,11 +7,11 @@ import React from "react";
 import { Icon, IconProps } from "../icon";
 import { FilterType } from "./page-filters.store";
 
-interface Props extends Partial<IconProps> {
+export interface FilterIconProps extends Partial<IconProps> {
   type: FilterType;
 }
 
-export function FilterIcon(props: Props) {
+export function FilterIcon(props: FilterIconProps) {
   const { type, ...iconProps } = props;
 
   switch (type) {
diff --git a/src/renderer/components/item-object-list/page-filters-list.tsx b/src/renderer/components/item-object-list/page-filters-list.tsx
index 0df781fe22..771e6248af 100644
--- a/src/renderer/components/item-object-list/page-filters-list.tsx
+++ b/src/renderer/components/item-object-list/page-filters-list.tsx
@@ -13,13 +13,13 @@ import { FilterIcon } from "./filter-icon";
 import { Icon } from "../icon";
 import { searchUrlParam } from "../input";
 
-interface Props {
+export interface PageFiltersListProps {
   filters?: Filter[];
 }
 
 @observer
-export class PageFiltersList extends React.Component<Props> {
-  static defaultProps: Props = {
+export class PageFiltersList extends React.Component<PageFiltersListProps> {
+  static defaultProps: PageFiltersListProps = {
     get filters() {
       return pageFilters.activeFilters;
     },
diff --git a/src/renderer/components/kube-object-details/kube-object-details.tsx b/src/renderer/components/kube-object-details/kube-object-details.tsx
index 68b7199ced..fc0c5959ee 100644
--- a/src/renderer/components/kube-object-details/kube-object-details.tsx
+++ b/src/renderer/components/kube-object-details/kube-object-details.tsx
@@ -15,7 +15,7 @@ import { apiManager } from "../../../common/k8s-api/api-manager";
 import { crdStore } from "../+custom-resources/crd.store";
 import { KubeObjectMenu } from "../kube-object-menu";
 import { KubeObjectDetailRegistry } from "../../api/kube-object-detail-registry";
-import { CrdResourceDetails } from "../+custom-resources";
+import { CustomResourceDetails } from "../+custom-resources";
 import { KubeObjectMeta } from "../kube-object-meta";
 import { hideDetails, kubeDetailsUrlParam } from "../kube-detail-params";
 
@@ -116,7 +116,7 @@ export class KubeObjectDetails extends React.Component {
        * any defined details we should try and display at least some details
        */
       if (crd) {
-        details.push(<CrdResourceDetails key={object.getId()} object={object} crd={crd} />);
+        details.push(<CustomResourceDetails key={object.getId()} object={object} crd={crd} />);
       }
     }
 
diff --git a/src/renderer/components/kube-object-status-icon/kube-object-status-icon.tsx b/src/renderer/components/kube-object-status-icon/kube-object-status-icon.tsx
index d64b91cf27..7ca6098e3f 100644
--- a/src/renderer/components/kube-object-status-icon/kube-object-status-icon.tsx
+++ b/src/renderer/components/kube-object-status-icon/kube-object-status-icon.tsx
@@ -64,11 +64,11 @@ function splitByLevel(src: KubeObjectStatus[]): SplitStatusesByLevel {
   return { maxLevel, criticals, warnings, infos };
 }
 
-interface Props {
+export interface KubeObjectStatusIconProps {
   object: KubeObject;
 }
 
-export class KubeObjectStatusIcon extends React.Component<Props> {
+export class KubeObjectStatusIcon extends React.Component<KubeObjectStatusIconProps> {
   renderStatuses(statuses: KubeObjectStatus[], level: number) {
     const filteredStatuses = statuses.filter((item) => item.level == level);
 
diff --git a/src/renderer/components/kubeconfig-dialog/kubeconfig-dialog.tsx b/src/renderer/components/kubeconfig-dialog/kubeconfig-dialog.tsx
index 62793d9a5b..db37e5d3ce 100644
--- a/src/renderer/components/kubeconfig-dialog/kubeconfig-dialog.tsx
+++ b/src/renderer/components/kubeconfig-dialog/kubeconfig-dialog.tsx
@@ -24,7 +24,7 @@ interface IKubeconfigDialogData {
   loader?: () => Promise<any>;
 }
 
-interface Props extends Partial<DialogProps> {
+export interface KubeConfigDialogProps extends Partial<DialogProps> {
 }
 
 const dialogState = observable.object({
@@ -33,10 +33,10 @@ const dialogState = observable.object({
 });
 
 @observer
-export class KubeConfigDialog extends React.Component<Props> {
+export class KubeConfigDialog extends React.Component<KubeConfigDialogProps> {
   @observable config = ""; // parsed kubeconfig in yaml format
 
-  constructor(props: Props) {
+  constructor(props: KubeConfigDialogProps) {
     super(props);
     makeObservable(this);
   }
diff --git a/src/renderer/components/layout/close-button.tsx b/src/renderer/components/layout/close-button.tsx
index 80b883c91b..14e0290f76 100644
--- a/src/renderer/components/layout/close-button.tsx
+++ b/src/renderer/components/layout/close-button.tsx
@@ -8,10 +8,10 @@ import styles from "./close-button.module.scss";
 import React, { HTMLAttributes } from "react";
 import { Icon } from "../icon";
 
-interface Props extends HTMLAttributes<HTMLDivElement> {
+export interface CloseButtonProps extends HTMLAttributes<HTMLDivElement> {
 }
 
-export function CloseButton(props: Props) {
+export function CloseButton(props: CloseButtonProps) {
   return (
     <div {...props}>
       <div className={styles.closeButton} role="button" aria-label="Close">
diff --git a/src/renderer/components/layout/main-layout.tsx b/src/renderer/components/layout/main-layout.tsx
index 65c581bdca..08e57a723e 100755
--- a/src/renderer/components/layout/main-layout.tsx
+++ b/src/renderer/components/layout/main-layout.tsx
@@ -16,7 +16,7 @@ import sidebarStorageInjectable, {
   SidebarStorageState,
 } from "./sidebar-storage/sidebar-storage.injectable";
 
-interface Props {
+export interface MainLayoutProps {
   sidebar: React.ReactNode;
   className?: string;
   footer?: React.ReactNode;
@@ -33,7 +33,7 @@ interface Dependencies {
 }
 
 @observer
-class NonInjectedMainLayout extends React.Component<Props & Dependencies> {
+class NonInjectedMainLayout extends React.Component<MainLayoutProps & Dependencies> {
   onSidebarResize = (width: number) => {
     this.props.sidebarStorage.merge({ width });
   };
@@ -69,7 +69,7 @@ class NonInjectedMainLayout extends React.Component<Props & Dependencies> {
   }
 }
 
-export const MainLayout = withInjectables<Dependencies, Props>(
+export const MainLayout = withInjectables<Dependencies, MainLayoutProps>(
   NonInjectedMainLayout,
 
   {
diff --git a/src/renderer/components/layout/sidebar-item.tsx b/src/renderer/components/layout/sidebar-item.tsx
index 8169f75d8d..0152725e37 100644
--- a/src/renderer/components/layout/sidebar-item.tsx
+++ b/src/renderer/components/layout/sidebar-item.tsx
@@ -15,7 +15,7 @@ import { isActiveRoute } from "../../navigation";
 import { withInjectables } from "@ogre-tools/injectable-react";
 import sidebarStorageInjectable, { SidebarStorageState } from "./sidebar-storage/sidebar-storage.injectable";
 
-interface SidebarItemProps {
+export interface SidebarItemProps {
   /**
    * Unique id, used in storage and integration tests
    */
diff --git a/src/renderer/components/layout/sidebar.tsx b/src/renderer/components/layout/sidebar.tsx
index e0239c541d..5af023c622 100644
--- a/src/renderer/components/layout/sidebar.tsx
+++ b/src/renderer/components/layout/sidebar.tsx
@@ -27,7 +27,7 @@ import { HelmSidebarItem } from "../+helm/sidebar-item";
 import { UserManagementSidebarItem } from "../+user-management/sidebar-item";
 import { CustomResourcesSidebarItem } from "../+custom-resources/sidebar-item";
 
-interface SidebarProps {
+export interface SidebarProps {
   className?: string;
 }
 
diff --git a/src/renderer/components/layout/sub-title.tsx b/src/renderer/components/layout/sub-title.tsx
index b2429083bb..eb03c8988c 100644
--- a/src/renderer/components/layout/sub-title.tsx
+++ b/src/renderer/components/layout/sub-title.tsx
@@ -7,14 +7,14 @@ import "./sub-title.scss";
 import React from "react";
 import { cssNames } from "../../utils";
 
-interface Props {
+export interface SubTitleProps {
   className?: string;
   title: React.ReactNode;
   compact?: boolean; // no bottom padding
   id?: string;
 }
 
-export class SubTitle extends React.Component<Props> {
+export class SubTitle extends React.Component<SubTitleProps> {
   render() {
     const { className, compact, title, children, id } = this.props;
     const classNames = cssNames("SubTitle", className, {
diff --git a/src/renderer/components/list/list.tsx b/src/renderer/components/list/list.tsx
index 17b8a06842..f4c129e2ec 100644
--- a/src/renderer/components/list/list.tsx
+++ b/src/renderer/components/list/list.tsx
@@ -11,13 +11,13 @@ import type { UseTableOptions } from "react-table";
 import { ReactTable } from "../table/react-table";
 export type SearchFilter = (item: object) => string | number;
 
-interface Props extends UseTableOptions<any> {
+export interface ListProps extends UseTableOptions<any> {
   items: object[];
   filters: SearchFilter[];
   title?: React.ReactNode;
 }
 
-export function List({ columns, data, title, items, filters }: Props) {
+export function List({ columns, data, title, items, filters }: ListProps) {
   const [search, setSearch] = useState<string>("");
   const query = search.toLowerCase();
 
diff --git a/src/renderer/components/locale-date/locale-date.tsx b/src/renderer/components/locale-date/locale-date.tsx
index 44769518b8..3dc95e678b 100644
--- a/src/renderer/components/locale-date/locale-date.tsx
+++ b/src/renderer/components/locale-date/locale-date.tsx
@@ -8,12 +8,12 @@ import { observer } from "mobx-react";
 import moment from "moment-timezone";
 import { UserStore } from "../../../common/user-store";
 
-interface Props {
+export interface LocaleDateProps {
   date: string;
 }
 
 @observer
-export class LocaleDate extends React.Component<Props> {
+export class LocaleDate extends React.Component<LocaleDateProps> {
   render() {
     const { date } = this.props;
 
diff --git a/src/renderer/components/markdown-viewer/markdown-viewer.tsx b/src/renderer/components/markdown-viewer/markdown-viewer.tsx
index ca131c7cbb..4e4c0c9695 100644
--- a/src/renderer/components/markdown-viewer/markdown-viewer.tsx
+++ b/src/renderer/components/markdown-viewer/markdown-viewer.tsx
@@ -19,15 +19,15 @@ DOMPurify.addHook("afterSanitizeAttributes", function (node) {
   }
 });
 
-interface Props extends OptionalProps {
+export interface MarkdownViewerProps extends OptionalProps {
   markdown: string;
 }
 
-interface OptionalProps {
+export interface OptionalProps {
   className?: string;
 }
 
-export class MarkdownViewer extends Component<Props> {
+export class MarkdownViewer extends Component<MarkdownViewerProps> {
   render() {
     const { className, markdown } = this.props;
     const html = DOMPurify.sanitize(marked(markdown));
diff --git a/src/renderer/components/no-items/no-items.tsx b/src/renderer/components/no-items/no-items.tsx
index fd588a15f1..658a28d6d1 100644
--- a/src/renderer/components/no-items/no-items.tsx
+++ b/src/renderer/components/no-items/no-items.tsx
@@ -8,12 +8,12 @@ import "./no-items.scss";
 import React from "react";
 import { cssNames, IClassName } from "../../utils";
 
-interface Props {
+export interface NoItemsProps {
   className?: IClassName;
   children?: React.ReactNode;
 }
 
-export function NoItems(props: Props) {
+export function NoItems(props: NoItemsProps) {
   const { className, children } = props;
 
   return (
diff --git a/src/renderer/components/render-delay/render-delay.tsx b/src/renderer/components/render-delay/render-delay.tsx
index f3be4b5421..8180c9aac3 100644
--- a/src/renderer/components/render-delay/render-delay.tsx
+++ b/src/renderer/components/render-delay/render-delay.tsx
@@ -8,16 +8,16 @@ import { makeObservable, observable } from "mobx";
 import { observer } from "mobx-react";
 import { boundMethod } from "../../utils";
 
-interface Props {
+export interface RenderDelayProps {
   placeholder?: React.ReactNode;
   children: unknown;
 }
 
 @observer
-export class RenderDelay extends React.Component<Props> {
+export class RenderDelay extends React.Component<RenderDelayProps> {
   @observable isVisible = false;
 
-  constructor(props: Props) {
+  constructor(props: RenderDelayProps) {
     super(props);
     makeObservable(this);
   }
diff --git a/src/renderer/components/resizing-anchor/resizing-anchor.tsx b/src/renderer/components/resizing-anchor/resizing-anchor.tsx
index 7629b6610f..5f002dcc2f 100644
--- a/src/renderer/components/resizing-anchor/resizing-anchor.tsx
+++ b/src/renderer/components/resizing-anchor/resizing-anchor.tsx
@@ -46,7 +46,7 @@ export enum ResizeGrowthDirection {
   RIGHT_TO_LEFT = -1,
 }
 
-interface Props {
+export interface ResizingAnchorProps {
   direction: ResizeDirection;
 
   /**
@@ -148,7 +148,7 @@ function directionDelta(P1: number, P2: number, M: number): number | false {
 }
 
 @observer
-export class ResizingAnchor extends React.PureComponent<Props> {
+export class ResizingAnchor extends React.PureComponent<ResizingAnchorProps> {
   @observable lastMouseEvent?: MouseEvent;
   ref = React.createRef<HTMLDivElement>();
   @observable isDragging = false;
@@ -171,7 +171,7 @@ export class ResizingAnchor extends React.PureComponent<Props> {
   };
   static IS_RESIZING = "resizing";
 
-  constructor(props: Props) {
+  constructor(props: ResizingAnchorProps) {
     super(props);
 
     makeObservable(this);
diff --git a/src/renderer/components/resource-metrics/resource-metrics-text.tsx b/src/renderer/components/resource-metrics/resource-metrics-text.tsx
index 552b0d7903..2701207e77 100644
--- a/src/renderer/components/resource-metrics/resource-metrics-text.tsx
+++ b/src/renderer/components/resource-metrics/resource-metrics-text.tsx
@@ -10,14 +10,16 @@ import { bytesToUnits } from "../../utils";
 import { Badge } from "../badge";
 import { DrawerItem } from "../drawer";
 
-interface Props {
-  metrics: IPodMetrics<IMetrics>;
+export interface ResourceMetricsTextProps {
+  metrics: IPodMetrics<IMetrics> | null | undefined;
 }
 
-export function ResourceMetricsText(props: Props) {
-  if (!props.metrics) return null;
-  const metrics = getMetricLastPoints(props.metrics);
-  const { cpuUsage, cpuRequests, cpuLimits, memoryUsage, memoryRequests, memoryLimits } = metrics;
+export function ResourceMetricsText({ metrics }: ResourceMetricsTextProps) {
+  if (!metrics) {
+    return null;
+  }
+
+  const { cpuUsage, cpuRequests, cpuLimits, memoryUsage, memoryRequests, memoryLimits } = getMetricLastPoints(metrics);
 
   return (
     <>
diff --git a/src/renderer/components/resource-metrics/resource-metrics.tsx b/src/renderer/components/resource-metrics/resource-metrics.tsx
index 61cfdd00cf..30079fb666 100644
--- a/src/renderer/components/resource-metrics/resource-metrics.tsx
+++ b/src/renderer/components/resource-metrics/resource-metrics.tsx
@@ -12,7 +12,7 @@ import type { KubeObject } from "../../../common/k8s-api/kube-object";
 import { cssNames } from "../../utils";
 import { Spinner } from "../spinner";
 
-interface Props extends React.HTMLProps<any> {
+export interface ResourceMetricsProps extends React.HTMLProps<any> {
   tabs: React.ReactNode[];
   object?: KubeObject;
   loader?: () => void;
@@ -23,21 +23,15 @@ interface Props extends React.HTMLProps<any> {
   };
 }
 
-export type IResourceMetricsValue<T extends KubeObject = any, P = any> = {
+export interface IResourceMetricsValue<T extends KubeObject = any, P = any> {
   object: T;
   tabId: number;
   params?: P;
-};
+}
 
 export const ResourceMetricsContext = createContext<IResourceMetricsValue>(null);
 
-const defaultProps: Partial<Props> = {
-  interval: 60,  // 1 min
-};
-
-ResourceMetrics.defaultProps = defaultProps;
-
-export function ResourceMetrics({ object, loader, interval, tabs, children, className, params }: Props) {
+export function ResourceMetrics({ object, loader, interval = 60, tabs, children, className, params }: ResourceMetricsProps) {
   const [tabId, setTabId] = useState<number>(0);
 
   useEffect(() => {
diff --git a/src/renderer/components/scroll-spy/scroll-spy.tsx b/src/renderer/components/scroll-spy/scroll-spy.tsx
index a6fd9fb056..9ebcd2031d 100644
--- a/src/renderer/components/scroll-spy/scroll-spy.tsx
+++ b/src/renderer/components/scroll-spy/scroll-spy.tsx
@@ -8,13 +8,13 @@ import React, { useEffect, useRef, useState } from "react";
 import { useMutationObserver } from "../../hooks";
 import type { NavigationTree } from "../tree-view";
 
-interface Props extends React.DOMAttributes<HTMLElement> {
+export interface ScrollSpyProps extends React.DOMAttributes<HTMLElement> {
   render: (data: NavigationTree[]) => JSX.Element;
   htmlFor?: string; // Id of the element to put observers on
   rootMargin?: string; // https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API#creating_an_intersection_observer
 }
 
-export const ScrollSpy = observer(({ render, htmlFor, rootMargin = "0px 0px -100% 0px" }: Props) => {
+export const ScrollSpy = observer(({ render, htmlFor, rootMargin = "0px 0px -100% 0px" }: ScrollSpyProps) => {
   const parent = useRef<HTMLDivElement>();
   const sections = useRef<NodeListOf<HTMLElement>>();
   const [tree, setTree] = useState<NavigationTree[]>([]);
diff --git a/src/renderer/components/switch/switch.tsx b/src/renderer/components/switch/switch.tsx
index 1f24e9cac8..8649a723f2 100644
--- a/src/renderer/components/switch/switch.tsx
+++ b/src/renderer/components/switch/switch.tsx
@@ -8,11 +8,11 @@ import styles from "./switch.module.scss";
 import React, { ChangeEvent, HTMLProps } from "react";
 import { cssNames } from "../../utils";
 
-interface Props extends Omit<HTMLProps<HTMLInputElement>, "onChange"> {
+export interface SwitchProps extends Omit<HTMLProps<HTMLInputElement>, "onChange"> {
   onChange?: (checked: boolean, event: ChangeEvent<HTMLInputElement>) => void;
 }
 
-export function Switch({ children, disabled, onChange, ...props }: Props) {
+export function Switch({ children, disabled, onChange, ...props }: SwitchProps) {
   return (
     <label className={cssNames(styles.Switch, { [styles.disabled]: disabled })} data-testid="switch">
       {children}
diff --git a/src/renderer/components/switch/switcher.tsx b/src/renderer/components/switch/switcher.tsx
index 35667a5977..f73d6dc6f4 100644
--- a/src/renderer/components/switch/switcher.tsx
+++ b/src/renderer/components/switch/switcher.tsx
@@ -11,7 +11,7 @@ interface Styles extends Partial<Record<SwitchClassKey, string>> {
   focusVisible?: string;
 }
 
-interface Props extends SwitchProps {
+export interface SwitcherProps extends SwitchProps {
   classes: Styles;
 }
 
@@ -58,7 +58,7 @@ export const Switcher = withStyles((theme: Theme) =>
     checked: {},
     focusVisible: {},
   }),
-)(({ classes, ...props }: Props) => {
+)(({ classes, ...props }: SwitcherProps) => {
   return (
     <Switch
       focusVisibleClassName={classes.focusVisible}
diff --git a/src/renderer/components/table/react-table.tsx b/src/renderer/components/table/react-table.tsx
index 1f9f577858..ca0d062ba6 100644
--- a/src/renderer/components/table/react-table.tsx
+++ b/src/renderer/components/table/react-table.tsx
@@ -9,11 +9,11 @@ import { useFlexLayout, useSortBy, useTable, UseTableOptions } from "react-table
 import { Icon } from "../icon";
 import { cssNames } from "../../utils";
 
-interface Props extends UseTableOptions<any> {
+export interface ReactTableProps extends UseTableOptions<any> {
   headless?: boolean;
 }
 
-export function ReactTable({ columns, data, headless }: Props) {
+export function ReactTable({ columns, data, headless }: ReactTableProps) {
   const defaultColumn = useMemo(
     () => ({
       minWidth: 20,
diff --git a/src/renderer/components/table/table.tsx b/src/renderer/components/table/table.tsx
index ac6880467c..3190c96d33 100644
--- a/src/renderer/components/table/table.tsx
+++ b/src/renderer/components/table/table.tsx
@@ -21,7 +21,10 @@ import tableModelInjectable from "./table-model/table-model.injectable";
 
 export type TableSortBy = string;
 export type TableOrderBy = "asc" | "desc" | string;
-export type TableSortParams = { sortBy: TableSortBy; orderBy: TableOrderBy };
+export interface TableSortParams {
+  sortBy: TableSortBy;
+  orderBy: TableOrderBy;
+}
 export type TableSortCallback<Item> = (data: Item) => string | number | (string | number)[];
 export type TableSortCallbacks<Item> = Record<string, TableSortCallback<Item>>;
 
diff --git a/src/renderer/components/tree-view/tree-view.tsx b/src/renderer/components/tree-view/tree-view.tsx
index 9ef2094b50..1d8c346a50 100644
--- a/src/renderer/components/tree-view/tree-view.tsx
+++ b/src/renderer/components/tree-view/tree-view.tsx
@@ -24,7 +24,7 @@ export interface NavigationTree {
   children?: NavigationTree[];
 }
 
-interface Props {
+export interface RecursiveTreeViewProps {
   data: NavigationTree[];
 }
 
@@ -36,7 +36,7 @@ function getSelectedNode(data: NavigationTree[]) {
   return deepDash.findDeep(data, (value, key) => key === "selected" && value === true)?.parent;
 }
 
-export function RecursiveTreeView({ data }: Props) {
+export function RecursiveTreeView({ data }: RecursiveTreeViewProps) {
   const [expanded, setExpanded] = React.useState<string[]>([]);
   const prevData = useRef<NavigationTree[]>(data);
 
diff --git a/src/renderer/components/virtual-list/virtual-list.tsx b/src/renderer/components/virtual-list/virtual-list.tsx
index 67e6d1e3f7..8e8de118c2 100644
--- a/src/renderer/components/virtual-list/virtual-list.tsx
+++ b/src/renderer/components/virtual-list/virtual-list.tsx
@@ -17,7 +17,7 @@ import debounce from "lodash/debounce";
 import isEqual from "lodash/isEqual";
 import AutoSizer from "react-virtualized-auto-sizer";
 
-interface Props<T extends ItemObject = any> {
+export interface VirtualListProps<T extends ItemObject = any> {
   items: T[];
   rowHeights: number[];
   className?: string;
@@ -40,14 +40,14 @@ interface State {
   overscanCount: number;
 }
 
-const defaultProps: Partial<Props> = {
+const defaultProps: Partial<VirtualListProps> = {
   width: "100%",
   initialOffset: 1,
   readyOffset: 10,
   onScroll: noop,
 };
 
-export class VirtualList extends Component<Props, State> {
+export class VirtualList extends Component<VirtualListProps, State> {
   static defaultProps = defaultProps as object;
 
   private listRef = React.createRef<VariableSizeList>();
@@ -61,7 +61,7 @@ export class VirtualList extends Component<Props, State> {
     this.setState({ overscanCount: this.props.readyOffset });
   }
 
-  componentDidUpdate(prevProps: Props) {
+  componentDidUpdate(prevProps: VirtualListProps) {
     const { items, rowHeights } = this.props;
 
     if (prevProps.items.length !== items.length || !isEqual(prevProps.rowHeights, rowHeights)) {
@@ -137,7 +137,7 @@ interface RowData {
   getRow?: (uid: string | number) => React.ReactElement<TableRowProps>;
 }
 
-interface RowProps extends ListChildComponentProps {
+export interface RowProps extends ListChildComponentProps {
   data: RowData;
 }
 
diff --git a/src/renderer/components/wizard/wizard.tsx b/src/renderer/components/wizard/wizard.tsx
index 3db32133ac..1ef001b98d 100755
--- a/src/renderer/components/wizard/wizard.tsx
+++ b/src/renderer/components/wizard/wizard.tsx
@@ -12,7 +12,7 @@ import { SubTitle } from "../layout/sub-title";
 import { Spinner } from "../spinner";
 import { debounce } from "lodash";
 
-interface WizardCommonProps<D = any> {
+export interface WizardCommonProps<D> {
   data?: Partial<D>;
   save?: (data: Partial<D>, callback?: () => void) => void;
   reset?: () => void;
@@ -20,43 +20,44 @@ interface WizardCommonProps<D = any> {
   hideSteps?: boolean;
 }
 
-export interface WizardProps extends WizardCommonProps {
+export interface WizardProps<D> extends WizardCommonProps<D> {
   className?: string;
   step?: number;
   title?: string;
   header?: React.ReactNode;
   onChange?: (step: number) => void;
+  children?: React.ReactElement<WizardStepProps<D>>[] | React.ReactElement<WizardStepProps<D>>;
 }
 
 interface State {
   step?: number;
 }
 
-export class Wizard extends React.Component<WizardProps, State> {
+export class Wizard<D> extends React.Component<WizardProps<D>, State> {
   public state: State = {
     step: this.getValidStep(this.props.step),
   };
 
-  get steps() {
+  get steps(): React.ReactElement<WizardStepProps<D>>[] {
     const { className, title, step, header, onChange, children, ...commonProps } = this.props;
-    const steps = React.Children.toArray(children) as WizardStepElem[];
+    const steps = React.Children.toArray(children) as React.ReactElement<WizardStepProps<D>>[];
 
-    return steps.filter(step => !step.props.skip).map((stepElem, i) => {
-      const stepProps = stepElem.props;
-
-      return React.cloneElement(stepElem, {
-        step: i + 1,
-        wizard: this,
-        next: this.nextStep,
-        prev: this.prevStep,
-        first: this.firstStep,
-        last: this.lastStep,
-        isFirst: this.isFirstStep,
-        isLast: this.isLastStep,
-        ...commonProps,
-        ...stepProps,
-      } as WizardStepProps<any>);
-    });
+    return steps
+      .filter(step => !step.props.skip)
+      .map((stepElem, i) => (
+        React.cloneElement(stepElem, {
+          step: i + 1,
+          wizard: this,
+          next: this.nextStep,
+          prev: this.prevStep,
+          first: this.firstStep,
+          last: this.lastStep,
+          isFirst: this.isFirstStep,
+          isLast: this.isLastStep,
+          ...commonProps,
+          ...stepElem.props,
+        })
+      ));
   }
 
   get step() {
@@ -103,8 +104,8 @@ export class Wizard extends React.Component<WizardProps, State> {
   }
 }
 
-export interface WizardStepProps<D = any> extends WizardCommonProps<D> {
-  wizard?: Wizard;
+export interface WizardStepProps<D> extends WizardCommonProps<D> {
+  wizard?: Wizard<D>;
   title?: string;
   className?: string | object;
   contentClass?: string | object;
@@ -135,14 +136,12 @@ interface WizardStepState {
   waiting?: boolean;
 }
 
-type WizardStepElem = React.ReactElement<WizardStepProps>;
-
-export class WizardStep extends React.Component<WizardStepProps, WizardStepState> {
+export class WizardStep<D> extends React.Component<WizardStepProps<D>, WizardStepState> {
   private form: HTMLFormElement;
   public state: WizardStepState = {};
   private unmounting = false;
 
-  static defaultProps: WizardStepProps = {
+  static defaultProps: WizardStepProps<any> = {
     scrollable: true,
   };
 
diff --git a/src/renderer/port-forward/port-forward-dialog.tsx b/src/renderer/port-forward/port-forward-dialog.tsx
index c803dc121c..70c9910652 100644
--- a/src/renderer/port-forward/port-forward-dialog.tsx
+++ b/src/renderer/port-forward/port-forward-dialog.tsx
@@ -22,7 +22,7 @@ import portForwardDialogModelInjectable from "./port-forward-dialog-model/port-f
 import logger from "../../common/logger";
 import portForwardStoreInjectable from "./port-forward-store/port-forward-store.injectable";
 
-interface Props extends Partial<DialogProps> {}
+export interface PortForwardDialogProps extends Partial<DialogProps> {}
 
 interface Dependencies {
   portForwardStore: PortForwardStore;
@@ -30,11 +30,11 @@ interface Dependencies {
 }
 
 @observer
-class NonInjectedPortForwardDialog extends Component<Props & Dependencies> {
+class NonInjectedPortForwardDialog extends Component<PortForwardDialogProps & Dependencies> {
   @observable currentPort = 0;
   @observable desiredPort = 0;
 
-  constructor(props: Props & Dependencies) {
+  constructor(props: PortForwardDialogProps & Dependencies) {
     super(props);
     makeObservable(this);
   }
@@ -160,7 +160,7 @@ class NonInjectedPortForwardDialog extends Component<Props & Dependencies> {
   }
 }
 
-export const PortForwardDialog = withInjectables<Dependencies, Props>(
+export const PortForwardDialog = withInjectables<Dependencies, PortForwardDialogProps>(
   NonInjectedPortForwardDialog,
 
   {
diff --git a/src/renderer/utils/__tests__/storageHelper.test.ts b/src/renderer/utils/__tests__/storageHelper.test.ts
index ca33014ce3..007519bbad 100644
--- a/src/renderer/utils/__tests__/storageHelper.test.ts
+++ b/src/renderer/utils/__tests__/storageHelper.test.ts
@@ -7,11 +7,11 @@ import { observable, reaction } from "mobx";
 import { StorageHelper } from "../storageHelper";
 import { delay } from "../../../common/utils/delay";
 
-type StorageModel = {
+interface StorageModel {
   [prop: string]: any /*json-serializable*/;
   message?: string;
   description?: any;
-};
+}
 
 describe("renderer/utils/StorageHelper", () => {
   describe("Using custom StorageAdapter", () => {
diff --git a/src/renderer/utils/cssNames.ts b/src/renderer/utils/cssNames.ts
index 09dcc28502..004c8f446a 100755
--- a/src/renderer/utils/cssNames.ts
+++ b/src/renderer/utils/cssNames.ts
@@ -6,9 +6,7 @@
 // Helper for combining css classes inside components
 
 export type IClassName = string | string[] | IClassNameMap;
-export type IClassNameMap = {
-  [className: string]: boolean | any;
-};
+export type IClassNameMap = Record<string, any>;
 
 export function cssNames(...args: IClassName[]): string {
   const map: IClassNameMap = {};