Adding validatingwebhookconfigs list and details-related files

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>

packages/core/src/common/k8s-api/endpoints/mutating-webhook-configuration.api.ts

@@ -88,14 +88,15 @@ export interface Webhook {
   // needs to run. This should be false when the webhook only applies to resources that have
   // the sideEffects field set to None. Defaults to true.
   sideEffects?: string;
-}
 
-interface MutatingWebhook extends Webhook {
   // reinvocationPolicy indicates whether this webhook should be called multiple times as part of a
   // single admission evaluation. Allowed values are "Never" and "IfNeeded"
   reinvocationPolicy?: "Never" | "IfNeeded";
 }
 
+export interface MutatingWebhook extends Webhook {
+}
+
 interface ServiceReference {
   // `namespace` is the namespace of the service.
   namespace: string;

packages/core/src/common/k8s-api/endpoints/validating-webhook-configuration.api.ts

@@ -8,9 +8,8 @@ import type { DerivedKubeApiOptions, KubeApiDependencies } from "../kube-api";
 import { KubeApi } from "../kube-api";
 import type { KubeJsonApiData } from "../kube-json-api";
 import type { Webhook } from "./mutating-webhook-configuration.api";
-import { MutatingWebhookConfiguration } from "./mutating-webhook-configuration.api";
 
-interface ValidatingWebhook extends Webhook {
+export interface ValidatingWebhook extends Webhook {
 }
 
 interface ValidatingWebhookConfigurationData extends KubeJsonApiData<KubeObjectMetadata<KubeObjectScope.Namespace>, void, void> {
@@ -38,11 +37,11 @@ export class ValidatingWebhookConfiguration extends KubeObject<
   }
 }
 
-export class ValidatingWebhookConfigurationApi extends KubeApi<MutatingWebhookConfiguration> {
+export class ValidatingWebhookConfigurationApi extends KubeApi<ValidatingWebhookConfiguration> {
   constructor(deps: KubeApiDependencies, opts?: DerivedKubeApiOptions) {
     super(deps, {
       ...opts ?? {},
-      objectConstructor: MutatingWebhookConfiguration,
+      objectConstructor: ValidatingWebhookConfiguration,
     });
   }
 }

packages/core/src/renderer/components/+config-mutating-webhook-configurations/mutating-webhook-configurations-details.tsx

@@ -2,14 +2,12 @@
  * Copyright (c) OpenLens Authors. All rights reserved.
  * Licensed under MIT License. See LICENSE in root directory for more information.
  */
-import styles from "./mutating-webhook-configs-details.module.css";
-
 import React from "react";
 import { observer } from "mobx-react";
 import { DrawerItem, DrawerTitle } from "../drawer";
 import type { KubeObjectDetailsProps } from "../kube-object-details";
 import type { MutatingWebhookConfiguration } from "../../../common/k8s-api/endpoints";
-import { Badge } from "../badge";
+import { WebhookConfig } from "./webhook-config";
 
 export interface MutatingWebhookDetailsProps extends KubeObjectDetailsProps<MutatingWebhookConfiguration> {
 }
@@ -29,152 +27,7 @@ export class MutatingWebhookDetails extends React.Component<MutatingWebhookDetai
           <div style={{ opacity: 0.6 }}>No webhooks set</div>
         )}
         {webhookConfig.getWebhooks()?.map((webhook) => (
-          <React.Fragment key={webhook.name}>
-            <DrawerItem name="Name" className={styles.firstItem}>
-              <strong>{webhook.name}</strong>
-            </DrawerItem>
-            <DrawerItem name="Client Config">
-              {webhook.clientConfig?.service?.name && (
-                <div>
-                  <div>
-                    Name:
-                    {" "}
-                    {webhook.clientConfig.service.name}
-                  </div>
-                  <div>
-                    Namespace:
-                    {" "}
-                    {webhook.clientConfig.service.namespace}
-                  </div>
-                </div>
-              )}
-            </DrawerItem>
-            <DrawerItem name="Match Policy">
-              {webhook.matchPolicy}
-            </DrawerItem>
-            <DrawerItem name="Failure Policy">
-              {webhook.failurePolicy}
-            </DrawerItem>
-            <DrawerItem name="Admission Review Versions">
-              {webhook.admissionReviewVersions?.join(", ")}
-            </DrawerItem>
-            <DrawerItem name="Reinvocation Policy">
-              {webhook.reinvocationPolicy}
-            </DrawerItem>
-            <DrawerItem name="Side Effects">
-              {webhook.sideEffects}
-            </DrawerItem>
-            <DrawerItem name="Timeout Seconds">
-              {webhook.timeoutSeconds}
-            </DrawerItem>
-            <DrawerItem name="Namespace Selector">
-              {webhook.namespaceSelector && (
-                <div>
-                  <div>Match Expressions:</div>
-                  {webhook.namespaceSelector.matchExpressions?.map((expression, index) => (
-                    <div key={index}>
-                      <div>
-                        Key:
-                        {" "}
-                        {expression.key}
-                      </div>
-                      <div>
-                        Operator:
-                        {" "}
-                        {expression.operator}
-                      </div>
-                      <div>
-                        Values:
-                        {" "}
-                        {expression.values?.join(", ")}
-                      </div>
-                    </div>
-                  ))}
-                  {webhook.namespaceSelector.matchLabels && (
-                    <div>
-                      <div>Match Labels:</div>
-                      <div className={styles.matchLabels}>
-                        {Object.entries(webhook.namespaceSelector.matchLabels).map(([key, value], index) => (
-                          <Badge label={`${key}=${value}`} key={index} />
-                        ))}
-                      </div>
-                    </div>
-                  )}
-                </div>
-              )}
-            </DrawerItem>
-            <DrawerItem name="Object Selector">
-              {webhook.objectSelector && (
-                <div>
-                  <div>Match Expressions:</div>
-                  {webhook.objectSelector.matchExpressions?.map((expression, index) => (
-                    <div key={index}>
-                      <div>
-                        Key:
-                        {" "}
-                        {expression.key}
-                      </div>
-                      <div>
-                        Operator:
-                        {" "}
-                        {expression.operator}
-                      </div>
-                      <div>
-                        Values:
-                        {" "}
-                        {expression.values?.join(", ")}
-                      </div>
-                    </div>
-                  ))}
-                  {webhook.objectSelector.matchLabels && (
-                    <div>
-                      <div>Match Labels:</div>
-                      <div className={styles.matchLabels}>
-                        {Object.entries(webhook.objectSelector.matchLabels).map(([key, value], index) => (
-                          <Badge label={`${key}=${value}`} key={index} />
-                        ))}
-                      </div>
-                    </div>
-                  )}
-                </div>
-              )}
-            </DrawerItem>
-            <DrawerItem name="Rules" className={styles.lastItem}>
-              {webhook.rules?.map((rule, index) => (
-                <div key={index}>
-                  <div>
-                    API Groups:
-                    {" "}
-                    {rule.apiGroups.join(", ")}
-                  </div>
-                  <div>
-                    API Versions:
-                    {" "}
-                    {rule.apiVersions?.join(", ")}
-                  </div>
-                  <div>
-                    Operations:
-                    {" "}
-                    {rule.operations.join(", ")}
-                  </div>
-                  {rule.resources && (
-                    <div>
-                      Resources:
-                      {" "}
-                      {rule.resources.join(", ")}
-                    </div>
-                  )}
-                  {rule.scope && (
-                    <div>
-                      Scope:
-                      {" "}
-                      {rule.scope}
-                    </div>
-                  )}
-                </div>
-              ))}
-            </DrawerItem>
-          </React.Fragment>
+          <WebhookConfig webhook={webhook} key={webhook.name} />
         ))}
       </div >
     );

