feat(ui): adds validatingwebhooks view (#110)

## Description

Adds validatingwebhooks view

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} />

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 })
+})

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),
+  }
+}

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'

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 />