start on working on s3 access

typescript/Frontend/src/components/Installations/InstallationForm.tsx

@@ -4,7 +4,7 @@ import { useContext, useState } from "react";
 import { FormattedMessage, useIntl } from "react-intl";
 import axiosConfig from "../../config/axiosConfig";
 import { I_Installation } from "../../util/types";
-import { InstallationContext } from "../Context/InstallationContextProvider";
+import { InstallationsContext } from "../Context/InstallationsContextProvider";
 import MoveDialog from "../Groups/Tree/MoveDialog";
 import InnovenergyButton from "../Layout/InnovenergyButton";
 import InnovenergyTextfield from "../Layout/InnovenergyTextfield";
@@ -16,11 +16,12 @@ interface I_InstallationFormProps {
   id: string | undefined;
   hasMoveButton?: boolean;
 }
+
 const InstallationForm = (props: I_InstallationFormProps) => {
   const { values, id, hasMoveButton } = props;
   const [open, setOpen] = useState(false);
 
-  const { fetchData } = useContext(InstallationContext);
+  const { fetchData } = useContext(InstallationsContext);
   const { getCurrentUser } = useContext(UserContext);
 
   const readOnly = !getCurrentUser().hasWriteAccess;

typescript/Frontend/src/components/Installations/InstallationList.tsx

@@ -1,13 +1,19 @@
 import List from "@mui/material/List";
 import ListItemButton from "@mui/material/ListItemButton";
 import ListItemText from "@mui/material/ListItemText";
-import { Alert, CircularProgress, Divider, Grid, useTheme } from "@mui/material";
+import {
+  Alert,
+  CircularProgress,
+  Divider,
+  Grid,
+  useTheme,
+} from "@mui/material";
 import { Link } from "react-router-dom";
 import useRouteMatch from "../../hooks/useRouteMatch";
 import routes from "../../routes.json";
 import { Fragment, useContext, useEffect } from "react";
 import { I_Installation } from "../../util/types";
-import { InstallationContext } from "../Context/InstallationContextProvider";
+import { InstallationsContext } from "../Context/InstallationsContextProvider";
 import { colors } from "../..";
 
 interface InstallationListProps {
@@ -37,7 +43,7 @@ const filterData = (
 };
 
 const InstallationList = (props: InstallationListProps) => {
-  const { fetchData, data, loading, error } = useContext(InstallationContext);
+  const { fetchData, data, loading, error } = useContext(InstallationsContext);
 
   const filteredData = filterData(props.searchQuery, data);
 
@@ -45,11 +51,9 @@ const InstallationList = (props: InstallationListProps) => {
     routes.installations + routes.list + routes.installation + ":id",
     routes.installations + routes.list + routes.liveView + ":id",
     routes.installations + routes.list + routes.log + ":id",
-    
   ]);
-  
-  const theme = useTheme();
 
+  const theme = useTheme();
 
   useEffect(() => {
     fetchData();

typescript/Frontend/src/components/Installations/Installations.tsx

@@ -4,7 +4,7 @@ import LiveView from "./LiveView";
 import InstallationTabs from "./InstallationTabs";
 import Log from "./Log/Log";
 import routes from "../../routes.json";
-import InstallationContextProvider from "../Context/InstallationContextProvider";
+import InstallationsContextProvider from "../Context/InstallationsContextProvider";
 import SearchSidebar from "../Layout/Search";
 import InstallationList from "./InstallationList";
 import Installation from "./Installation";
@@ -19,7 +19,7 @@ const Installations = () => {
     routes.installations + routes.list + routes.log + ":id",
   ]);
   return (
-    <InstallationContextProvider>
+    <InstallationsContextProvider>
       <LogContextProvider>
         <Grid container spacing={2} height="100%">
           <Grid item xs={3}>
@@ -44,7 +44,7 @@ const Installations = () => {
           </Grid>
         </Grid>
       </LogContextProvider>
-    </InstallationContextProvider>
+    </InstallationsContextProvider>
   );
 };
 

typescript/Frontend/src/components/Installations/Log/ScalarGraph.tsx

@@ -29,8 +29,8 @@ const s3Access = new S3Access(
   "saliomameiringen",
   "sos-ch-dk-2",
   "exo.io",
-  "EXO464a9ff62fdfa407aa742855",                  // key
+  "EXO464a9ff62fdfa407aa742855", // key
-  "f2KtCWN4EHFqtvH2kotdyI0w5SjjdHVPAADdcD3ik8g"  // secret
+  "f2KtCWN4EHFqtvH2kotdyI0w5SjjdHVPAADdcD3ik8g" // secret
 );
 
 export const fetchData = (
@@ -59,7 +59,7 @@ export const fetchData = (
 const ScalarGraph = () => {
   const timeRange = createTimes(
     UnixTime.now() /* .fromTicks(1682085650) */
-      .rangeBefore(TimeSpan.fromDays(5)),
+      .rangeBefore(TimeSpan.fromDays(10)),
     NUMBER_OF_NODES
   );
   const [timeSeries, setTimeSeries] = useState<RecordSeries>([]);
@@ -166,7 +166,6 @@ const ScalarGraph = () => {
     [getCacheSeries]
   );
 
-
   const theme = useTheme();
   const renderGraphs = () => {
     if (checkedToggles.length > 0) {
@@ -240,13 +239,18 @@ const ScalarGraph = () => {
           </div>
         );
       }
+      return (
+        <Alert sx={{ mt: 2 }} severity="info">
+          <FormattedMessage
+            id="makeASelection"
+            defaultMessage="Please make a selection on the left"
+          />
+        </Alert>
+      );
     }
     return (
-      <Alert sx={{ mt: 2}} severity="info">
+      <Alert sx={{ mt: 2 }} severity="error">
-        <FormattedMessage
+        <FormattedMessage id="error" defaultMessage="There was an error" />
-          id="makeASelection"
-          defaultMessage="Please make a selection on the left"
-        />
       </Alert>
     );
   };