packages/core/src/renderer/components/+config-mutating-webhook-configurations/webhook-config.tsx

@@ -0,0 +1,166 @@
+/**
+ * Copyright (c) OpenLens Authors. All rights reserved.
+ * Licensed under MIT License. See LICENSE in root directory for more information.
+ */
+import React from "react";
+import styles from "./webhook-config.module.css";
+import type { MutatingWebhook, ValidatingWebhook } from "../../../common/k8s-api/endpoints";
+import { DrawerItem } from "../drawer";
+import { Badge } from "../badge";
+
+interface WebhookProps {
+  webhook: ValidatingWebhook | MutatingWebhook;
+}
+
+export const WebhookConfig: React.FC<WebhookProps> = ({ webhook }) => {
+  return (
+    <>
+      <DrawerItem name="Name" className={styles.firstItem}>
+        <strong>{webhook.name}</strong>
+      </DrawerItem>
+      <DrawerItem name="Client Config">
+        {webhook.clientConfig?.service?.name && (
+          <div>
+            <div>
+              Name:
+              {" "}
+              {webhook.clientConfig.service.name}
+            </div>
+            <div>
+              Namespace:
+              {" "}
+              {webhook.clientConfig.service.namespace}
+            </div>
+          </div>
+        )}
+      </DrawerItem>
+      <DrawerItem name="Match Policy">
+        {webhook.matchPolicy}
+      </DrawerItem>
+      <DrawerItem name="Failure Policy">
+        {webhook.failurePolicy}
+      </DrawerItem>
+      <DrawerItem name="Admission Review Versions">
+        {webhook.admissionReviewVersions?.join(", ")}
+      </DrawerItem>
+      { webhook.reinvocationPolicy && (
+        <DrawerItem name="Reinvocation Policy">
+          {webhook.reinvocationPolicy}
+        </DrawerItem>
+      )}
+      <DrawerItem name="Side Effects">
+        {webhook.sideEffects}
+      </DrawerItem>
+      <DrawerItem name="Timeout Seconds">
+        {webhook.timeoutSeconds}
+      </DrawerItem>
+      <DrawerItem name="Namespace Selector">
+        {webhook.namespaceSelector && (
+          <div>
+            <div>Match Expressions:</div>
+            {webhook.namespaceSelector.matchExpressions?.map((expression, index) => (
+              <div key={index}>
+                <div>
+                  Key:
+                  {" "}
+                  {expression.key}
+                </div>
+                <div>
+                  Operator:
+                  {" "}
+                  {expression.operator}
+                </div>
+                <div>
+                  Values:
+                  {" "}
+                  {expression.values?.join(", ")}
+                </div>
+              </div>
+            ))}
+            {webhook.namespaceSelector.matchLabels && (
+              <div>
+                <div>Match Labels:</div>
+                <div className={styles.matchLabels}>
+                  {Object.entries(webhook.namespaceSelector.matchLabels).map(([key, value], index) => (
+                    <Badge label={`${key}=${value}`} key={index} />
+                  ))}
+                </div>
+              </div>
+            )}
+          </div>
+        )}
+      </DrawerItem>
+      <DrawerItem name="Object Selector">
+        {webhook.objectSelector && (
+          <div>
+            <div>Match Expressions:</div>
+            {webhook.objectSelector.matchExpressions?.map((expression, index) => (
+              <div key={index}>
+                <div>
+                  Key:
+                  {" "}
+                  {expression.key}
+                </div>
+                <div>
+                  Operator:
+                  {" "}
+                  {expression.operator}
+                </div>
+                <div>
+                  Values:
+                  {" "}
+                  {expression.values?.join(", ")}
+                </div>
+              </div>
+            ))}
+            {webhook.objectSelector.matchLabels && (
+              <div>
+                <div>Match Labels:</div>
+                <div className={styles.matchLabels}>
+                  {Object.entries(webhook.objectSelector.matchLabels).map(([key, value], index) => (
+                    <Badge label={`${key}=${value}`} key={index} />
+                  ))}
+                </div>
+              </div>
+            )}
+          </div>
+        )}
+      </DrawerItem>
+      <DrawerItem name="Rules" className={styles.lastItem}>
+        {webhook.rules?.map((rule, index) => (
+          <div key={index}>
+            <div>
+              API Groups:
+              {" "}
+              {rule.apiGroups.join(", ")}
+            </div>
+            <div>
+              API Versions:
+              {" "}
+              {rule.apiVersions?.join(", ")}
+            </div>
+            <div>
+              Operations:
+              {" "}
+              {rule.operations.join(", ")}
+            </div>
+            {rule.resources && (
+              <div>
+                Resources:
+                {" "}
+                {rule.resources.join(", ")}
+              </div>
+            )}
+            {rule.scope && (
+              <div>
+                Scope:
+                {" "}
+                {rule.scope}
+              </div>
+            )}
+          </div>
+        ))}
+      </DrawerItem>
+    </>
+  );
+};

