added initial ingress-class table-view + magic route-component.injectable

Signed-off-by: Roman <ixrock@gmail.com>

src/common/k8s-api/endpoints/ingress-class.api.ts

@@ -48,4 +48,31 @@ export class IngressClass extends KubeObject<IngressClassMetadata, IngressClassS
   static readonly namespaced = true;
   static readonly apiBase = "/apis/networking.k8s.io/v1/ingressclasses";
 
+  getController() {
+    return this.spec.controller;
+  }
+
+  getApiGroup(){
+    return this.spec.parameters.apiGroup;
+  }
+
+  getScope(){
+    return this.spec.parameters.scope;
+  }
+
+  getNs() {
+    return this.spec.parameters?.namespace as string;
+  }
+
+  getKind(){
+    return this.spec.parameters.kind;
+  }
+
+  getName(){
+    return this.spec.parameters.name;
+  }
+
+  get isDefault(){
+    return this.metadata?.annotations?.["ingressclass.kubernetes.io/is-default-class"] === "true";
+  }
 }

src/renderer/components/+network-ingresses/ingress-class-route-component.injectable.ts

@@ -0,0 +1,24 @@
+/**
+ * Copyright (c) OpenLens Authors. All rights reserved.
+ * Licensed under MIT License. See LICENSE in root directory for more information.
+ */
+import { getInjectable } from "@ogre-tools/injectable";
+import {
+  routeSpecificComponentInjectionToken
+} from "../../routes/route-specific-component-injection-token";
+import ingressClassesesRouteInjectable
+  from "../../../common/front-end-routing/routes/cluster/network/ingress-class/ingress-classeses-route.injectable";
+import { IngressClasses } from "./ingress-classes";
+
+const ingressClassesRouteComponentInjectable = getInjectable({
+  id: "ingress-classes-route-component",
+
+  instantiate: (di) => ({
+    route: di.inject(ingressClassesesRouteInjectable),
+    Component: IngressClasses,
+  }),
+
+  injectionToken: routeSpecificComponentInjectionToken,
+});
+
+export default ingressClassesRouteComponentInjectable;

src/renderer/components/+network-ingresses/ingress-classes.module.scss

@@ -0,0 +1,32 @@
+/**
+ * Copyright (c) OpenLens Authors. All rights reserved.
+ * Licensed under MIT License. See LICENSE in root directory for more information.
+ */
+
+.IngressClasses {
+  :global(.TableCell) {
+    &.is_default {
+      :global(.Checkbox) {
+        align-items: flex-start;
+      }
+    }
+
+    &.name {
+    }
+
+    &.namespace {
+    }
+
+    &.controller {
+    }
+
+    &.apiGroup {
+    }
+
+    &.scope {
+    }
+
+    &.kind {
+    }
+  }
+}

src/renderer/components/+network-ingresses/ingress-classes.tsx

@@ -0,0 +1,99 @@
+/**
+ * Copyright (c) OpenLens Authors. All rights reserved.
+ * Licensed under MIT License. See LICENSE in root directory for more information.
+ */
+
+import styles from "./ingress-classes.module.scss";
+
+import React from "react";
+import { observer } from "mobx-react";
+import { KubeObjectListLayout } from "../kube-object-list-layout";
+import { SiblingsInTabLayout } from "../layout/siblings-in-tab-layout";
+import { withInjectables } from "@ogre-tools/injectable-react";
+import type { IngressClassStore } from "./ingress-class-store";
+import ingressClassStoreInjectable from "./ingress-class-store.injectable";
+import type { IngressClass } from "../../../common/k8s-api/endpoints/ingress-class.api";
+
+enum columnId {
+  is_default = "is-default",
+  name = "name",
+  namespace = "namespace",
+  controller = "controller",
+  apiGroup = "apiGroup",
+  scope = "scope", // "Namespace" | "Cluster"
+  kind = "kind", // "ClusterIngressParameter" | "IngressParameter"
+}
+
+interface Dependencies {
+  store: IngressClassStore;
+}
+
+const NonInjectedIngressClasses = observer((props: Dependencies) => {
+  const {
+    store,
+  } = props;
+
+  return (
+    <SiblingsInTabLayout>
+      <KubeObjectListLayout
+        isConfigurable
+        tableId="network_ingress_classess"
+        className={styles.IngressClasses}
+        store={store}
+        sortingCallbacks={{
+          [columnId.is_default]: (resource: IngressClass) => resource.isDefault ? 1 : 0,
+          [columnId.name]: (resource: IngressClass) => resource.getName(),
+          [columnId.namespace]: (resource: IngressClass) => resource.getNs(),
+          [columnId.controller]: (resource: IngressClass) => resource.getController(),
+          [columnId.apiGroup]: (resource: IngressClass) => resource.getApiGroup(),
+          [columnId.scope]: (resource: IngressClass) => resource.getScope(),
+          [columnId.kind]: (resource: IngressClass) => resource.getKind(),
+        }}
+        searchFilters={[
+          ingress => ingress.getSearchFields(),
+        ]}
+        renderHeaderTitle="Ingress Classes"
+        renderTableHeader={[
+          { title: "Default", className: styles.is_default, id: columnId.is_default },
+          { title: "Name", className: styles.names, sortBy: columnId.name, id: columnId.name },
+          {
+            title: "Namespace",
+            className: styles.namespace,
+            sortBy: columnId.namespace,
+            id: columnId.namespace,
+          },
+          {
+            title: "Controller",
+            className: styles.controller,
+            sortBy: columnId.controller,
+            id: columnId.controller,
+          },
+          {
+            title: "ApiGroup",
+            className: styles.apiGroup,
+            sortBy: columnId.apiGroup,
+            id: columnId.apiGroup,
+          },
+          { title: "Scope", className: styles.scope, sortBy: columnId.scope, id: columnId.scope, },
+          { title: "Kind", className: styles.kind, sortBy: columnId.kind, id: columnId.kind, },
+        ]}
+        renderTableContents={ingressClass => [
+          <span>checkbox-set-default</span>,
+          ingressClass.getName(),
+          ingressClass.getNs(),
+          ingressClass.getController(),
+          ingressClass.getApiGroup(),
+          ingressClass.getScope(),
+          ingressClass.getKind(),
+        ]}
+      />
+    </SiblingsInTabLayout>
+  );
+});
+
+export const IngressClasses = withInjectables<Dependencies>(NonInjectedIngressClasses, {
+  getProps: (di, props) => ({
+    ...props,
+    store: di.inject(ingressClassStoreInjectable),
+  }),
+});