From e8d042d4e29bc3eae8420c743016a053dc38d522 Mon Sep 17 00:00:00 2001
From: Dan Labrecque <dlabrecq@redhat.com>
Date: Tue, 9 Apr 2024 12:47:37 -0400
Subject: [PATCH] Cluster info link fix

https://issues.redhat.com/browse/COST-4559
---
 .../components/breakdown/breakdownHeader.tsx  | 19 ++++++++++---------
 1 file changed, 10 insertions(+), 9 deletions(-)

diff --git a/src/routes/details/components/breakdown/breakdownHeader.tsx b/src/routes/details/components/breakdown/breakdownHeader.tsx
index fc97f1b7e..f57fd1d66 100644
--- a/src/routes/details/components/breakdown/breakdownHeader.tsx
+++ b/src/routes/details/components/breakdown/breakdownHeader.tsx
@@ -136,6 +136,8 @@ class BreakdownHeader extends React.Component<BreakdownHeaderProps, any> {
             ? orgUnitIdKey
             : groupBy;
 
+    const showClusterInfo = clusterInfoComponent && isClusterInfoToggleEnabled;
+
     return (
       <header style={styles.header}>
         <Flex justifyContent={{ default: 'justifyContentSpaceBetween' }} style={styles.headerContent}>
@@ -166,15 +168,14 @@ class BreakdownHeader extends React.Component<BreakdownHeaderProps, any> {
         <Flex justifyContent={{ default: 'justifyContentSpaceBetween' }} style={styles.perspectiveContainer}>
           <FlexItem>
             <Flex direction={{ default: 'column' }}>
-              {description ||
-                (clusterInfoComponent && isClusterInfoToggleEnabled && (
-                  <FlexItem style={styles.description}>
-                    {description}
-                    {clusterInfoComponent && isClusterInfoToggleEnabled ? (
-                      <span style={!description ? styles.clusterInfoContainer : undefined}>{clusterInfoComponent}</span>
-                    ) : null}
-                  </FlexItem>
-                ))}
+              {(description || showClusterInfo) && (
+                <FlexItem style={styles.description}>
+                  {description}
+                  {showClusterInfo ? (
+                    <span style={!description ? styles.clusterInfoContainer : undefined}>{clusterInfoComponent}</span>
+                  ) : null}
+                </FlexItem>
+              )}
               {dataDetailsComponent && isClusterInfoToggleEnabled ? <FlexItem>{dataDetailsComponent}</FlexItem> : null}
               {showCostDistribution && (
                 <FlexItem style={styles.costDistribution}>