roll out the previous commit to other products

typescript/frontend-marios2/src/content/dashboards/Installations/Installation.tsx

@@ -200,6 +200,7 @@ function Installation(props: singleInstallationProps) {
       currentTab == 'live' ||
       currentTab == 'pvview' ||
       currentTab == 'configuration' ||
+      currentTab == 'overview' ||
       location.includes('batteryview')
     ) {
       //Fetch periodically if the tab is live, pvview or batteryview
@@ -217,6 +218,10 @@ function Installation(props: singleInstallationProps) {
           }
         }
       }
+      // Fetch one time in overview tab to determine connectivity
+      if (currentTab == 'overview') {
+        fetchDataForOneTime();
+      }
       //Fetch only one time in configuration tab
       if (currentTab == 'configuration') {
         fetchDataForOneTime();
@@ -376,7 +381,6 @@ function Installation(props: singleInstallationProps) {
           currentTab != 'information' &&
           currentTab != 'history' &&
           currentTab != 'manage' &&
-          currentTab != 'overview' &&
           currentTab != 'log' && (
             <Container
               maxWidth="xl"
@@ -447,6 +451,8 @@ function Installation(props: singleInstallationProps) {
                   <Overview
                     s3Credentials={s3Credentials}
                     id={props.current_installation.id}
+                    connected={connected}
+                    loading={loading}
                   ></Overview>
                 }
               />

typescript/frontend-marios2/src/content/dashboards/Overview/salidomoOverview.tsx

@@ -28,6 +28,8 @@ import { UserType } from '../../../interfaces/UserTypes';
 interface salidomoOverviewProps {
   s3Credentials: I_S3Credentials;
   id: number;
+  connected?: boolean;
+  loading?: boolean;
 }
 
 const computeLast7Days = (): string[] => {
@@ -750,6 +752,23 @@ function SalidomoOverview(props: salidomoOverviewProps) {
   const renderGraphs = () => {
     return (
       <Container maxWidth="xl">
+        {!props.connected && !props.loading && (
+          <Typography
+            variant="body2"
+            sx={{
+              color: 'red',
+              fontWeight: 'bold',
+              textAlign: 'center',
+              marginTop: '10px',
+              marginBottom: '10px'
+            }}
+          >
+            <FormattedMessage
+              id="installationOffline"
+              defaultMessage="Installation is currently offline. Showing last available data."
+            />
+          </Typography>
+        )}
         {isErrorDateModalOpen && (
           <Modal open={isErrorDateModalOpen} onClose={() => {}}>
             <Box
@@ -874,6 +893,7 @@ function SalidomoOverview(props: salidomoOverviewProps) {
           </LocalizationProvider>
         )}
         <Grid container>
+          {!props.loading && (props.connected !== false || aggregatedDataArray.length > 0) && (<>
           <Grid item xs={6} md={6}>
             <Button
               variant="contained"
@@ -931,6 +951,7 @@ function SalidomoOverview(props: salidomoOverviewProps) {
               <FormattedMessage id="goback" defaultMessage="Zoom in" />
             </Button>
           </Grid>
+          </>)}
 
           {loading && (
             <Container
@@ -1123,6 +1144,10 @@ function SalidomoOverview(props: salidomoOverviewProps) {
     );
   };
 
+  if (props.loading) {
+    return null;
+  }
+
   return <>{renderGraphs()}</>;
 }
 

typescript/frontend-marios2/src/content/dashboards/SalidomoInstallations/Installation.tsx

@@ -157,8 +157,31 @@ function SalidomoInstallation(props: singleInstallationProps) {
     setCurrentTab(path[path.length - 1]);
   }, [location]);
 
+  const fetchDataForOneTime = async () => {
+    var timeperiodToSearch = 30;
+    for (var i = 0; i < timeperiodToSearch; i += 1) {
+      var timestampToFetch = UnixTime.now().earlier(TimeSpan.fromMinutes(i));
+      try {
+        var res = await fetchDataJson(timestampToFetch, s3Credentials, true);
+        if (res !== FetchResult.notAvailable && res !== FetchResult.tryLater) {
+          setConnected(true);
+          setLoading(false);
+          return true;
+        }
+      } catch (err) {
+        console.error('Error fetching data:', err);
+        setConnected(false);
+        setLoading(false);
+        return false;
+      }
+    }
+    setConnected(false);
+    setLoading(false);
+    return false;
+  };
+
   useEffect(() => {
-    if (location.includes('batteryview')) {
+    if (location.includes('batteryview') || currentTab == 'overview') {
       if (location.includes('batteryview') && !location.includes('mainstats')) {
         if (!continueFetching.current) {
           continueFetching.current = true;
@@ -168,6 +191,10 @@ function SalidomoInstallation(props: singleInstallationProps) {
           }
         }
       }
+      // Fetch one time in overview tab to determine connectivity
+      if (currentTab == 'overview') {
+        fetchDataForOneTime();
+      }
 
       return () => {
         continueFetching.current = false;
@@ -295,7 +322,6 @@ function SalidomoInstallation(props: singleInstallationProps) {
         </div>
         {loading &&
           currentTab != 'information' &&
-          currentTab != 'overview' &&
           currentTab != 'manage' &&
           currentTab != 'history' &&
           currentTab != 'log' && (
@@ -357,6 +383,8 @@ function SalidomoInstallation(props: singleInstallationProps) {
                   <SalidomoOverview
                     s3Credentials={s3Credentials}
                     id={props.current_installation.id}
+                    connected={connected}
+                    loading={loading}
                   ></SalidomoOverview>
                 }
               />