From 1d21c8a6ea5164134d725d30a014c2999fcbe06a Mon Sep 17 00:00:00 2001
From: Bipul Adhikari <badhikar@redhat.com>
Date: Wed, 7 Feb 2024 16:00:15 +0545
Subject: [PATCH] Adds fallback layer for multi cluster code in External mode

Signed-off-by: Bipul Adhikari <badhikar@redhat.com>
---
 .../persistent-external/breakdown-card.tsx    |  4 +-
 .../persistent-external/fallback-hook.ts      | 37 +++++++++++++++++++
 .../persistent-external/utilization-card.tsx  |  4 +-
 3 files changed, 43 insertions(+), 2 deletions(-)
 create mode 100644 packages/ocs/dashboards/persistent-external/fallback-hook.ts

diff --git a/packages/ocs/dashboards/persistent-external/breakdown-card.tsx b/packages/ocs/dashboards/persistent-external/breakdown-card.tsx
index 421a56781..3bb8711e8 100644
--- a/packages/ocs/dashboards/persistent-external/breakdown-card.tsx
+++ b/packages/ocs/dashboards/persistent-external/breakdown-card.tsx
@@ -37,6 +37,7 @@ import {
   TitleWithHelp,
 } from '../persistent-internal/capacity-breakdown-card/capacity-breakdown-card';
 import '../persistent-internal/capacity-breakdown-card/capacity-breakdown-card.scss';
+import useClientFallback from './fallback-hook';
 
 export const BreakdownCard: React.FC = () => {
   const { t } = useCustomTranslation();
@@ -51,7 +52,8 @@ export const BreakdownCard: React.FC = () => {
   const { systemFlags } = useODFSystemFlagsSelector();
 
   // name of created StorageClasses are prefix by StorageCluster name
-  const storageClassNamePrefix = systemFlags[clusterNs]?.ocsClusterName;
+  const storageClassName = systemFlags?.[clusterNs]?.ocsClusterName;
+  const storageClassNamePrefix = useClientFallback(storageClassName);
 
   const { queries, model, metric } = getBreakdownMetricsQuery(
     metricType,
diff --git a/packages/ocs/dashboards/persistent-external/fallback-hook.ts b/packages/ocs/dashboards/persistent-external/fallback-hook.ts
new file mode 100644
index 000000000..4d7ee41c3
--- /dev/null
+++ b/packages/ocs/dashboards/persistent-external/fallback-hook.ts
@@ -0,0 +1,37 @@
+import { StorageClassModel } from '@odf/shared/models';
+import { StorageClassResourceKind } from '@odf/shared/types';
+import { referenceForModel } from '@odf/shared/utils';
+import {
+  WatchK8sResource,
+  useK8sWatchResource,
+} from '@openshift-console/dynamic-plugin-sdk';
+
+const scResource: WatchK8sResource = {
+  isList: true,
+  kind: referenceForModel(StorageClassModel),
+};
+
+const fsProvisionerPostFix = '.cephfs.csi.ceph.com';
+
+/**
+ * This hooks is for ODF Client Mode use case only.
+ * ODF client mode doesn't deploy ODF StorageCluster hence falling back to StorageClases.
+ */
+const useClientFallback = (storageClusterName) => {
+  const [storageClasses, storageClassesLoaded, storageClassLoadError] =
+    useK8sWatchResource<StorageClassResourceKind[]>(scResource);
+  if (storageClusterName) {
+    return storageClusterName;
+  }
+
+  const provisioners = storageClasses.map((sc) => sc.provisioner);
+  const fileSystemProvisioner = provisioners.find((item) =>
+    item.includes(fsProvisionerPostFix)
+  );
+  const clusterName = fileSystemProvisioner?.split(fsProvisionerPostFix)?.[0];
+  return storageClassesLoaded && !storageClassLoadError
+    ? clusterName
+    : 'ocs-storagecluster';
+};
+
+export default useClientFallback;
diff --git a/packages/ocs/dashboards/persistent-external/utilization-card.tsx b/packages/ocs/dashboards/persistent-external/utilization-card.tsx
index efef3cf5e..2c41705ae 100644
--- a/packages/ocs/dashboards/persistent-external/utilization-card.tsx
+++ b/packages/ocs/dashboards/persistent-external/utilization-card.tsx
@@ -21,6 +21,7 @@ import {
   INDEPENDENT_UTILIZATION_QUERIES,
 } from '../../queries';
 import { ODFSystemParams } from '../../types';
+import useClientFallback from './fallback-hook';
 
 export const UtilizationContent: React.FC = () => {
   const { t } = useCustomTranslation();
@@ -29,7 +30,8 @@ export const UtilizationContent: React.FC = () => {
   const { systemFlags } = useODFSystemFlagsSelector();
 
   // name of created StorageClasses are prefix by StorageCluster name
-  const storageClassNamePrefix = systemFlags[clusterNs]?.ocsClusterName;
+  const storageClassName = systemFlags?.[clusterNs]?.ocsClusterName;
+  const storageClassNamePrefix = useClientFallback(storageClassName);
 
   return (
     <UtilizationBody>