Merge pull request #166 from gefyrahq/#163

fix(#163): display error message in Home

ui/src/Home.tsx

@@ -21,14 +21,19 @@ import { resetSteps, setMode, setSnackbar, setView } from './store/ui';
 import { Gefyra } from './gefyraClient';
 import { GefyraListRequest, GefyraUnbridgeRequest } from 'gefyra/lib/protocol';
 
+const noRowsDefault = 'No containers found';
+
 export function Home() {
+
   const [containers, setContainers] = useState([]);
   const [bridges, setBridges] = useState([] as Array<string>);
   const [containersLoading, setContainersLoading] = useState(false);
   const [bridgesLoading, setBridgesLoading] = useState(true);
   const [showCargo, setShowCargo] = useState(false);
   const [unbridgeLoadingList, setUnbridgeLoadingList] = useState([] as Array<string>);
   const [containerNamsepaceMap, setContainerNamespaceMap] = useState({} as { [key: string]: string });
+  const [noRowsLabel, setNoRowsLabel] = useState(noRowsDefault);
+
   const ddClient = createDockerDesktopClient();
   const dispatch = useDispatch();
 
@@ -205,13 +210,17 @@ export function Home() {
         filters: filters
       })
       .then((containers: any) => {
+        setNoRowsLabel(noRowsDefault)
         if (!showCargo) {
           containers = containers.filter((container: { Names: string[] }) => {
             return !container.Names.includes('/gefyra-cargo');
           });
         }
         setContainers(containers);
         setContainersLoading(false);
+      }).catch(err => {
+        setNoRowsLabel(`An error occured retrieving the containers: ${err}`)
+        setContainersLoading(false);
       });
   }
 
@@ -280,7 +289,7 @@ export function Home() {
             getRowId={getRowId}
             disableRowSelectionOnClick={true}
             onRowClick={openContainer}
-            localeText={{ noRowsLabel: 'No containers found' }}
+            localeText={{ noRowsLabel: noRowsLabel }}
           />
         </div>
       </Grid>