From cad4f3508fe301532a71e4bd04986f7113df406d Mon Sep 17 00:00:00 2001
From: UncleGedd <42304551+UncleGedd@users.noreply.github.com>
Date: Wed, 31 Jul 2024 08:03:28 -0500
Subject: [PATCH] feat(ui): adds validatingwebhooks view (#110)

## Description

Adds validatingwebhooks view
---
 .../validatingwebhooks/component.svelte       | 11 +++++++
 .../validatingwebhooks/component.test.ts      | 21 ++++++++++++
 .../cluster-ops/validatingwebhooks/store.ts   | 33 +++++++++++++++++++
 ui/src/lib/features/k8s/index.ts              |  1 +
 .../validating-webhooks/+page.svelte          |  6 +++-
 5 files changed, 71 insertions(+), 1 deletion(-)
 create mode 100644 ui/src/lib/features/k8s/cluster-ops/validatingwebhooks/component.svelte
 create mode 100644 ui/src/lib/features/k8s/cluster-ops/validatingwebhooks/component.test.ts
 create mode 100644 ui/src/lib/features/k8s/cluster-ops/validatingwebhooks/store.ts

diff --git a/ui/src/lib/features/k8s/cluster-ops/validatingwebhooks/component.svelte b/ui/src/lib/features/k8s/cluster-ops/validatingwebhooks/component.svelte
new file mode 100644
index 00000000..d9de42ec
--- /dev/null
+++ b/ui/src/lib/features/k8s/cluster-ops/validatingwebhooks/component.svelte
@@ -0,0 +1,11 @@
+<!-- SPDX-License-Identifier: Apache-2.0 -->
+<!-- SPDX-FileCopyrightText: 2024-Present The UDS Authors -->
+
+<script lang="ts">
+  import { DataTable } from '$components'
+  import { createStore, type Columns } from './store'
+
+  export let columns: Columns = [['name', 'emphasize'], ['webhooks'], ['age']]
+</script>
+
+<DataTable {columns} {createStore} />
diff --git a/ui/src/lib/features/k8s/cluster-ops/validatingwebhooks/component.test.ts b/ui/src/lib/features/k8s/cluster-ops/validatingwebhooks/component.test.ts
new file mode 100644
index 00000000..065e0b32
--- /dev/null
+++ b/ui/src/lib/features/k8s/cluster-ops/validatingwebhooks/component.test.ts
@@ -0,0 +1,21 @@
+// SPDX-License-Identifier: Apache-2.0
+// SPDX-FileCopyrightText: 2024-Present The UDS Authors
+
+import '@testing-library/jest-dom'
+
+import { testK8sTableWithCustomColumns, testK8sTableWithDefaults } from '$features/k8s/test-helper'
+import Component from './component.svelte'
+import { createStore } from './store'
+
+suite('EventTable Component', () => {
+  beforeEach(() => {
+    vi.clearAllMocks()
+  })
+
+  testK8sTableWithDefaults(Component, {
+    createStore,
+    columns: [['name', 'emphasize'], ['webhooks'], ['age']],
+  })
+
+  testK8sTableWithCustomColumns(Component, { createStore })
+})
diff --git a/ui/src/lib/features/k8s/cluster-ops/validatingwebhooks/store.ts b/ui/src/lib/features/k8s/cluster-ops/validatingwebhooks/store.ts
new file mode 100644
index 00000000..79a3b592
--- /dev/null
+++ b/ui/src/lib/features/k8s/cluster-ops/validatingwebhooks/store.ts
@@ -0,0 +1,33 @@
+// SPDX-License-Identifier: Apache-2.0
+// SPDX-FileCopyrightText: 2024-Present The UDS Authors
+
+import type { V1ValidatingWebhookConfiguration as Resource } from '@kubernetes/client-node'
+
+import { ResourceStore, transformResource } from '$features/k8s/store'
+import { type ColumnWrapper, type CommonRow, type ResourceStoreInterface } from '$features/k8s/types'
+
+export interface Row extends CommonRow {
+  webhooks: string
+}
+
+export type Columns = ColumnWrapper<Row>
+
+export function createStore(): ResourceStoreInterface<Resource, Row> {
+  const url = `/api/v1/resources/cluster-ops/validatingwebhooks?dense=true`
+
+  const transform = transformResource<Resource, Row>((r) => ({
+    webhooks:
+      r.webhooks
+        ?.map((w) => w.name)
+        .sort()
+        .join(', ') ?? '',
+  }))
+
+  const store = new ResourceStore<Resource, Row>('name', true)
+
+  return {
+    ...store,
+    start: () => store.start(url, transform),
+    sortByKey: store.sortByKey.bind(store),
+  }
+}
diff --git a/ui/src/lib/features/k8s/index.ts b/ui/src/lib/features/k8s/index.ts
index 05562836..3b595561 100644
--- a/ui/src/lib/features/k8s/index.ts
+++ b/ui/src/lib/features/k8s/index.ts
@@ -28,6 +28,7 @@ export { default as PodDisruptionBudgetsTable } from './cluster-ops/pod-disrupti
 export { default as PriorityClassesTable } from './cluster-ops/priority-classes/component.svelte'
 export { default as ResourceQuotasTable } from './cluster-ops/resource-quotas/component.svelte'
 export { default as RuntimeClassesTable } from './cluster-ops/runtime-classes/component.svelte'
+export { default as ValidatingWebhooksTable } from './cluster-ops/validatingwebhooks/component.svelte'
 
 // Network resources
 export { default as EndpointTable } from './networks/endpoints/component.svelte'
diff --git a/ui/src/routes/(resources)/cluster-ops/validating-webhooks/+page.svelte b/ui/src/routes/(resources)/cluster-ops/validating-webhooks/+page.svelte
index 553cb8a1..ea358eaa 100644
--- a/ui/src/routes/(resources)/cluster-ops/validating-webhooks/+page.svelte
+++ b/ui/src/routes/(resources)/cluster-ops/validating-webhooks/+page.svelte
@@ -1,4 +1,8 @@
 <!-- SPDX-License-Identifier: Apache-2.0 -->
 <!-- SPDX-FileCopyrightText: 2024-Present The UDS Authors -->
 
-<h1 class="text-white text-5xl">Validating Webhooks</h1>
+<script lang="ts">
+  import { ValidatingWebhooksTable } from '$features/k8s'
+</script>
+
+<ValidatingWebhooksTable />