feat: Support PodDisruptionBudget resource

assets/src/components/kubernetes/cluster/Cluster.tsx

@@ -8,6 +8,7 @@ import {
   NAMESPACES_REL_PATH,
   NODES_REL_PATH,
   getClusterAbsPath,
+  PDBS_REL_PATH,
 } from '../../../routes/kubernetesRoutesConsts'
 import { ScrollablePage } from '../../utils/layout/ScrollablePage'
 import { LinkTabWrap } from '../../utils/Tabs'
@@ -34,6 +35,7 @@ const directory = [
   { path: EVENTS_REL_PATH, label: 'Events' },
   { path: NAMESPACES_REL_PATH, label: 'Namespaces' },
   { path: HPAS_REL_PATH, label: 'Horizontal Pod Autoscalers' },
+  { path: PDBS_REL_PATH, label: 'Pod Disruption Budgets' },
 ] as const
 
 export default function Cluster() {

assets/src/components/kubernetes/cluster/PodDisruptionBudget.tsx

@@ -0,0 +1,117 @@
+import { ReactElement, useMemo } from 'react'
+import { Outlet, useParams } from 'react-router-dom'
+import { SidecarItem, useSetBreadcrumbs } from '@pluralsh/design-system'
+
+import ResourceDetails, { TabEntry } from '../common/ResourceDetails'
+import { MetadataSidecar } from '../common/utils'
+import {
+  PodDisruptionBudgetQueryVariables,
+  usePodDisruptionBudgetQuery,
+} from '../../../generated/graphql-kubernetes'
+import { KubernetesClient } from '../../../helpers/kubernetes.client'
+import {
+  getResourceDetailsAbsPath,
+  getClusterAbsPath,
+  PDBS_REL_PATH,
+} from '../../../routes/kubernetesRoutesConsts'
+import { NAMESPACE_PARAM } from '../Navigation'
+import LoadingIndicator from '../../utils/LoadingIndicator'
+import { useCluster } from '../Cluster'
+import { Kind } from '../common/types'
+
+import { getBreadcrumbs } from './PodDisruptionBudgets'
+import { LabelSelector } from '../common/LabelSelector.tsx'
+import { isNullish } from '@apollo/client/cache/inmemory/helpers'
+
+const directory: Array<TabEntry> = [{ path: '', label: 'Raw' }] as const
+
+export default function PodDisruptionBudget(): ReactElement<any> {
+  const cluster = useCluster()
+  const { clusterId, name = '', namespace = '' } = useParams()
+  const { data, loading } = usePodDisruptionBudgetQuery({
+    client: KubernetesClient(clusterId ?? ''),
+    skip: !clusterId,
+    pollInterval: 30_000,
+    variables: { name, namespace } as PodDisruptionBudgetQueryVariables,
+  })
+
+  const pdb = data?.handleGetPodDisruptionBudgetDetail
+
+  useSetBreadcrumbs(
+    useMemo(
+      () => [
+        ...getBreadcrumbs(cluster),
+        {
+          label: namespace ?? '',
+          url: `${getClusterAbsPath(
+            cluster?.id
+          )}/${PDBS_REL_PATH}?${NAMESPACE_PARAM}=${namespace}`,
+        },
+        {
+          label: name ?? '',
+          url: getResourceDetailsAbsPath(
+            clusterId,
+            Kind.PodDisruptionBudget,
+            name,
+            namespace
+          ),
+        },
+      ],
+      [cluster, clusterId, name, namespace]
+    )
+  )
+
+  if (loading) return <LoadingIndicator />
+
+  return (
+    <ResourceDetails
+      tabs={directory}
+      sidecar={
+        <MetadataSidecar resource={pdb}>
+          {pdb?.labelSelector && (
+            <SidecarItem heading="Label selector">
+              <LabelSelector selector={pdb?.labelSelector} />
+            </SidecarItem>
+          )}
+          {!isNullish(pdb?.minAvailable) && (
+            <SidecarItem heading="Min available">
+              {pdb?.minAvailable}
+            </SidecarItem>
+          )}
+          {!isNullish(pdb?.maxUnavailable) && (
+            <SidecarItem heading="Max unavailable">
+              {pdb?.maxUnavailable}
+            </SidecarItem>
+          )}
+          {pdb?.unhealthyPodEvictionPolicy && (
+            <SidecarItem heading="Unhealthy Pod eviction policy">
+              {pdb?.unhealthyPodEvictionPolicy}
+            </SidecarItem>
+          )}
+          {!isNullish(pdb?.currentHealthy) && (
+            <SidecarItem heading="Current healthy">
+              {pdb?.currentHealthy}
+            </SidecarItem>
+          )}
+          {!isNullish(pdb?.desiredHealthy) && (
+            <SidecarItem heading="Desired healthy">
+              {pdb?.desiredHealthy}
+            </SidecarItem>
+          )}
+          {!isNullish(pdb?.disruptionsAllowed) && (
+            <SidecarItem heading="Disruptions allowed">
+              {pdb?.disruptionsAllowed}
+            </SidecarItem>
+          )}
+          {!isNullish(pdb?.expectedPods) && (
+            <SidecarItem heading="Expected Pods">
+              {pdb?.expectedPods}
+            </SidecarItem>
+          )}
+        </MetadataSidecar>
+      }
+    >
+      <Outlet context={pdb} />
+    </ResourceDetails>
+  )
+}

assets/src/components/kubernetes/cluster/PodDisruptionBudgets.tsx

@@ -0,0 +1,80 @@
+import { createColumnHelper } from '@tanstack/react-table'
+import { useMemo } from 'react'
+import { useSetBreadcrumbs } from '@pluralsh/design-system'
+
+import {
+  Maybe,
+  Poddisruptionbudget_PodDisruptionBudgetList as PodDisruptionBudgetListT,
+  Poddisruptionbudget_PodDisruptionBudget as PodDisruptionBudgetT,
+  usePodDisruptionBudgetsQuery,
+  PodDisruptionBudgetsQuery,
+  PodDisruptionBudgetsQueryVariables,
+} from '../../../generated/graphql-kubernetes'
+import { useDefaultColumns } from '../common/utils'
+import { ResourceList } from '../common/ResourceList'
+import { KubernetesClusterFragment } from '../../../generated/graphql'
+import {
+  getClusterAbsPath,
+  PDBS_REL_PATH,
+} from '../../../routes/kubernetesRoutesConsts'
+import { useCluster } from '../Cluster'
+
+import { getClusterBreadcrumbs } from './Cluster.tsx'
+
+export const getBreadcrumbs = (cluster?: Maybe<KubernetesClusterFragment>) => [
+  ...getClusterBreadcrumbs(cluster),
+  {
+    label: 'pod disruption budgets',
+    url: `${getClusterAbsPath(cluster?.id)}/${PDBS_REL_PATH}`,
+  },
+]
+
+const columnHelper = createColumnHelper<PodDisruptionBudgetT>()
+
+export const usePodDisruptionBudgetListColumns = () => {
+  const { colAction, colName, colNamespace, colLabels, colCreationTimestamp } =
+    useDefaultColumns(columnHelper)
+
+  return useMemo(
+    () => [
+      colName,
+      colNamespace,
+      columnHelper.accessor((pdb) => pdb.minAvailable, {
+        id: 'minAvailable',
+        header: 'Min available',
+        cell: ({ getValue }) => getValue(),
+      }),
+      columnHelper.accessor((pdb) => pdb.maxUnavailable, {
+        id: 'maxUnavailable',
+        header: 'Max unavailable',
+        cell: ({ getValue }) => getValue(),
+      }),
+      colLabels,
+      colCreationTimestamp,
+      colAction,
+    ],
+    [colCreationTimestamp, colLabels, colName, colNamespace, colAction]
+  )
+}
+
+export default function PodDisruptionBudgets() {
+  const cluster = useCluster()
+  const columns = usePodDisruptionBudgetListColumns()
+
+  useSetBreadcrumbs(useMemo(() => getBreadcrumbs(cluster), [cluster]))
+
+  return (
+    <ResourceList<
+      PodDisruptionBudgetListT,
+      PodDisruptionBudgetT,
+      PodDisruptionBudgetsQuery,
+      PodDisruptionBudgetsQueryVariables
+    >
+      namespaced
+      columns={columns}
+      query={usePodDisruptionBudgetsQuery}
+      queryName="handleGetPodDisruptionBudgetList"
+      itemsKey="items"
+    />
+  )
+}

assets/src/components/kubernetes/common/types.ts

@@ -77,6 +77,7 @@ enum Kind {
   Event = 'event',
   Namespace = 'namespace',
   HorizontalPodAutoscaler = 'horizontalpodautoscaler',
+  PodDisruptionBudget = 'poddisruptionbudget',
   // CRD
   CustomResourceDefinition = 'customresourcedefinition',
   None = '',