From f715f2cac76e9193d192e4348247a7c6406b02d8 Mon Sep 17 00:00:00 2001
From: Marcin Maciaszczyk <marcin9yk@icloud.com>
Date: Fri, 29 Mar 2024 12:00:55 +0100
Subject: [PATCH] fix pvc

---
 .../kubernetes/storage/PersistentVolume.tsx   | 53 +++++++++++++++++--
 .../kubernetes/storage/PersistentVolumes.tsx  |  2 +-
 assets/src/generated/graphql-kubernetes.ts    |  2 +-
 .../storage/persistentvolumeclaim.graphql     |  2 +-
 4 files changed, 53 insertions(+), 6 deletions(-)

diff --git a/assets/src/components/kubernetes/storage/PersistentVolume.tsx b/assets/src/components/kubernetes/storage/PersistentVolume.tsx
index 1b22020c17..e6049a9a5f 100644
--- a/assets/src/components/kubernetes/storage/PersistentVolume.tsx
+++ b/assets/src/components/kubernetes/storage/PersistentVolume.tsx
@@ -1,6 +1,10 @@
 import { ReactElement, useMemo } from 'react'
-import { useSetBreadcrumbs } from '@pluralsh/design-system'
-import { Outlet, useOutletContext, useParams } from 'react-router-dom'
+import {
+  ChipList,
+  SidecarItem,
+  useSetBreadcrumbs,
+} from '@pluralsh/design-system'
+import { Link, Outlet, useOutletContext, useParams } from 'react-router-dom'
 
 import {
   ConfigMapQueryVariables,
@@ -14,7 +18,10 @@ import { getResourceDetailsAbsPath } from '../../../routes/kubernetesRoutesConst
 
 import ResourceDetails, { TabEntry } from '../ResourceDetails'
 
+import { InlineLink } from '../../utils/typography/InlineLink'
+
 import { getBreadcrumbs } from './PersistentVolumes'
+import { PVStatusChip } from './utils'
 
 const directory: Array<TabEntry> = [
   { path: '', label: 'Info' },
@@ -48,12 +55,52 @@ export default function PersistentVolume(): ReactElement {
     )
   )
 
+  const [claimNamespace, claimName] = (pv?.claim ?? '').split('/')
+
   if (loading) return <LoadingIndicator />
 
   return (
     <ResourceDetails
       tabs={directory}
-      sidecar={<MetadataSidecar objectMeta={pv?.objectMeta} />}
+      sidecar={
+        <MetadataSidecar objectMeta={pv?.objectMeta}>
+          <SidecarItem heading="Claim">
+            <Link
+              to={getResourceDetailsAbsPath(
+                cluster?.id,
+                'persistentvolumeclaim',
+                claimName ?? '',
+                claimNamespace
+              )}
+            >
+              <InlineLink>{pv?.claim}</InlineLink>
+            </Link>
+          </SidecarItem>
+          <SidecarItem heading="Storage class">
+            <Link
+              to={getResourceDetailsAbsPath(
+                cluster?.id,
+                'storageclass',
+                pv?.storageClass ?? ''
+              )}
+            >
+              <InlineLink>{pv?.storageClass}</InlineLink>
+            </Link>
+          </SidecarItem>
+          <SidecarItem heading="Status">
+            <PVStatusChip status={pv?.status} />
+          </SidecarItem>
+          <SidecarItem heading="Access modes">
+            <ChipList
+              size="small"
+              limit={1}
+              values={Object.entries(pv?.accessModes || {})}
+              transformValue={(accessModes) => accessModes.join(': ')}
+              emptyState={null}
+            />
+          </SidecarItem>
+        </MetadataSidecar>
+      }
     >
       <Outlet context={pv} />
     </ResourceDetails>
diff --git a/assets/src/components/kubernetes/storage/PersistentVolumes.tsx b/assets/src/components/kubernetes/storage/PersistentVolumes.tsx
index a459df73bd..e9c71fab03 100644
--- a/assets/src/components/kubernetes/storage/PersistentVolumes.tsx
+++ b/assets/src/components/kubernetes/storage/PersistentVolumes.tsx
@@ -53,7 +53,7 @@ export const colClaim = columnHelper.accessor((pv) => pv.claim, {
     const { cluster } = table.options.meta as {
       cluster?: ClusterTinyFragment
     }
-    const [name, namespace] = (getValue() ?? '').split('/')
+    const [namespace, name] = (getValue() ?? '').split('/')
 
     return (
       <Link
diff --git a/assets/src/generated/graphql-kubernetes.ts b/assets/src/generated/graphql-kubernetes.ts
index 85a95ee791..a06523dfa7 100644
--- a/assets/src/generated/graphql-kubernetes.ts
+++ b/assets/src/generated/graphql-kubernetes.ts
@@ -6492,7 +6492,7 @@ export type PersistentVolumeClaimsSuspenseQueryHookResult = ReturnType<typeof us
 export type PersistentVolumeClaimsQueryResult = Apollo.QueryResult<PersistentVolumeClaimsQuery, PersistentVolumeClaimsQueryVariables>;
 export const PersistentVolumeClaimDocument = gql`
     query PersistentVolumeClaim($name: String!, $namespace: String!) {
-  handleGetPersistentVolumeClaimDetail(namespace: $namespace, name: $name) @rest(type: "persistentvolumeclaim_PersistentVolumeClaim", path: "persistentvolumeclaim/{args.namespace}/{args.name}") {
+  handleGetPersistentVolumeClaimDetail(namespace: $namespace, name: $name) @rest(type: "persistentvolumeclaim_PersistentVolumeClaimDetail", path: "persistentvolumeclaim/{args.namespace}/{args.name}") {
     ...PersistentVolumeClaimDetail
   }
 }
diff --git a/assets/src/graph-kubernetes/storage/persistentvolumeclaim.graphql b/assets/src/graph-kubernetes/storage/persistentvolumeclaim.graphql
index bf8905a485..3e1c17be1e 100644
--- a/assets/src/graph-kubernetes/storage/persistentvolumeclaim.graphql
+++ b/assets/src/graph-kubernetes/storage/persistentvolumeclaim.graphql
@@ -23,7 +23,7 @@ query PersistentVolumeClaims(
 query PersistentVolumeClaim($name: String!, $namespace: String!) {
   handleGetPersistentVolumeClaimDetail(namespace: $namespace, name: $name)
     @rest(
-      type: "persistentvolumeclaim_PersistentVolumeClaim"
+      type: "persistentvolumeclaim_PersistentVolumeClaimDetail"
       path: "persistentvolumeclaim/{args.namespace}/{args.name}"
     ) {
     ...PersistentVolumeClaimDetail