packages/core/src/renderer/components/+config-validating-webhook-configurations/index.ts

@@ -0,0 +1,6 @@
+/**
+ * Copyright (c) OpenLens Authors. All rights reserved.
+ * Licensed under MIT License. See LICENSE in root directory for more information.
+ */
+export * from "./validating-webhook-configurations";
+export * from "./validating-webhook-configurations-details";

packages/core/src/renderer/components/+config-validating-webhook-configurations/validating-webhook-configuration-store.injectable.ts

@@ -0,0 +1,26 @@
+/**
+ * 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 { kubeObjectStoreInjectionToken } from "../../../common/k8s-api/api-manager/kube-object-store-token";
+import { ValidatingWebhookConfigurationStore } from "./validating-webhook-configuration-store";
+import clusterFrameContextForNamespacedResourcesInjectable from "../../cluster-frame-context/for-namespaced-resources.injectable";
+import loggerInjectable from "../../../common/logger.injectable";
+import validatingWebhookConfigurationApiInjectable
+  from "../../../common/k8s-api/endpoints/validating-webhook-configuration-api.injectable";
+
+const validatingWebhookConfigurationStoreInjectable = getInjectable({
+  id: "validating-webhook-configuration-store",
+  instantiate: (di) => {
+    const api = di.inject(validatingWebhookConfigurationApiInjectable);
+
+    return new ValidatingWebhookConfigurationStore({
+      context: di.inject(clusterFrameContextForNamespacedResourcesInjectable),
+      logger: di.inject(loggerInjectable),
+    }, api);
+  },
+  injectionToken: kubeObjectStoreInjectionToken,
+});
+
+export default validatingWebhookConfigurationStoreInjectable;

packages/core/src/renderer/components/+config-validating-webhook-configurations/validating-webhook-configuration-store.ts

@@ -0,0 +1,22 @@
+/**
+ * Copyright (c) OpenLens Authors. All rights reserved.
+ * Licensed under MIT License. See LICENSE in root directory for more information.
+ */
+import type {
+  ValidatingWebhookConfiguration,
+  ValidatingWebhookConfigurationApi,
+} from "../../../common/k8s-api/endpoints";
+import type {
+  KubeObjectStoreDependencies,
+  KubeObjectStoreOptions,
+} from "../../../common/k8s-api/kube-object.store";
+import { KubeObjectStore } from "../../../common/k8s-api/kube-object.store";
+
+export interface ValidatingWebhookConfigurationStoreDependencies extends KubeObjectStoreDependencies {
+}
+
+export class ValidatingWebhookConfigurationStore extends KubeObjectStore<ValidatingWebhookConfiguration, ValidatingWebhookConfigurationApi> {
+  constructor(protected readonly dependencies: ValidatingWebhookConfigurationStoreDependencies, api: ValidatingWebhookConfigurationApi, opts?: KubeObjectStoreOptions) {
+    super(dependencies, api, opts);
+  }
+}

