Fixed login route bug

This commit is contained in:
Noe 2024-02-14 14:34:11 +01:00
parent 984455e815
commit 38afc5b003
15 changed files with 197 additions and 123 deletions

View File

@ -119,6 +119,10 @@ function App() {
path={routes.forgotPassword} path={routes.forgotPassword}
element={<ForgotPassword />} element={<ForgotPassword />}
></Route> ></Route>
<Route
path={'*'}
element={<Navigate to={routes.login}></Navigate>}
></Route>
</Routes> </Routes>
</ThemeProvider> </ThemeProvider>
); );
@ -147,6 +151,10 @@ function App() {
path={''} path={''}
element={<Navigate to={routes.installations}></Navigate>} element={<Navigate to={routes.installations}></Navigate>}
></Route> ></Route>
<Route
path={'login'}
element={<Navigate to={routes.installations}></Navigate>}
></Route>
<Route <Route
path="/" path="/"
element={ element={
@ -168,7 +176,10 @@ function App() {
/> />
<Route path={routes.users + '*'} element={<Users />} /> <Route path={routes.users + '*'} element={<Users />} />
<Route
path={'*'}
element={<Navigate to={routes.installations}></Navigate>}
></Route>
<Route path="ResetPassword" element={<ResetPassword />}></Route> <Route path="ResetPassword" element={<ResetPassword />}></Route>
</Route> </Route>
</Routes> </Routes>

View File

@ -91,7 +91,7 @@ function Login() {
}; };
return ( return (
<> <div style={{ userSelect: 'none' }}>
<Container maxWidth="xl" sx={{ pt: 2 }} className="login"> <Container maxWidth="xl" sx={{ pt: 2 }} className="login">
<Grid container> <Grid container>
<Grid item xs={3} container justifyContent="flex-start" mb={2}> <Grid item xs={3} container justifyContent="flex-start" mb={2}>
@ -263,7 +263,7 @@ function Login() {
</Grid> </Grid>
</Box> </Box>
</Box> </Box>
</> </div>
); );
} }

View File

@ -260,7 +260,7 @@ export const getChartOptions = (
: chartInfo.max <= 0 : chartInfo.max <= 0
? Math.ceil(chartInfo.min / findPower(chartInfo.min).value) * ? Math.ceil(chartInfo.min / findPower(chartInfo.min).value) *
findPower(chartInfo.min).value findPower(chartInfo.min).value
: Math.abs(chartInfo.min) < 1 : Math.abs(chartInfo.min) < 1 || Math.abs(chartInfo.max) < 1
? -Math.max( ? -Math.max(
Math.abs( Math.abs(
Math.ceil(chartInfo.min / findPower(chartInfo.min).value) * Math.ceil(chartInfo.min / findPower(chartInfo.min).value) *
@ -278,7 +278,7 @@ export const getChartOptions = (
).toFixed(2) ).toFixed(2)
: chartInfo.max <= 0 : chartInfo.max <= 0
? 0 ? 0
: Math.abs(chartInfo.min) < 1 : Math.abs(chartInfo.min) < 1 || Math.abs(chartInfo.max) < 1
? +Math.max( ? +Math.max(
Math.abs( Math.abs(
Math.ceil(chartInfo.min / findPower(chartInfo.min).value) * Math.ceil(chartInfo.min / findPower(chartInfo.min).value) *

View File

@ -444,20 +444,20 @@ function Overview(props: OverviewProps) {
> >
<FormattedMessage id="lastweek" defaultMessage="Last week" /> <FormattedMessage id="lastweek" defaultMessage="Last week" />
</Button> </Button>
{/*<Button*/} <Button
{/* variant="contained"*/} variant="contained"
{/* onClick={handleMonthData}*/} onClick={handleMonthData}
{/* disabled={loading}*/} disabled={loading}
{/* sx={{*/} sx={{
{/* marginTop: '20px',*/} marginTop: '20px',
{/* marginLeft: '10px',*/} marginLeft: '10px',
{/* backgroundColor: monthlyData ? '#808080' : '#ffc04d',*/} backgroundColor: monthlyData ? '#808080' : '#ffc04d',
{/* color: '#000000',*/} color: '#000000',
{/* '&:hover': { bgcolor: '#f7b34d' }*/} '&:hover': { bgcolor: '#f7b34d' }
{/* }}*/} }}
{/*>*/} >
{/* <FormattedMessage id="lastmonth" defaultMessage="Last Month" />*/} <FormattedMessage id="lastmonth" defaultMessage="Last Month" />
{/*</Button>*/} </Button>
{dailyData && ( {dailyData && (
<> <>
<Button <Button

View File

@ -1,5 +1,5 @@
import React, { useState } from 'react'; import React, { useState } from 'react';
import { Container, Grid, Switch } from '@mui/material'; import { Container, Grid, Switch, Typography } from '@mui/material';
import TopologyColumn from './topologyColumn'; import TopologyColumn from './topologyColumn';
import { import {
getAmount, getAmount,
@ -41,16 +41,33 @@ function Topology(props: TopologyProps) {
justifyContent: 'right' justifyContent: 'right'
}} }}
> >
<Switch <div>
edge="start" <Typography sx={{ marginTop: '5px', marginRight: '20px' }}>
color="secondary" Display Values
onChange={handleSwitch()} </Typography>
sx={{ <Switch
'& .MuiSwitch-thumb': { edge="start"
backgroundColor: 'orange' color="secondary"
} onChange={handleSwitch()}
}} sx={{
/> '& .MuiSwitch-thumb': {
backgroundColor: 'orange'
},
marginLeft: '20px'
}}
/>
</div>
{/*<Switch*/}
{/* edge="start"*/}
{/* color="secondary"*/}
{/* onChange={handleSwitch()}*/}
{/* sx={{*/}
{/* '& .MuiSwitch-thumb': {*/}
{/* backgroundColor: 'orange'*/}
{/* }*/}
{/* }}*/}
{/*/>*/}
</Grid> </Grid>
<Grid <Grid

View File

@ -29,7 +29,7 @@ const isInt = (value: number) => {
return value % 1 === 0; return value % 1 === 0;
}; };
function formatPower(value) { function formatPower(value, unit) {
if (isNaN(value)) { if (isNaN(value)) {
return 'Invalid'; return 'Invalid';
} }
@ -47,7 +47,12 @@ function formatPower(value) {
magnitude++; magnitude++;
} }
const roundedValue = value.toFixed(1); const roundedValue = Math.round(value);
//Filter all values less than 100 Watts
if (magnitude === 0 && value < 100 && unit === 'W') {
return 0;
}
return negative === false return negative === false
? `${roundedValue} ${prefixes[magnitude]}` ? `${roundedValue} ${prefixes[magnitude]}`
@ -243,8 +248,12 @@ function TopologyBox(props: TopologyBoxProps) {
{props.data.values.map((boxData, index) => { {props.data.values.map((boxData, index) => {
return ( return (
<Typography key={index}> <Typography key={index}>
{formatPower(boxData.value)} {formatPower(boxData.value, boxData.unit) === 0
{boxData.unit} ? null
: formatPower(boxData.value, boxData.unit)}
{formatPower(boxData.value, boxData.unit) === 0
? null
: boxData.unit}
</Typography> </Typography>
); );
})} })}

View File

@ -45,7 +45,12 @@ function formatPower(value) {
magnitude++; magnitude++;
} }
const roundedValue = value.toFixed(1); const roundedValue = Math.round(value);
//Filter all values less than 100 Watts
if (magnitude === 0 && value < 100) {
return 0;
}
return negative === false return negative === false
? `${roundedValue} ${prefixes[magnitude]}` ? `${roundedValue} ${prefixes[magnitude]}`
@ -113,8 +118,12 @@ function TopologyFlow(props: TopologyFlowProps) {
zIndex: 1 zIndex: 1
}} }}
> >
{formatPower(props.data.values[0].value)} {formatPower(props.data.values[0].value) === 0
{props.data.values[0].unit} ? null
: formatPower(props.data.values[0].value)}
{formatPower(props.data.values[0].value) === 0
? null
: props.data.values[0].unit}
</Typography> </Typography>
)} )}
</Box> </Box>

View File

@ -9,6 +9,7 @@ import {
Grid, Grid,
IconButton, IconButton,
Modal, Modal,
Switch,
Tab, Tab,
Tabs, Tabs,
TextField, TextField,
@ -22,6 +23,7 @@ import { InnovEnergyUser } from 'src/interfaces/UserTypes';
import { TokenContext } from 'src/contexts/tokenContext'; import { TokenContext } from 'src/contexts/tokenContext';
import { TabsContainerWrapper } from 'src/layouts/TabsContainerWrapper'; import { TabsContainerWrapper } from 'src/layouts/TabsContainerWrapper';
import { FormattedMessage } from 'react-intl'; import { FormattedMessage } from 'react-intl';
import FormControlLabel from '@mui/material/FormControlLabel';
interface singleUserProps { interface singleUserProps {
current_user: InnovEnergyUser; current_user: InnovEnergyUser;
@ -80,6 +82,14 @@ function User(props: singleUserProps) {
[name]: value [name]: value
}); });
}; };
const handleAdminChange = (event) => {
setFormValues({
...formValues,
['hasWriteAccess']: event.target.checked
});
};
const handleSubmit = async (e) => { const handleSubmit = async (e) => {
setLoading(true); setLoading(true);
setError(false); setError(false);
@ -94,8 +104,13 @@ function User(props: singleUserProps) {
}); });
if (res) { if (res) {
setUpdated(true); props.fetchDataAgain();
setLoading(false); setLoading(false);
setUpdated(true);
setTimeout(() => {
setUpdated(false);
}, 3000);
} }
}; };
@ -278,6 +293,34 @@ function User(props: singleUserProps) {
fullWidth fullWidth
/> />
</div> </div>
<div>
<FormControlLabel
labelPlacement="start"
control={
<Switch
checked={
formValues.hasWriteAccess ? true : false
}
color="primary"
name="hasWriteAccess"
onChange={handleAdminChange}
sx={{
marginLeft: '8px',
marginTop: '2px'
}}
/>
}
label={
<Typography sx={{ marginTop: '4px' }}>
Admin
</Typography>
}
sx={{
marginLeft: '10px'
}}
/>
</div>
<div <div
style={{ style={{
display: 'flex', display: 'flex',

View File

@ -8,7 +8,7 @@ function Users() {
const theme = useTheme(); const theme = useTheme();
return ( return (
<> <div style={{ userSelect: 'none' }}>
<AccessContextProvider> <AccessContextProvider>
<Container maxWidth="xl" sx={{ marginTop: '20px' }}> <Container maxWidth="xl" sx={{ marginTop: '20px' }}>
<Grid item xs={12}> <Grid item xs={12}>
@ -19,7 +19,7 @@ function Users() {
</Container> </Container>
<Footer /> <Footer />
</AccessContextProvider> </AccessContextProvider>
</> </div>
); );
} }

View File

@ -9,7 +9,9 @@ import {
MenuItem, MenuItem,
Modal, Modal,
Select, Select,
Switch,
TextField, TextField,
Typography,
useTheme useTheme
} from '@mui/material'; } from '@mui/material';
import Button from '@mui/material/Button'; import Button from '@mui/material/Button';
@ -17,10 +19,9 @@ import { Close as CloseIcon } from '@mui/icons-material';
import { InnovEnergyUser } from 'src/interfaces/UserTypes'; import { InnovEnergyUser } from 'src/interfaces/UserTypes';
import axiosConfig from 'src/Resources/axiosConfig'; import axiosConfig from 'src/Resources/axiosConfig';
import { TokenContext } from 'src/contexts/tokenContext'; import { TokenContext } from 'src/contexts/tokenContext';
import FormControlLabel from '@mui/material/FormControlLabel';
import Checkbox from '@mui/material/Checkbox';
import { I_Folder, I_Installation } from 'src/interfaces/InstallationTypes'; import { I_Folder, I_Installation } from 'src/interfaces/InstallationTypes';
import { FormattedMessage } from 'react-intl'; import { FormattedMessage } from 'react-intl';
import FormControlLabel from '@mui/material/FormControlLabel';
interface userFormProps { interface userFormProps {
cancel: () => void; cancel: () => void;
@ -385,16 +386,22 @@ function userForm(props: userFormProps) {
<div> <div>
<FormControlLabel <FormControlLabel
labelPlacement="start"
control={ control={
<Checkbox <Switch
color="primary"
onChange={handleAdminChange} onChange={handleAdminChange}
sx={{ sx={{
marginLeft: '11px' marginLeft: '8px',
marginTop: '2px'
}} }}
/> />
} }
label="Admin" label={<Typography sx={{ marginTop: '6px' }}>Admin</Typography>}
sx={{ marginTop: 1 }} sx={{
marginLeft: '10px',
marginTop: '9px'
}}
/> />
</div> </div>

View File

@ -1,17 +1,12 @@
import { import {
Box, Box,
Card,
Typography,
Container,
Divider,
Button, Button,
FormControl, Container,
OutlinedInput, OutlinedInput,
InputAdornment, styled,
styled Typography
} from '@mui/material'; } from '@mui/material';
import { Helmet } from 'react-helmet-async'; import { Helmet } from 'react-helmet-async';
import SearchTwoToneIcon from '@mui/icons-material/SearchTwoTone';
const MainContent = styled(Box)( const MainContent = styled(Box)(
({ theme }) => ` ({ theme }) => `
@ -50,42 +45,14 @@ function Status404() {
<Typography variant="h2" sx={{ my: 2 }}> <Typography variant="h2" sx={{ my: 2 }}>
The page you were looking for doesn't exist. The page you were looking for doesn't exist.
</Typography> </Typography>
<Typography <Button
variant="h4" href="/login"
color="text.secondary" variant="outlined"
fontWeight="normal" sx={{ backgroundColor: 'white' }}
sx={{ mb: 4 }}
> >
It's on us, we moved the content to a different page. The search Go to homepage
below should help! </Button>
</Typography>
</Box> </Box>
<Container maxWidth="sm">
<Card sx={{ textAlign: 'center', mt: 3, p: 4 }}>
<FormControl variant="outlined" fullWidth>
<OutlinedInputWrapper
type="text"
placeholder="Search terms here..."
endAdornment={
<InputAdornment position="end">
<ButtonSearch variant="contained" size="small">
Search
</ButtonSearch>
</InputAdornment>
}
startAdornment={
<InputAdornment position="start">
<SearchTwoToneIcon />
</InputAdornment>
}
/>
</FormControl>
<Divider sx={{ my: 4 }}>OR</Divider>
<Button href="/overview" variant="outlined">
Go to homepage
</Button>
</Card>
</Container>
</Container> </Container>
</MainContent> </MainContent>
</> </>

View File

@ -110,7 +110,7 @@ export const transformInputToDailyData = async (
while (startUnixTime < endTimestamp) { while (startUnixTime < endTimestamp) {
timestampPromises.push(fetchData(startUnixTime, s3Credentials)); timestampPromises.push(fetchData(startUnixTime, s3Credentials));
startUnixTime = UnixTime.fromTicks(startUnixTime.ticks + diff / 200); startUnixTime = UnixTime.fromTicks(startUnixTime.ticks + diff / 100);
if (startUnixTime.ticks % 2 !== 0) { if (startUnixTime.ticks % 2 !== 0) {
startUnixTime = UnixTime.fromTicks(startUnixTime.ticks + 1); startUnixTime = UnixTime.fromTicks(startUnixTime.ticks + 1);
} }
@ -436,12 +436,8 @@ export const transformInputToAggregatedData = async (
overviewData['/GridExportPower'].magnitude overviewData['/GridExportPower'].magnitude
), ),
unit: '(kWh)', unit: '(kWh)',
min: min: overviewData['/GridExportPower'].min,
overviewData['/GridImportPower'].min + max: overviewData['/GridImportPower'].max
overviewData['/GridExportPower'].min,
max:
overviewData['/GridImportPower'].max +
overviewData['/GridExportPower'].max
}; };
chartOverview.overview = { chartOverview.overview = {

View File

@ -11,6 +11,7 @@ import { styled } from '@mui/material/styles';
import ExpandMoreTwoToneIcon from '@mui/icons-material/ExpandMoreTwoTone'; import ExpandMoreTwoToneIcon from '@mui/icons-material/ExpandMoreTwoTone';
import { ThemeContext } from '../../../../theme/ThemeProvider'; import { ThemeContext } from '../../../../theme/ThemeProvider';
import { FormattedMessage } from 'react-intl'; import { FormattedMessage } from 'react-intl';
import '../../../../App.css';
interface HeaderButtonsProps { interface HeaderButtonsProps {
language: string; language: string;
@ -106,7 +107,7 @@ function HeaderMenu(props: HeaderButtonsProps) {
const isMobile = window.innerWidth <= 1280; const isMobile = window.innerWidth <= 1280;
return ( return (
<> <div style={{ userSelect: 'none' }}>
<ListWrapper <ListWrapper
sx={{ sx={{
color: isMobile ? 'white' : '' color: isMobile ? 'white' : ''
@ -132,18 +133,22 @@ function HeaderMenu(props: HeaderButtonsProps) {
</ListItem> </ListItem>
</List> </List>
</ListWrapper> </ListWrapper>
<Menu anchorEl={ref.current} onClose={handleClose} open={isOpen}> <div
<MenuItem value="en" onClick={() => handleLanguageSelect('en')}> style={{ userSelect: 'none', pointerEvents: 'none', cursor: 'default' }}
English >
</MenuItem> <Menu anchorEl={ref.current} onClose={handleClose} open={isOpen}>
<MenuItem value="de" onClick={() => handleLanguageSelect('de')}> <MenuItem value="en" onClick={() => handleLanguageSelect('en')}>
German English
</MenuItem> </MenuItem>
<MenuItem value="fr" onClick={() => handleLanguageSelect('fr')}> <MenuItem value="de" onClick={() => handleLanguageSelect('de')}>
French German
</MenuItem> </MenuItem>
</Menu> <MenuItem value="fr" onClick={() => handleLanguageSelect('fr')}>
</> French
</MenuItem>
</Menu>
</div>
</div>
); );
} }

View File

@ -19,6 +19,7 @@ import { TokenContext } from 'src/contexts/tokenContext';
import { useNavigate } from 'react-router-dom'; import { useNavigate } from 'react-router-dom';
import routes from 'src/Resources/routes.json'; import routes from 'src/Resources/routes.json';
import { WebSocketContext } from '../../../../contexts/WebSocketContextProvider'; import { WebSocketContext } from '../../../../contexts/WebSocketContextProvider';
import '../../../../App.css';
const UserBoxButton = styled(Button)( const UserBoxButton = styled(Button)(
({ theme }) => ` ({ theme }) => `
@ -86,8 +87,13 @@ function HeaderUserbox() {
}; };
return ( return (
<> <div style={{ userSelect: 'none' }}>
<UserBoxButton color="secondary" ref={ref} onClick={handleOpen}> <UserBoxButton
color="secondary"
ref={ref}
onClick={handleOpen}
style={{ cursor: 'pointer' }}
>
<Hidden mdDown> <Hidden mdDown>
<UserBoxText> <UserBoxText>
<UserBoxLabel variant="body1">{currentUser?.name}</UserBoxLabel> <UserBoxLabel variant="body1">{currentUser?.name}</UserBoxLabel>
@ -113,14 +119,16 @@ function HeaderUserbox() {
horizontal: 'right' horizontal: 'right'
}} }}
> >
<MenuUserBox sx={{ minWidth: 210 }} display="flex"> <div style={{ userSelect: 'none', cursor: 'none' }}>
<UserBoxText> <MenuUserBox sx={{ minWidth: 210 }} display="flex">
<UserBoxLabel variant="body1">{currentUser?.name}</UserBoxLabel> <UserBoxText>
<UserBoxDescription variant="body2"> <UserBoxLabel variant="body1">{currentUser?.name}</UserBoxLabel>
{currentUser?.email} <UserBoxDescription variant="body2">
</UserBoxDescription> {currentUser?.email}
</UserBoxText> </UserBoxDescription>
</MenuUserBox> </UserBoxText>
</MenuUserBox>
</div>
<Divider /> <Divider />
<Box sx={{ m: 1 }}> <Box sx={{ m: 1 }}>
@ -130,7 +138,7 @@ function HeaderUserbox() {
</Button> </Button>
</Box> </Box>
</Popover> </Popover>
</> </div>
); );
} }

View File

@ -43,10 +43,12 @@ const SidebarLayout = (props: SidebarLayoutProps) => {
} }
}} }}
> >
<Header <div style={{ userSelect: 'none' }}>
language={props.language} <Header
onSelectLanguage={props.onSelectLanguage} language={props.language}
/> onSelectLanguage={props.onSelectLanguage}
/>
</div>
<Sidebar /> <Sidebar />
<Box <Box
sx={{ sx={{