diff --git a/typescript/frontend-marios2/src/content/dashboards/Installations/Installation.tsx b/typescript/frontend-marios2/src/content/dashboards/Installations/Installation.tsx index 32379ef0d..126a41d23 100644 --- a/typescript/frontend-marios2/src/content/dashboards/Installations/Installation.tsx +++ b/typescript/frontend-marios2/src/content/dashboards/Installations/Installation.tsx @@ -197,7 +197,7 @@ function Installation(props: singleInstallationProps) { {openModalDeleteInstallation && ( setOpenModalDeleteInstallation(false)} + onClose={deleteInstallationModalHandleCancel} aria-labelledby="error-modal" aria-describedby="error-modal-description" > diff --git a/typescript/frontend-marios2/src/content/dashboards/Overview/chartOptions.tsx b/typescript/frontend-marios2/src/content/dashboards/Overview/chartOptions.tsx index 5e0e4522e..46a714f69 100644 --- a/typescript/frontend-marios2/src/content/dashboards/Overview/chartOptions.tsx +++ b/typescript/frontend-marios2/src/content/dashboards/Overview/chartOptions.tsx @@ -82,7 +82,7 @@ export const getChartOptions = ( } }, { - seriesName: 'Pv Production', + seriesName: 'Grid Power', show: false, min: chartInfo.min >= 0 diff --git a/typescript/frontend-marios2/src/content/dashboards/Overview/overview.tsx b/typescript/frontend-marios2/src/content/dashboards/Overview/overview.tsx index 4acc31a0f..6dccbfe55 100644 --- a/typescript/frontend-marios2/src/content/dashboards/Overview/overview.tsx +++ b/typescript/frontend-marios2/src/content/dashboards/Overview/overview.tsx @@ -1,6 +1,6 @@ import { Box, Card, Container, Grid, Modal, Typography } from '@mui/material'; import ReactApexChart from 'react-apexcharts'; -import React, { useEffect, useState } from 'react'; +import React, { useContext, useEffect, useState } from 'react'; import { I_S3Credentials } from 'src/interfaces/S3Types'; import { getChartOptions } from './chartOptions'; import { @@ -17,6 +17,7 @@ import { TimeSpan, UnixTime } from '../../../dataCache/time'; import { DateTimePicker, LocalizationProvider } from '@mui/x-date-pickers'; import { AdapterDayjs } from '@mui/x-date-pickers/AdapterDayjs'; import dayjs from 'dayjs'; +import { UserContext } from '../../../contexts/userContext'; interface OverviewProps { s3Credentials: I_S3Credentials; @@ -39,6 +40,9 @@ const computeLast7Days = (): string[] => { }; function Overview(props: OverviewProps) { + const context = useContext(UserContext); + const { currentUser, setUser } = context; + const [dailyData, setDailyData] = useState(true); const [weeklyData, setWeeklyData] = useState(false); const [weeklybalance, setWeeklyBalance] = useState([]); @@ -676,7 +680,7 @@ function Overview(props: OverviewProps) { color: '#ff9900' }, { - name: 'Balance', + name: 'Net Energy', color: '#666666', type: 'line', data: weeklybalance @@ -713,7 +717,7 @@ function Overview(props: OverviewProps) { type: 'bar' }, { - name: 'Balance', + name: 'Net Energy', type: 'line', data: monthlybalance, color: '#666666' @@ -727,6 +731,7 @@ function Overview(props: OverviewProps) { )} + - - - - + + - - - - - - - - + > + + + + + + + + + - {dailyData && ( - - )} - - {weeklyData && ( - - )} - - {monthlyData && ( - - )} - - - - - - - - - - - - + } + }} + series={[ + dailyDataArray[chartState].chartData.pvProduction + ]} + type="area" + height={400} + /> + )} + + {weeklyData && ( + + )} + + {monthlyData && ( + + )} + + + + - - {dailyData && ( - + + + + + + + + + + {dailyData && ( + - )} - {weeklyData && ( - - )} + }} + series={[ + dailyDataArray[chartState].chartData.gridPower + ]} + type="area" + height={400} + /> + )} + {weeklyData && ( + + )} - {monthlyData && ( - - )} - + {monthlyData && ( + + )} + + - + )} - {dailyData && ( + {dailyData && currentUser.hasWriteAccess && ( { setFormValues(props.current_user); }, [props.current_user]); + useEffect(() => { + // Use a timer to automatically close the Alert after 2 seconds + const timerId = setTimeout(() => { + setUpdated(false); + }, 2000); + + // Clean up the timer when the component unmounts or when updated changes + return () => clearTimeout(timerId); + }, [updated]); + + useEffect(() => { + // Use a timer to automatically close the Alert after 2 seconds + const timerId = setTimeout(() => { + setError(false); + }, 2000); + + // Clean up the timer when the component unmounts or when updated changes + return () => clearTimeout(timerId); + }, [error]); + if (formValues == undefined) { return null; } @@ -60,21 +80,35 @@ function User(props: singleUserProps) { [name]: value }); }; - const handleSubmit = (e) => { + const handleSubmit = async (e) => { setLoading(true); setError(false); + + const res = await axiosConfig + .put(`/UpdateUser`, formValues) + .catch((err) => { + if (err.response) { + setError(true); + setLoading(false); + } + }); + + if (res) { + setUpdated(true); + setLoading(false); + } }; const handleDelete = (e) => { setLoading(true); setError(false); - setOpenModalDeleteFolder(true); + setOpenModalDeleteUser(true); }; const deleteUserModalHandleCancel = (e) => { setLoading(false); setError(false); - setOpenModalDeleteFolder(false); + setOpenModalDeleteUser(false); }; const deleteUserModalHandle = (e) => { @@ -94,7 +128,7 @@ function User(props: singleUserProps) { .catch((error) => { setLoading(false); setError(true); - setOpenModalDeleteFolder(false); + setOpenModalDeleteUser(false); if (error.response && error.response.status == 401) { removeToken(); } @@ -105,10 +139,10 @@ function User(props: singleUserProps) { return ( <> - {openModalDeleteFolder && ( + {openModalDeleteUser && ( setOpenModalDeleteFolder(false)} + open={openModalDeleteUser} + onClose={deleteUserModalHandleCancel} aria-labelledby="error-modal" aria-describedby="error-modal-description" > diff --git a/typescript/frontend-marios2/src/content/dashboards/Users/UsersSearch.tsx b/typescript/frontend-marios2/src/content/dashboards/Users/UsersSearch.tsx index 71e039321..833ecdfc7 100644 --- a/typescript/frontend-marios2/src/content/dashboards/Users/UsersSearch.tsx +++ b/typescript/frontend-marios2/src/content/dashboards/Users/UsersSearch.tsx @@ -5,8 +5,7 @@ import { Grid, IconButton, InputAdornment, - TextField, - useTheme + TextField } from '@mui/material'; import SearchTwoToneIcon from '@mui/icons-material/SearchTwoTone'; import FlatUsersView from './FlatUsersView'; @@ -18,7 +17,6 @@ import { FormattedMessage } from 'react-intl'; import { Close as CloseIcon } from '@mui/icons-material'; function UsersSearch() { - const theme = useTheme(); const [searchTerm, setSearchTerm] = useState(''); const { availableUsers, fetchAvailableUsers } = useContext(AccessContext); const [filteredData, setFilteredData] = useState(availableUsers); @@ -26,7 +24,7 @@ function UsersSearch() { const context = useContext(UserContext); const [userCreated, setUserCreated] = useState(false); const [errorOccured, setErrorOccured] = useState(false); - const { currentUser, setUser } = context; + const { currentUser } = context; useEffect(() => { fetchAvailableUsers(); @@ -54,7 +52,7 @@ function UsersSearch() { setTimeout(() => { setUserCreated(false); - }, 8000); + }, 2000); }; const handleUserFormCancel = () => { @@ -66,7 +64,7 @@ function UsersSearch() { setErrorOccured(true); setTimeout(() => { setErrorOccured(false); - }, 3000); + }, 2000); }; const isMobile = window.innerWidth <= 1490; diff --git a/typescript/frontend-marios2/src/interfaces/Chart.tsx b/typescript/frontend-marios2/src/interfaces/Chart.tsx index f77cd95df..536b27a42 100644 --- a/typescript/frontend-marios2/src/interfaces/Chart.tsx +++ b/typescript/frontend-marios2/src/interfaces/Chart.tsx @@ -312,13 +312,13 @@ export const transformInputToAggregatedData = async ( 'temp6' ]; - //while (currentDay.isBefore(currentDate)) { - for (let i = 0; i < 7; i++) { + while (currentDay.isBefore(currentDate)) { + //for (let i = 0; i < 7; i++) { // console.log('Current day:', currentDay.format('YYYY-MM-DD')); let result = await Promise.resolve( - //fetchDailyData(currentDay.format('YYYY-MM-DD'), s3Credentials) - fetchDailyData(fake_data[i], s3Credentials) + fetchDailyData(currentDay.format('YYYY-MM-DD'), s3Credentials) + //fetchDailyData(fake_data[i], s3Credentials) ); if ( result === FetchResult.notAvailable ||