packages/core/src/renderer/components/+config-validating-webhook-configurations/validating-webhook-configurations-details.tsx

@@ -0,0 +1,35 @@
+/**
+ * Copyright (c) OpenLens Authors. All rights reserved.
+ * Licensed under MIT License. See LICENSE in root directory for more information.
+ */
+import React from "react";
+import { observer } from "mobx-react";
+import { DrawerItem, DrawerTitle } from "../drawer";
+import type { KubeObjectDetailsProps } from "../kube-object-details";
+import { WebhookConfig } from "../+config-mutating-webhook-configurations/webhook-config";
+import type { ValidatingWebhookConfiguration } from "../../../common/k8s-api/endpoints";
+
+export interface ValidatingWebhookProps extends KubeObjectDetailsProps<ValidatingWebhookConfiguration> {
+}
+
+@observer
+export class ValidatingWebhookDetails extends React.Component<ValidatingWebhookProps> {
+  render() {
+    const { object: webhookConfig } = this.props;
+
+    return (
+      <div className="ValidatingWebhookDetails">
+        <DrawerItem name="API version">
+          {webhookConfig.apiVersion}
+        </DrawerItem>
+        <DrawerTitle>Webhooks</DrawerTitle>
+        {webhookConfig.getWebhooks()?.length == 0 && (
+          <div style={{ opacity: 0.6 }}>No webhooks set</div>
+        )}
+        {webhookConfig.getWebhooks()?.map((webhook) => (
+          <WebhookConfig webhook={webhook} key={webhook.name} />
+        ))}
+      </div >
+    );
+  }
+}

