removing plots downloads, and fix lazy loading

Aquaveo · May 7, 2024 · 0e78bc7 · 0e78bc7
1 parent 6b2f28e
commit 0e78bc7
Show file tree

Hide file tree

Showing 4 changed files with 14 additions and 73 deletions.
diff --git a/reactapp/features/hydroFabric/lib/chartAuxiliary.js b/reactapp/features/hydroFabric/lib/chartAuxiliary.js
@@ -185,72 +185,8 @@ const updateSeries = (chart,item,title,subtitle,variable) => {
 
 
     }
-    makeExportData(chart)
 
 }
 
 
-const makeExportData = (chart) =>{
-  var seriesData = [];
-  chart.series.each(function (s) {
-    for (var i = 0; i < s.dataItems.length; i++) {
-      var dataItem = s.dataItems[i];
-      var seriesName = s.get('name');
-      const date = new Date(dataItem.get('valueX'));
-      const dateString = date.toISOString().slice(0, 19).replace('T', ' ');
-      var dataItemObject = {};
-      dataItemObject['x'] = dateString,
-      dataItemObject[seriesName] = dataItem.get('valueY'),
-      seriesData.push(dataItemObject);
-    }
-  });
-  // Create an object to store the merged values
-  const mergedData = {};
-
-  // Iterate through the data array
-  seriesData.forEach((item) => {
-    const { x, ...values } = item;
-
-    if (!mergedData[x]) {
-      mergedData[x] = { x, ...values };
-    } else {
-      mergedData[x] = { x, ...mergedData[y], ...values };
-    }
-  });
-
-  // Convert the mergedData object back to an array
-  const mergedDataArray = Object.values(mergedData);
-
-  var exporting = Exporting.new(chart.root, {
-    menu: ExportingMenu.new(chart.root, {}),
-    htmlOptions: {
-      disabled: true
-    },
-    xlsxOptions:{
-      disabled: true
-    },
-    pdfOptions:{
-      disabled: true
-    },
-    dataSource: mergedDataArray
-  });
-  var annotator = Annotator.new(chart.root, {});
-
-  var menuitems = exporting.get("menu").get("items");
-
-  menuitems.push({
-      type: "separator"
-  });
-
-  menuitems.push({
-      type: "custom",
-      label: "Annotate",
-      callback: function () {
-          this.close();
-          annotator.toggle();            
-      }
-  });
-}
-
-
 export { handleUpdate, initializeChart, updateSeries}
diff --git a/reactapp/features/hydroFabric/lib/charts.js b/reactapp/features/hydroFabric/lib/charts.js
@@ -1,4 +1,3 @@
 // https://github.com/amcharts/amcharts4/issues/82#issuecomment-708330714
 export { Root,Label,Scrollbar,Tooltip,percent,color } from "@amcharts/amcharts5";
 export { XYChart,DateAxis,ValueAxis,LineSeries,AxisRendererX,AxisRendererY,XYCursor } from "@amcharts/amcharts5/xy";
-export { Exporting,ExportingMenu,Annotator } from "@amcharts/amcharts5/plugins/exporting";
diff --git a/reactapp/views/ngiab/hydroFabricView.js b/reactapp/views/ngiab/hydroFabricView.js
@@ -1,12 +1,13 @@
 
 
-import {useEffect, Fragment,lazy} from 'react';
+import {useEffect, Suspense, Fragment,lazy} from 'react';
 
 // import HydroFabricLinePlot from '../../features/hydroFabric/components/hydroFabricLinePlot';
 // import SelectComponent from 'features/hydroFabric/components/selectComponent';
 import { useHydroFabricContext } from 'features/hydroFabric/hooks/useHydroFabricContext';
 import appAPI from 'services/api/app';
 import { SelectContainer,HydroFabricPlotContainer } from './containers';
+import LoadingAnimation from 'components/loader/LoadingAnimation';
 
 
 const HydroFabricLinePlot = lazy(() => import('../../features/hydroFabric/components/hydroFabricLinePlot'));
@@ -61,6 +62,7 @@ const HydroFabricView = (props) => {
       props.setIsLoading(false);
 
     }).catch((error) => {
+      props.setIsLoading(false);
       console.log("Error fetching catchment time series", error);
     })
     return  () => {
@@ -132,9 +134,11 @@ const HydroFabricView = (props) => {
 
         }
       </SelectContainer>
+      <Suspense fallback={<LoadingAnimation />}>
        <HydroFabricPlotContainer>
           <HydroFabricLinePlot singleRowOn={props.singleRowOn} title={title} subtitle={subtitle} /> 
         </HydroFabricPlotContainer> 
+      </Suspense>
 
     </Fragment>
 

diff --git a/reactapp/views/ngiab/ngiab_view.js b/reactapp/views/ngiab/ngiab_view.js
@@ -1,8 +1,8 @@
-import { Fragment, useState, lazy } from 'react';
+import { Fragment, useState, lazy,Suspense } from 'react';
 import { HydroFabricProvider } from 'features/hydroFabric/providers/hydroFabricProvider';
 import { MapProvider } from 'features/Map/providers/MapProvider';
 import { HydroFabricContainer, MapContainer } from './containers';
-
+import LoadingAnimation from 'components/loader/LoadingAnimation';
 const HydroFabricView = lazy(() => import('./hydroFabricView.js'));
 const MapView = lazy(() => import('./map_view.js'));
 
@@ -22,11 +22,13 @@ const NGIABView = () => {
               </MapProvider>
             </MapContainer>
             <HydroFabricContainer fullScreen={singleRowOn} >
-              <HydroFabricView 
-                toggleSingleRow = {toggleSingleRow} 
-                singleRowOn={singleRowOn} 
-                setIsLoading={setIsLoading} 
-              />
+              <Suspense fallback={<LoadingAnimation />}>
+                <HydroFabricView 
+                  toggleSingleRow = {toggleSingleRow} 
+                  singleRowOn={singleRowOn} 
+                  setIsLoading={setIsLoading} 
+                />
+              </Suspense>
             </HydroFabricContainer>
         </HydroFabricProvider>