Change collapsed view host in networking configuration

openshift-assisted · Nov 6, 2024 · 0a81f5a · 0a81f5a
1 parent 7456a33
commit 0a81f5a
Show file tree

Hide file tree

Showing 3 changed files with 31 additions and 5 deletions.
diff --git a/libs/ui-lib/lib/ocm/components/clusterConfiguration/staticIp/components/CollapsedHost.tsx b/libs/ui-lib/lib/ocm/components/clusterConfiguration/staticIp/components/CollapsedHost.tsx
@@ -17,6 +17,21 @@ export type HostSummaryProps = {
   numInterfaces: number;
   hostIdx: number;
   hasError: boolean;
+  bondPrimaryInterface: string;
+  bondSecondaryInterface: string;
+};
+
+const getLabelCollapsedHost = (
+  macAddress: string,
+  mappingValue: string,
+  bondPrimaryInterface: string,
+  bondSecondaryInterface: string,
+) => {
+  if (bondPrimaryInterface !== '' && bondSecondaryInterface !== '') {
+    return `${bondPrimaryInterface}/${bondSecondaryInterface} -> ${mappingValue}`;
+  } else {
+    return `${macAddress} -> ${mappingValue}`;
+  }
 };
 
 const HostSummary: React.FC<HostSummaryProps> = ({
@@ -26,6 +41,8 @@ const HostSummary: React.FC<HostSummaryProps> = ({
   numInterfaces,
   hasError,
   hostIdx,
+  bondPrimaryInterface,
+  bondSecondaryInterface,
 }) => {
   return (
     <>
@@ -49,10 +66,14 @@ const HostSummary: React.FC<HostSummaryProps> = ({
           {!hasError && (
             <>
               <FlexItem>
-                <Label
-                  variant="outline"
-                  data-testid="first-mapping-label"
-                >{`${macAddress} -> ${mappingValue}`}</Label>{' '}
+                <Label variant="outline" data-testid="first-mapping-label">
+                  {getLabelCollapsedHost(
+                    macAddress,
+                    mappingValue,
+                    bondPrimaryInterface,
+                    bondSecondaryInterface,
+                  )}
+                </Label>{' '}
               </FlexItem>
               {numInterfaces > 1 && (
                 <FlexItem>

diff --git a/...components/clusterConfiguration/staticIp/components/FormViewHosts/FormViewHostsFields.tsx b/...components/clusterConfiguration/staticIp/components/FormViewHosts/FormViewHostsFields.tsx
@@ -123,14 +123,17 @@ const getCollapsedHostComponent = (protocolType: StaticProtocolType) => {
       (protocolVersion) => value.ips[protocolVersion],
     );
     const mapValue = ipAddresses.join(', ');
+
     return (
       <HostSummary
-        title="MAC to IP mapping"
+        title={value.useBond ? 'Bonds to IP mapping' : 'MAC to IP mapping'}
         numInterfaces={1}
         macAddress={value.macAddress}
         mappingValue={mapValue}
         hostIdx={hostIdx}
         hasError={!!error}
+        bondPrimaryInterface={value.bondPrimaryInterface}
+        bondSecondaryInterface={value.bondSecondaryInterface}
       />
     );
   };

diff --git a/...b/lib/ocm/components/clusterConfiguration/staticIp/components/YamlView/YamlViewFields.tsx b/...b/lib/ocm/components/clusterConfiguration/staticIp/components/YamlView/YamlViewFields.tsx
@@ -34,6 +34,8 @@ const CollapsedHost: React.FC<HostComponentProps> = ({ fieldName, hostIdx }) =>
       mappingValue={mapValue}
       hostIdx={hostIdx}
       hasError={hasError}
+      bondPrimaryInterface=""
+      bondSecondaryInterface=""
     />
   );
 };