packages/core/src/renderer/components/+config-validating-webhook-configurations/validating-webhook-configurations-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 validatingWebhookConfigurationsRouteInjectable
+  from "../../../common/front-end-routing/routes/cluster/config/validating-webhook-configurations/validating-webhook-configurations-route.injectable";
+import { ValidatingWebhookConfigurations } from "./validating-webhook-configurations";
+
+const validatingWebhookConfigurationsRouteComponentInjectable = getInjectable({
+  id: "validating-webhook-configuration-route-component",
+
+  instantiate: (di) => ({
+    route: di.inject(validatingWebhookConfigurationsRouteInjectable),
+    Component: ValidatingWebhookConfigurations,
+  }),
+
+  injectionToken: routeSpecificComponentInjectionToken,
+});
+
+export default validatingWebhookConfigurationsRouteComponentInjectable;

packages/core/src/renderer/components/+config-validating-webhook-configurations/validating-webhook-configurations-sidebar-items.injectable.ts

@@ -0,0 +1,39 @@
+/**
+ * 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 { computed } from "mobx";
+import { sidebarItemsInjectionToken } from "../layout/sidebar-items.injectable";
+import routeIsActiveInjectable from "../../routes/route-is-active.injectable";
+import validatingWebhookConfigurationsRouteInjectable
+  from "../../../common/front-end-routing/routes/cluster/config/validating-webhook-configurations/validating-webhook-configurations-route.injectable";
+import navigateToValidatingWebhookConfigurationsInjectable
+  from "../../../common/front-end-routing/routes/cluster/config/validating-webhook-configurations/navigate-to-validating-webhook-configurations.injectable";
+import { configSidebarItemId } from "../+config/config-sidebar-items.injectable";
+
+const validatingWebhookConfigurationsSidebarItemsInjectable = getInjectable({
+  id: "validating-webhook-configurations-sidebar-items",
+
+  instantiate: (di) => {
+    const route = di.inject(validatingWebhookConfigurationsRouteInjectable);
+    const navigateToPage = di.inject(navigateToValidatingWebhookConfigurationsInjectable);
+    const routeIsActive = di.inject(routeIsActiveInjectable, route);
+
+    return computed(() => [
+      {
+        id: "validating-webhook-configurations",
+        parentId: configSidebarItemId,
+        title: "Validating Webhook Configs",
+        onClick: navigateToPage,
+        isActive: routeIsActive,
+        isVisible: route.isEnabled,
+        orderNumber: 100,
+      },
+    ]);
+  },
+
+  injectionToken: sidebarItemsInjectionToken,
+});
+
+export default validatingWebhookConfigurationsSidebarItemsInjectable;

packages/core/src/renderer/components/+config-validating-webhook-configurations/validating-webhook-configurations.tsx

@@ -0,0 +1,73 @@
+/**
+ * Copyright (c) OpenLens Authors. All rights reserved.
+ * Licensed under MIT License. See LICENSE in root directory for more information.
+ */
+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 type { ValidatingWebhookConfigurationStore } from "./validating-webhook-configuration-store";
+import { withInjectables } from "@ogre-tools/injectable-react";
+import validatingWebhookConfigurationsStoreInjectable from "./validating-webhook-configuration-store.injectable";
+import { KubeObjectAge } from "../kube-object/age";
+
+enum columnId {
+  name = "name",
+  webhooks = "webhooks",
+  age = "age",
+}
+
+interface Dependencies {
+  store: ValidatingWebhookConfigurationStore;
+}
+
+const NonInjectedValidatingWebhookConfigurations = observer((props: Dependencies) => {
+  return (
+    <SiblingsInTabLayout>
+      <KubeObjectListLayout
+        isConfigurable
+        customizeHeader={({ searchProps, ...rest }) => ({
+          ...rest,
+          searchProps: {
+            ...searchProps,
+            placeholder: "Search...",
+          },
+        })}
+        tableId="config_validating_webhook_configurations"
+        className={"ValidatingWebhookConfigurations"}
+        store={props.store}
+        sortingCallbacks={{
+          [columnId.name]: item => item.getName(),
+          [columnId.webhooks]: item => item.getWebhooks().length,
+          [columnId.age]: item => -item.getCreationTimestamp(),
+        }}
+        searchFilters={[
+          item => item.getSearchFields(),
+          item => item.getLabels(),
+        ]}
+        renderHeaderTitle="Validating Webhook Configs"
+        renderTableHeader={[
+          { title: "Name", className: "name", sortBy: columnId.name, id: columnId.name },
+          {
+            title: "Webhooks",
+            sortBy: columnId.webhooks,
+            id: columnId.webhooks,
+          },
+          { title: "Age", className: "age", sortBy: columnId.age, id: columnId.age },
+        ]}
+        renderTableContents={item => [
+          item.getName(),
+          item.getWebhooks().length,
+          <KubeObjectAge key="age" object={item} />,
+        ]}
+      />
+    </SiblingsInTabLayout>
+  );
+});
+
+export const ValidatingWebhookConfigurations = withInjectables<Dependencies>(NonInjectedValidatingWebhookConfigurations, {
+  getProps: (di, props) => ({
+    ...props,
+    store: di.inject(validatingWebhookConfigurationsStoreInjectable),
+  }),
+});

