Merge pull request #1090 from mturley/992-mapping-wizard-sources-empt…

…y-fix [#992][BZ#1752568] Fix "none found" / "all mapped" messages in networks and datastores steps of mapping wizard
ManageIQ · Jan 15, 2020 · 85e0952 · 85e0952
2 parents 26bf001 + 2fc8f5b
commit 85e0952
Show file tree

Hide file tree

Showing 2 changed files with 36 additions and 13 deletions.
diff --git a/...omponents/MappingWizardDatastoresStep/components/DatastoresStepForm/DatastoresStepForm.js b/...omponents/MappingWizardDatastoresStep/components/DatastoresStepForm/DatastoresStepForm.js
@@ -243,8 +243,18 @@ class DatastoresStepForm extends React.Component {
     input.onChange([]);
   };
 
-  allDatastoresMapped = filteredDatastores =>
-    !filteredDatastores.length && (
+  noDatastoresFound = (datastores, loading) =>
+    !datastores.length &&
+    !loading && (
+      <div className="dual-pane-mapper-item">
+        <Icon type="pf" name="error-circle-o" /> {__('No datastores found.')}
+      </div>
+    );
+
+  allDatastoresMapped = (sourceDatastores, filteredDatastores, loading) =>
+    !!sourceDatastores.length &&
+    !filteredDatastores.length &&
+    !loading && (
       <div className="dual-pane-mapper-item">
         <Icon type="pf" name="ok" /> {__('All source datastores have been mapped.')}
       </div>
@@ -267,10 +277,12 @@ class DatastoresStepForm extends React.Component {
       'is-hidden': !selectedCluster
     });
 
+    const filteredSourceDatastores = sourceDatastoreFilter(sourceDatastores, input.value);
+
     const sourceCounter = (
       <DualPaneMapperCount
         selectedItems={selectedSourceDatastores.length}
-        totalItems={sourceDatastoreFilter(sourceDatastores, input.value).length}
+        totalItems={filteredSourceDatastores.length}
       />
     );
 
@@ -293,7 +305,7 @@ class DatastoresStepForm extends React.Component {
           >
             {sourceDatastores && (
               <React.Fragment>
-                {sourceDatastoreFilter(sourceDatastores, input.value).map(item => (
+                {filteredSourceDatastores.map(item => (
                   <DualPaneMapperListItem
                     item={item}
                     text={sourceDatastoreInfo(item)}
@@ -306,7 +318,8 @@ class DatastoresStepForm extends React.Component {
                     handleKeyPress={this.selectSourceDatastore}
                   />
                 ))}
-                {this.allDatastoresMapped(sourceDatastoreFilter(sourceDatastores, input.value))}
+                {this.noDatastoresFound(sourceDatastores, isFetchingSourceDatastores)}
+                {this.allDatastoresMapped(sourceDatastores, filteredSourceDatastores, isFetchingSourceDatastores)}
               </React.Fragment>
             )}
           </DualPaneMapperList>

diff --git a/...zard/components/MappingWizardNetworksStep/components/NetworksStepForm/NetworksStepForm.js b/...zard/components/MappingWizardNetworksStep/components/NetworksStepForm/NetworksStepForm.js
@@ -269,8 +269,18 @@ class NetworksStepForm extends React.Component {
     input.onChange([]);
   };
 
-  allNetworksMapped = filteredNetworks =>
-    !filteredNetworks.length && (
+  noNetworksFound = (groupedSourceNetworks, loading) =>
+    !Object.keys(groupedSourceNetworks).length &&
+    !loading && (
+      <div className="dual-pane-mapper-item">
+        <Icon type="pf" name="error-circle-o" /> {__('No networks found.')}
+      </div>
+    );
+
+  allNetworksMapped = (groupedSourceNetworks, filteredNetworks, loading) =>
+    !!Object.keys(groupedSourceNetworks).length &&
+    !filteredNetworks.length &&
+    !loading && (
       <div className="dual-pane-mapper-item">
         <Icon type="pf" name="ok" /> {__('All source networks have been mapped.')}
       </div>
@@ -293,11 +303,10 @@ class NetworksStepForm extends React.Component {
       'is-hidden': !selectedCluster
     });
 
+    const filteredSourceNetworks = sourceNetworksFilter(groupedSourceNetworks, input.value);
+
     const sourceCounter = (
-      <DualPaneMapperCount
-        selectedItems={selectedSourceNetworks.length}
-        totalItems={sourceNetworksFilter(groupedSourceNetworks, input.value).length}
-      />
+      <DualPaneMapperCount selectedItems={selectedSourceNetworks.length} totalItems={filteredSourceNetworks.length} />
     );
 
     const targetCounter = <DualPaneMapperCount selectedItems={selectedTargetNetwork ? 1 : 0} totalItems={1} />;
@@ -319,7 +328,7 @@ class NetworksStepForm extends React.Component {
           >
             {groupedSourceNetworks && (
               <React.Fragment>
-                {sourceNetworksFilter(groupedSourceNetworks, input.value).map(sourceNetwork => (
+                {filteredSourceNetworks.map(sourceNetwork => (
                   <DualPaneMapperListItem
                     item={sourceNetwork}
                     text={`${sourceNetwork.providerName} \\ ${selectedCluster.v_parent_datacenter} \\ ${
@@ -336,7 +345,8 @@ class NetworksStepForm extends React.Component {
                     handleKeyPress={this.selectSourceNetwork}
                   />
                 ))}
-                {this.allNetworksMapped(sourceNetworksFilter(groupedSourceNetworks, input.value))}
+                {this.noNetworksFound(groupedSourceNetworks, isFetchingSourceNetworks)}
+                {this.allNetworksMapped(groupedSourceNetworks, filteredSourceNetworks, isFetchingSourceNetworks)}
               </React.Fragment>
             )}
           </DualPaneMapperList>