packages/core/src/renderer/components/kube-object-details/kube-object-detail-items/implementations/validating-webhook-configurations-details-item.injectable.ts

@@ -0,0 +1,33 @@
+/**
+ * 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 { kubeObjectDetailItemInjectionToken } from "../kube-object-detail-item-injection-token";
+import { computed } from "mobx";
+import { kubeObjectMatchesToKindAndApiVersion } from "../kube-object-matches-to-kind-and-api-version";
+import currentKubeObjectInDetailsInjectable from "../../current-kube-object-in-details.injectable";
+import { ValidatingWebhookDetails } from "../../../+config-validating-webhook-configurations";
+
+const validatingWebhookConfigurationDetailItemInjectable = getInjectable({
+  id: "validating-webhook-configuration-detail-item",
+
+  instantiate(di) {
+    const kubeObject = di.inject(currentKubeObjectInDetailsInjectable);
+
+    return {
+      Component: ValidatingWebhookDetails,
+      enabled: computed(() => isValidatingWebhookConfiguration(kubeObject.value.get()?.object)),
+      orderNumber: 10,
+    };
+  },
+
+  injectionToken: kubeObjectDetailItemInjectionToken,
+});
+
+export const isValidatingWebhookConfiguration = kubeObjectMatchesToKindAndApiVersion(
+  "ValidatingWebhookConfiguration",
+  ["v1", "admissionregistration.k8s.io/v1beta1", "admissionregistration.k8s.io/v1"],
+);
+
+export default validatingWebhookConfigurationDetailItemInjectable;