aboutsummaryrefslogtreecommitdiff
path: root/modern/src/settings
diff options
context:
space:
mode:
Diffstat (limited to 'modern/src/settings')
-rw-r--r--modern/src/settings/ComputedAttributePage.js60
-rw-r--r--modern/src/settings/ComputedAttributesPage.js80
-rw-r--r--modern/src/settings/DriverPage.js27
-rw-r--r--modern/src/settings/DriversPage.js74
-rw-r--r--modern/src/settings/GroupPage.js27
-rw-r--r--modern/src/settings/GroupsPage.js70
-rw-r--r--modern/src/settings/MaintenancePage.js90
-rw-r--r--modern/src/settings/MaintenancesPage.js84
-rw-r--r--modern/src/settings/NotificationPage.js56
-rw-r--r--modern/src/settings/NotificationsPage.js80
-rw-r--r--modern/src/settings/OptionsLayout/useRoutes.js26
11 files changed, 353 insertions, 321 deletions
diff --git a/modern/src/settings/ComputedAttributePage.js b/modern/src/settings/ComputedAttributePage.js
index 73759fab..fea613a9 100644
--- a/modern/src/settings/ComputedAttributePage.js
+++ b/modern/src/settings/ComputedAttributePage.js
@@ -1,19 +1,19 @@
import React, { useState } from 'react';
-import { Accordion, AccordionSummary, AccordionDetails, makeStyles, Typography, FormControl, InputLabel, MenuItem, Select, TextField } from "@material-ui/core";
+import {
+ Accordion, AccordionSummary, AccordionDetails, makeStyles, Typography, FormControl, InputLabel, MenuItem, Select, TextField,
+} from '@material-ui/core';
+import ExpandMoreIcon from '@material-ui/icons/ExpandMore';
import t from '../common/localization';
import EditItemView from '../EditItemView';
-import ExpandMoreIcon from '@material-ui/icons/ExpandMore';
import positionAttributes from '../attributes/positionAttributes';
-
const useStyles = makeStyles(() => ({
details: {
flexDirection: 'column',
},
}));
-const ComputedAttributePage =() => {
-
+const ComputedAttributePage = () => {
const classes = useStyles();
const [item, setItem] = useState();
const [key, setKey] = useState();
@@ -24,20 +24,21 @@ const ComputedAttributePage =() => {
type: value.type,
}));
- const handleChange = event => {
+ const handleChange = (event) => {
const newValue = event.target.value;
setKey(newValue);
const positionAttribute = positionAttributes[newValue];
- if(positionAttribute && positionAttribute.type) {
- setItem({...item, attribute: newValue, type: positionAttribute.type});
+ if (positionAttribute && positionAttribute.type) {
+ setItem({ ...item, attribute: newValue, type: positionAttribute.type });
} else {
- setItem({...item, attribute: newValue});
+ setItem({ ...item, attribute: newValue });
}
- }
+ };
return (
<EditItemView endpoint="/attributes/computed" item={item} setItem={setItem}>
- {item &&
+ {item
+ && (
<Accordion defaultExpanded>
<AccordionSummary expandIcon={<ExpandMoreIcon />}>
<Typography variant="subtitle1">
@@ -48,46 +49,51 @@ const ComputedAttributePage =() => {
<TextField
margin="normal"
value={item.description || ''}
- onChange={event => setItem({...item, description: event.target.value})}
+ onChange={(event) => setItem({ ...item, description: event.target.value })}
label={t('sharedDescription')}
- variant="filled" />
+ variant="filled"
+ />
<FormControl variant="filled" margin="normal" fullWidth>
<InputLabel>{t('sharedAttribute')}</InputLabel>
- <Select
- value={item.attribute || ''}
- onChange={handleChange}>
+ <Select
+ value={item.attribute || ''}
+ onChange={handleChange}
+ >
{options.map((option) => (
<MenuItem key={option.key} value={option.key}>{option.name}</MenuItem>
))}
</Select>
- </FormControl>
+ </FormControl>
<TextField
margin="normal"
value={item.expression || ''}
- onChange={event => setItem({...item, expression: event.target.value})}
+ onChange={(event) => setItem({ ...item, expression: event.target.value })}
label={t('sharedExpression')}
multiline
rows={4}
- variant="filled" />
+ variant="filled"
+ />
<FormControl
variant="filled"
margin="normal"
fullWidth
- disabled={key in positionAttributes}>
+ disabled={key in positionAttributes}
+ >
<InputLabel>{t('sharedType')}</InputLabel>
<Select
value={item.type || ''}
- onChange={event => setItem({...item, type: event.target.value})}>
- <MenuItem value={'string'}>{t('sharedTypeString')}</MenuItem>
- <MenuItem value={'number'}>{t('sharedTypeNumber')}</MenuItem>
- <MenuItem value={'boolean'}>{t('sharedTypeBoolean')}</MenuItem>
+ onChange={(event) => setItem({ ...item, type: event.target.value })}
+ >
+ <MenuItem value="string">{t('sharedTypeString')}</MenuItem>
+ <MenuItem value="number">{t('sharedTypeNumber')}</MenuItem>
+ <MenuItem value="boolean">{t('sharedTypeBoolean')}</MenuItem>
</Select>
</FormControl>
</AccordionDetails>
</Accordion>
- }
+ )}
</EditItemView>
- )
-}
+ );
+};
export default ComputedAttributePage;
diff --git a/modern/src/settings/ComputedAttributesPage.js b/modern/src/settings/ComputedAttributesPage.js
index d7475989..fcf49d3a 100644
--- a/modern/src/settings/ComputedAttributesPage.js
+++ b/modern/src/settings/ComputedAttributesPage.js
@@ -1,5 +1,7 @@
import React, { useState } from 'react';
-import { TableContainer, Table, TableRow, TableCell, TableHead, TableBody, makeStyles, IconButton } from '@material-ui/core';
+import {
+ TableContainer, Table, TableRow, TableCell, TableHead, TableBody, makeStyles, IconButton,
+} from '@material-ui/core';
import MoreVertIcon from '@material-ui/icons/MoreVert';
import { useSelector } from 'react-redux';
import t from '../common/localization';
@@ -7,11 +9,11 @@ import { useEffectAsync } from '../reactHelper';
import EditCollectionView from '../EditCollectionView';
import OptionsLayout from './OptionsLayout';
-const useStyles = makeStyles(theme => ({
+const useStyles = makeStyles((theme) => ({
columnAction: {
width: theme.spacing(1),
- padding: theme.spacing(0, 1)
- }
+ padding: theme.spacing(0, 1),
+ },
}));
const ComputedAttributeView = ({ updateTimestamp, onMenuClick }) => {
@@ -19,7 +21,7 @@ const ComputedAttributeView = ({ updateTimestamp, onMenuClick }) => {
const [items, setItems] = useState([]);
const adminEnabled = useSelector(
- state => state.session.user && state.session.user.administrator
+ (state) => state.session.user && state.session.user.administrator,
);
useEffectAsync(async () => {
@@ -31,50 +33,48 @@ const ComputedAttributeView = ({ updateTimestamp, onMenuClick }) => {
return (
<TableContainer>
- <Table>
- <TableHead>
- <TableRow>
- {adminEnabled && <TableCell className={classes.columnAction} />}
- <TableCell>{t('sharedDescription')}</TableCell>
- <TableCell>{t('sharedAttribute')}</TableCell>
- <TableCell>{t('sharedExpression')}</TableCell>
- <TableCell>{t('sharedType')}</TableCell>
- </TableRow>
- </TableHead>
- <TableBody>
- {items.map(item => (
- <TableRow key={item.id}>
+ <Table>
+ <TableHead>
+ <TableRow>
+ {adminEnabled && <TableCell className={classes.columnAction} />}
+ <TableCell>{t('sharedDescription')}</TableCell>
+ <TableCell>{t('sharedAttribute')}</TableCell>
+ <TableCell>{t('sharedExpression')}</TableCell>
+ <TableCell>{t('sharedType')}</TableCell>
+ </TableRow>
+ </TableHead>
+ <TableBody>
+ {items.map((item) => (
+ <TableRow key={item.id}>
{adminEnabled && (
<TableCell className={classes.columnAction} padding="none">
- <IconButton
- onClick={event => onMenuClick(event.currentTarget, item.id)}
- >
+ <IconButton
+ onClick={(event) => onMenuClick(event.currentTarget, item.id)}
+ >
<MoreVertIcon />
</IconButton>
</TableCell>
)}
- <TableCell>{item.description}</TableCell>
- <TableCell>{item.attribute}</TableCell>
- <TableCell>{item.expression}</TableCell>
- <TableCell>{item.type}</TableCell>
- </TableRow>
- ))}
- </TableBody>
- </Table>
+ <TableCell>{item.description}</TableCell>
+ <TableCell>{item.attribute}</TableCell>
+ <TableCell>{item.expression}</TableCell>
+ <TableCell>{item.type}</TableCell>
+ </TableRow>
+ ))}
+ </TableBody>
+ </Table>
</TableContainer>
);
};
-const ComputedAttributesPage = () => {
- return (
- <OptionsLayout>
- <EditCollectionView
- content={ComputedAttributeView}
- editPath="/settings/attribute"
- endpoint="attributes/computed"
- />
- </OptionsLayout>
- );
-};
+const ComputedAttributesPage = () => (
+ <OptionsLayout>
+ <EditCollectionView
+ content={ComputedAttributeView}
+ editPath="/settings/attribute"
+ endpoint="attributes/computed"
+ />
+ </OptionsLayout>
+);
export default ComputedAttributesPage;
diff --git a/modern/src/settings/DriverPage.js b/modern/src/settings/DriverPage.js
index 86feab84..01400c5c 100644
--- a/modern/src/settings/DriverPage.js
+++ b/modern/src/settings/DriverPage.js
@@ -1,9 +1,11 @@
import React, { useState } from 'react';
import TextField from '@material-ui/core/TextField';
+import {
+ Accordion, AccordionSummary, AccordionDetails, makeStyles, Typography,
+} from '@material-ui/core';
+import ExpandMoreIcon from '@material-ui/icons/ExpandMore';
import t from '../common/localization';
import EditItemView from '../EditItemView';
-import { Accordion, AccordionSummary, AccordionDetails, makeStyles, Typography } from '@material-ui/core';
-import ExpandMoreIcon from '@material-ui/icons/ExpandMore';
import EditAttributesView from '../attributes/EditAttributesView';
const useStyles = makeStyles(() => ({
@@ -19,7 +21,8 @@ const DriverPage = () => {
return (
<EditItemView endpoint="drivers" item={item} setItem={setItem}>
- {item &&
+ {item
+ && (
<>
<Accordion defaultExpanded>
<AccordionSummary expandIcon={<ExpandMoreIcon />}>
@@ -31,15 +34,17 @@ const DriverPage = () => {
<TextField
margin="normal"
value={item.name || ''}
- onChange={event => setItem({...item, name: event.target.value})}
+ onChange={(event) => setItem({ ...item, name: event.target.value })}
label={t('sharedName')}
- variant="filled" />
+ variant="filled"
+ />
<TextField
margin="normal"
value={item.uniqueId || ''}
- onChange={event => setItem({...item, uniqueId: event.target.value})}
+ onChange={(event) => setItem({ ...item, uniqueId: event.target.value })}
label={t('deviceIdentifier')}
- variant="filled" />
+ variant="filled"
+ />
</AccordionDetails>
</Accordion>
<Accordion>
@@ -51,15 +56,15 @@ const DriverPage = () => {
<AccordionDetails className={classes.details}>
<EditAttributesView
attributes={item.attributes}
- setAttributes={attributes => setItem({...item, attributes})}
+ setAttributes={(attributes) => setItem({ ...item, attributes })}
definitions={{}}
- />
+ />
</AccordionDetails>
</Accordion>
</>
- }
+ )}
</EditItemView>
);
-}
+};
export default DriverPage;
diff --git a/modern/src/settings/DriversPage.js b/modern/src/settings/DriversPage.js
index d5427b2f..57f69b6e 100644
--- a/modern/src/settings/DriversPage.js
+++ b/modern/src/settings/DriversPage.js
@@ -1,16 +1,18 @@
import React, { useState } from 'react';
-import { TableContainer, Table, TableRow, TableCell, TableHead, TableBody, makeStyles, IconButton } from '@material-ui/core';
+import {
+ TableContainer, Table, TableRow, TableCell, TableHead, TableBody, makeStyles, IconButton,
+} from '@material-ui/core';
import MoreVertIcon from '@material-ui/icons/MoreVert';
import t from '../common/localization';
import { useEffectAsync } from '../reactHelper';
import EditCollectionView from '../EditCollectionView';
import OptionsLayout from './OptionsLayout';
-const useStyles = makeStyles(theme => ({
+const useStyles = makeStyles((theme) => ({
columnAction: {
width: theme.spacing(1),
- padding: theme.spacing(0, 1)
- }
+ padding: theme.spacing(0, 1),
+ },
}));
const DriversView = ({ updateTimestamp, onMenuClick }) => {
@@ -27,44 +29,42 @@ const DriversView = ({ updateTimestamp, onMenuClick }) => {
return (
<TableContainer>
- <Table>
- <TableHead>
- <TableRow>
- <TableCell className={classes.columnAction} />
- <TableCell>{t('sharedName')}</TableCell>
- <TableCell>{t('deviceIdentifier')}</TableCell>
- </TableRow>
- </TableHead>
- <TableBody>
- {items.map(item => (
- <TableRow key={item.id}>
- <TableCell className={classes.columnAction} padding="none">
+ <Table>
+ <TableHead>
+ <TableRow>
+ <TableCell className={classes.columnAction} />
+ <TableCell>{t('sharedName')}</TableCell>
+ <TableCell>{t('deviceIdentifier')}</TableCell>
+ </TableRow>
+ </TableHead>
+ <TableBody>
+ {items.map((item) => (
+ <TableRow key={item.id}>
+ <TableCell className={classes.columnAction} padding="none">
<IconButton
- onClick={event => onMenuClick(event.currentTarget, item.id)}
+ onClick={(event) => onMenuClick(event.currentTarget, item.id)}
>
- <MoreVertIcon />
- </IconButton>
- </TableCell>
- <TableCell>{item.name}</TableCell>
- <TableCell>{item.uniqueId}</TableCell>
- </TableRow>
- ))}
- </TableBody>
- </Table>
+ <MoreVertIcon />
+ </IconButton>
+ </TableCell>
+ <TableCell>{item.name}</TableCell>
+ <TableCell>{item.uniqueId}</TableCell>
+ </TableRow>
+ ))}
+ </TableBody>
+ </Table>
</TableContainer>
);
};
-const DriversPage = () => {
- return (
- <OptionsLayout>
- <EditCollectionView
- content={DriversView}
- editPath="/settings/driver"
- endpoint="drivers"
- />
- </OptionsLayout>
- );
-};
+const DriversPage = () => (
+ <OptionsLayout>
+ <EditCollectionView
+ content={DriversView}
+ editPath="/settings/driver"
+ endpoint="drivers"
+ />
+ </OptionsLayout>
+);
export default DriversPage;
diff --git a/modern/src/settings/GroupPage.js b/modern/src/settings/GroupPage.js
index b9fa8716..f9af0f8b 100644
--- a/modern/src/settings/GroupPage.js
+++ b/modern/src/settings/GroupPage.js
@@ -1,10 +1,12 @@
import React, { useState } from 'react';
import TextField from '@material-ui/core/TextField';
+import {
+ Accordion, AccordionSummary, AccordionDetails, makeStyles, Typography,
+} from '@material-ui/core';
+import ExpandMoreIcon from '@material-ui/icons/ExpandMore';
import t from '../common/localization';
import EditItemView from '../EditItemView';
-import { Accordion, AccordionSummary, AccordionDetails, makeStyles, Typography } from '@material-ui/core';
-import ExpandMoreIcon from '@material-ui/icons/ExpandMore';
import EditAttributesView from '../attributes/EditAttributesView';
import deviceAttributes from '../attributes/deviceAttributes';
import SelectField from '../form/SelectField';
@@ -22,7 +24,8 @@ const GroupPage = () => {
return (
<EditItemView endpoint="groups" item={item} setItem={setItem}>
- {item &&
+ {item
+ && (
<>
<Accordion defaultExpanded>
<AccordionSummary expandIcon={<ExpandMoreIcon />}>
@@ -34,9 +37,10 @@ const GroupPage = () => {
<TextField
margin="normal"
value={item.name || ''}
- onChange={event => setItem({...item, name: event.target.value})}
+ onChange={(event) => setItem({ ...item, name: event.target.value })}
label={t('sharedName')}
- variant="filled" />
+ variant="filled"
+ />
</AccordionDetails>
</Accordion>
<Accordion>
@@ -49,10 +53,11 @@ const GroupPage = () => {
<SelectField
margin="normal"
value={item.groupId || 0}
- onChange={event => setItem({...item, groupId: Number(event.target.value)})}
+ onChange={(event) => setItem({ ...item, groupId: Number(event.target.value) })}
endpoint="/api/groups"
label={t('groupParent')}
- variant="filled" />
+ variant="filled"
+ />
</AccordionDetails>
</Accordion>
<Accordion>
@@ -64,15 +69,15 @@ const GroupPage = () => {
<AccordionDetails className={classes.details}>
<EditAttributesView
attributes={item.attributes}
- setAttributes={attributes => setItem({...item, attributes})}
+ setAttributes={(attributes) => setItem({ ...item, attributes })}
definitions={deviceAttributes}
- />
+ />
</AccordionDetails>
</Accordion>
</>
- }
+ )}
</EditItemView>
);
-}
+};
export default GroupPage;
diff --git a/modern/src/settings/GroupsPage.js b/modern/src/settings/GroupsPage.js
index 2fc65c12..3b1058e3 100644
--- a/modern/src/settings/GroupsPage.js
+++ b/modern/src/settings/GroupsPage.js
@@ -1,16 +1,18 @@
import React, { useState } from 'react';
-import { TableContainer, Table, TableRow, TableCell, TableHead, TableBody, makeStyles, IconButton } from '@material-ui/core';
+import {
+ TableContainer, Table, TableRow, TableCell, TableHead, TableBody, makeStyles, IconButton,
+} from '@material-ui/core';
import MoreVertIcon from '@material-ui/icons/MoreVert';
import t from '../common/localization';
import { useEffectAsync } from '../reactHelper';
import EditCollectionView from '../EditCollectionView';
import OptionsLayout from './OptionsLayout';
-const useStyles = makeStyles(theme => ({
+const useStyles = makeStyles((theme) => ({
columnAction: {
width: theme.spacing(1),
- padding: theme.spacing(0, 1)
- }
+ padding: theme.spacing(0, 1),
+ },
}));
const GroupsView = ({ updateTimestamp, onMenuClick }) => {
@@ -27,42 +29,40 @@ const GroupsView = ({ updateTimestamp, onMenuClick }) => {
return (
<TableContainer>
- <Table>
- <TableHead>
- <TableRow>
- <TableCell className={classes.columnAction} />
- <TableCell>{t('sharedName')}</TableCell>
- </TableRow>
- </TableHead>
- <TableBody>
- {items.map(item => (
- <TableRow key={item.id}>
- <TableCell className={classes.columnAction} padding="none">
+ <Table>
+ <TableHead>
+ <TableRow>
+ <TableCell className={classes.columnAction} />
+ <TableCell>{t('sharedName')}</TableCell>
+ </TableRow>
+ </TableHead>
+ <TableBody>
+ {items.map((item) => (
+ <TableRow key={item.id}>
+ <TableCell className={classes.columnAction} padding="none">
<IconButton
- onClick={event => onMenuClick(event.currentTarget, item.id)}
+ onClick={(event) => onMenuClick(event.currentTarget, item.id)}
>
- <MoreVertIcon />
- </IconButton>
- </TableCell>
- <TableCell>{item.name}</TableCell>
- </TableRow>
- ))}
- </TableBody>
- </Table>
+ <MoreVertIcon />
+ </IconButton>
+ </TableCell>
+ <TableCell>{item.name}</TableCell>
+ </TableRow>
+ ))}
+ </TableBody>
+ </Table>
</TableContainer>
);
};
-const GroupsPage = () => {
- return (
- <OptionsLayout>
- <EditCollectionView
- content={GroupsView}
- editPath="/settings/group"
- endpoint="groups"
- />
- </OptionsLayout>
- );
-};
+const GroupsPage = () => (
+ <OptionsLayout>
+ <EditCollectionView
+ content={GroupsView}
+ editPath="/settings/group"
+ endpoint="groups"
+ />
+ </OptionsLayout>
+);
export default GroupsPage;
diff --git a/modern/src/settings/MaintenancePage.js b/modern/src/settings/MaintenancePage.js
index 3b4fde54..9d60937d 100644
--- a/modern/src/settings/MaintenancePage.js
+++ b/modern/src/settings/MaintenancePage.js
@@ -1,14 +1,18 @@
import React, { useState } from 'react';
+import {
+ Accordion, AccordionSummary, AccordionDetails, makeStyles, Typography, TextField, FormControl, InputLabel, MenuItem, Select,
+} from '@material-ui/core';
+import InputAdornment from '@material-ui/core/InputAdornment';
+import ExpandMoreIcon from '@material-ui/icons/ExpandMore';
import t from '../common/localization';
import { prefixString } from '../common/stringUtils';
import EditItemView from '../EditItemView';
-import { Accordion, AccordionSummary, AccordionDetails, makeStyles, Typography, TextField, FormControl, InputLabel, MenuItem, Select, } from '@material-ui/core';
-import InputAdornment from '@material-ui/core/InputAdornment';
-import ExpandMoreIcon from '@material-ui/icons/ExpandMore';
import EditAttributesView from '../attributes/EditAttributesView';
import positionAttributes from '../attributes/positionAttributes';
import { useAttributePreference } from '../common/preferences';
-import { speedFromKnots, speedToKnots, distanceFromMeters, distanceToMeters } from '../common/converter';
+import {
+ speedFromKnots, speedToKnots, distanceFromMeters, distanceToMeters,
+} from '../common/converter';
const useStyles = makeStyles(() => ({
details: {
@@ -17,46 +21,46 @@ const useStyles = makeStyles(() => ({
}));
const MaintenancePage = () => {
-
const classes = useStyles();
const [item, setItem] = useState();
- const [labels, setLabels] = useState({start: '', period: ''});
+ const [labels, setLabels] = useState({ start: '', period: '' });
const speedUnit = useAttributePreference('speedUnit');
const distanceUnit = useAttributePreference('distanceUnit');
const convertToList = (attributes) => {
- let otherList = [];
+ const otherList = [];
for (const key in attributes) {
const value = attributes[key];
if (value.type === 'number') {
- otherList.push({key, name: value.name, type: value.type});
+ otherList.push({ key, name: value.name, type: value.type });
}
}
return otherList;
- }
+ };
- const onMaintenanceTypeChange = event => {
+ const onMaintenanceTypeChange = (event) => {
const newValue = event.target.value;
- setItem({ ...item, type: newValue, start: 0, period: 0 });
+ setItem({
+ ...item, type: newValue, start: 0, period: 0,
+ });
const attribute = positionAttributes[newValue];
if (attribute && attribute.dataType) {
switch (attribute.dataType) {
case 'distance':
- setLabels({ ...labels, start: t(prefixString('shared', distanceUnit)), period: t(prefixString('shared', distanceUnit))});
+ setLabels({ ...labels, start: t(prefixString('shared', distanceUnit)), period: t(prefixString('shared', distanceUnit)) });
break;
case 'speed':
- setLabels({ ...labels, start: t(prefixString('shared', speedUnit)), period: t(prefixString('shared', speedUnit))});
+ setLabels({ ...labels, start: t(prefixString('shared', speedUnit)), period: t(prefixString('shared', speedUnit)) });
break;
default:
break;
}
}
- }
-
- const rawToValue = value => {
+ };
+ const rawToValue = (value) => {
const attribute = positionAttributes[item.type];
if (attribute && attribute.dataType) {
switch (attribute.dataType) {
@@ -69,10 +73,9 @@ const MaintenancePage = () => {
}
}
return value;
- }
-
- const valueToRaw = value => {
+ };
+ const valueToRaw = (value) => {
const attribute = positionAttributes[item.type];
if (attribute && attribute.dataType) {
switch (attribute.dataType) {
@@ -85,11 +88,12 @@ const MaintenancePage = () => {
}
}
return value;
- }
+ };
return (
<EditItemView endpoint="maintenance" item={item} setItem={setItem}>
- {item &&
+ {item
+ && (
<>
<Accordion defaultExpanded>
<AccordionSummary expandIcon={<ExpandMoreIcon />}>
@@ -101,39 +105,43 @@ const MaintenancePage = () => {
<TextField
margin="normal"
value={item.name || ''}
- onChange={event => setItem({...item, name: event.target.value})}
+ onChange={(event) => setItem({ ...item, name: event.target.value })}
label={t('sharedName')}
- variant="filled" />
+ variant="filled"
+ />
<FormControl variant="filled" margin="normal" fullWidth>
<InputLabel>{t('sharedType')}</InputLabel>
- <Select
- value={item.type || ''}
- onChange={onMaintenanceTypeChange}>
- {convertToList(positionAttributes).map(({ key, name })=>(
- <MenuItem key={key} value={key}>{name}</MenuItem>
- ))}
+ <Select
+ value={item.type || ''}
+ onChange={onMaintenanceTypeChange}
+ >
+ {convertToList(positionAttributes).map(({ key, name }) => (
+ <MenuItem key={key} value={key}>{name}</MenuItem>
+ ))}
</Select>
- </FormControl>
+ </FormControl>
<TextField
margin="normal"
type="number"
value={rawToValue(item.start) || ''}
- onChange={event => setItem({...item, start: valueToRaw(event.target.value)})}
+ onChange={(event) => setItem({ ...item, start: valueToRaw(event.target.value) })}
label={t('maintenanceStart')}
variant="filled"
InputProps={{
- endAdornment: <InputAdornment position="start">{labels.start}</InputAdornment>,
- }} />
+ endAdornment: <InputAdornment position="start">{labels.start}</InputAdornment>,
+ }}
+ />
<TextField
margin="normal"
type="number"
value={rawToValue(item.period) || ''}
- onChange={event => setItem({...item, period: valueToRaw(event.target.value)})}
+ onChange={(event) => setItem({ ...item, period: valueToRaw(event.target.value) })}
label={t('maintenancePeriod')}
variant="filled"
InputProps={{
- endAdornment: <InputAdornment position="start">{labels.period}</InputAdornment>,
- }} />
+ endAdornment: <InputAdornment position="start">{labels.period}</InputAdornment>,
+ }}
+ />
</AccordionDetails>
</Accordion>
<Accordion>
@@ -145,15 +153,15 @@ const MaintenancePage = () => {
<AccordionDetails className={classes.details}>
<EditAttributesView
attributes={item.attributes}
- setAttributes={attributes => setItem({...item, attributes})}
+ setAttributes={(attributes) => setItem({ ...item, attributes })}
definitions={{}}
- />
+ />
</AccordionDetails>
- </Accordion>
+ </Accordion>
</>
- }
+ )}
</EditItemView>
);
-}
+};
export default MaintenancePage;
diff --git a/modern/src/settings/MaintenancesPage.js b/modern/src/settings/MaintenancesPage.js
index d713eaa3..b8e74d28 100644
--- a/modern/src/settings/MaintenancesPage.js
+++ b/modern/src/settings/MaintenancesPage.js
@@ -1,5 +1,7 @@
import React, { useState } from 'react';
-import { TableContainer, Table, TableRow, TableCell, TableHead, TableBody, makeStyles, IconButton } from '@material-ui/core';
+import {
+ TableContainer, Table, TableRow, TableCell, TableHead, TableBody, makeStyles, IconButton,
+} from '@material-ui/core';
import MoreVertIcon from '@material-ui/icons/MoreVert';
import t from '../common/localization';
import { useEffectAsync } from '../reactHelper';
@@ -10,11 +12,11 @@ import { formatDistance, formatSpeed } from '../common/formatter';
import { useAttributePreference } from '../common/preferences';
import OptionsLayout from './OptionsLayout';
-const useStyles = makeStyles(theme => ({
+const useStyles = makeStyles((theme) => ({
columnAction: {
width: theme.spacing(1),
- padding: theme.spacing(0, 1)
- }
+ padding: theme.spacing(0, 1),
+ },
}));
const MaintenancesView = ({ updateTimestamp, onMenuClick }) => {
@@ -37,7 +39,7 @@ const MaintenancesView = ({ updateTimestamp, onMenuClick }) => {
switch (attribute.dataType) {
case 'speed':
return formatSpeed(value, speedUnit);
- case 'distance':
+ case 'distance':
return formatDistance(value, distanceUnit);
default:
return value;
@@ -49,48 +51,46 @@ const MaintenancesView = ({ updateTimestamp, onMenuClick }) => {
return (
<TableContainer>
- <Table>
- <TableHead>
- <TableRow>
- <TableCell className={classes.columnAction} />
- <TableCell>{t('sharedName')}</TableCell>
- <TableCell>{t('sharedType')}</TableCell>
- <TableCell>{t('maintenanceStart')}</TableCell>
- <TableCell>{t('maintenancePeriod')}</TableCell>
- </TableRow>
- </TableHead>
- <TableBody>
- {items.map(item => (
- <TableRow key={item.id}>
- <TableCell className={classes.columnAction} padding="none">
+ <Table>
+ <TableHead>
+ <TableRow>
+ <TableCell className={classes.columnAction} />
+ <TableCell>{t('sharedName')}</TableCell>
+ <TableCell>{t('sharedType')}</TableCell>
+ <TableCell>{t('maintenanceStart')}</TableCell>
+ <TableCell>{t('maintenancePeriod')}</TableCell>
+ </TableRow>
+ </TableHead>
+ <TableBody>
+ {items.map((item) => (
+ <TableRow key={item.id}>
+ <TableCell className={classes.columnAction} padding="none">
<IconButton
- onClick={event => onMenuClick(event.currentTarget, item.id)}
+ onClick={(event) => onMenuClick(event.currentTarget, item.id)}
>
- <MoreVertIcon />
- </IconButton>
- </TableCell>
- <TableCell>{item.name}</TableCell>
- <TableCell>{item.type}</TableCell>
- <TableCell>{convertAttribute(item.type, item.start)}</TableCell>
- <TableCell>{convertAttribute(item.type, item.period)}</TableCell>
- </TableRow>
- ))}
- </TableBody>
- </Table>
+ <MoreVertIcon />
+ </IconButton>
+ </TableCell>
+ <TableCell>{item.name}</TableCell>
+ <TableCell>{item.type}</TableCell>
+ <TableCell>{convertAttribute(item.type, item.start)}</TableCell>
+ <TableCell>{convertAttribute(item.type, item.period)}</TableCell>
+ </TableRow>
+ ))}
+ </TableBody>
+ </Table>
</TableContainer>
);
};
-const MaintenacesPage = () => {
- return (
- <OptionsLayout>
- <EditCollectionView
- content={MaintenancesView}
- editPath="/settings/maintenance"
- endpoint="maintenance"
- />
- </OptionsLayout>
- );
-};
+const MaintenacesPage = () => (
+ <OptionsLayout>
+ <EditCollectionView
+ content={MaintenancesView}
+ editPath="/settings/maintenance"
+ endpoint="maintenance"
+ />
+ </OptionsLayout>
+);
export default MaintenacesPage;
diff --git a/modern/src/settings/NotificationPage.js b/modern/src/settings/NotificationPage.js
index 33904e7f..11c427fe 100644
--- a/modern/src/settings/NotificationPage.js
+++ b/modern/src/settings/NotificationPage.js
@@ -1,9 +1,11 @@
import React, { useState } from 'react';
+import {
+ Accordion, AccordionSummary, AccordionDetails, makeStyles, Typography, FormControlLabel, Checkbox,
+} from '@material-ui/core';
+import ExpandMoreIcon from '@material-ui/icons/ExpandMore';
import t, { findStringKeys } from '../common/localization';
import EditItemView from '../EditItemView';
-import { Accordion, AccordionSummary, AccordionDetails, makeStyles, Typography, FormControlLabel, Checkbox } from '@material-ui/core';
-import ExpandMoreIcon from '@material-ui/icons/ExpandMore';
import { prefixString, unprefixString } from '../common/stringUtils';
import SelectField from '../form/SelectField';
@@ -18,14 +20,15 @@ const NotificationPage = () => {
const [item, setItem] = useState();
- const alarms = findStringKeys(it => it.startsWith('alarm')).map(it => ({
+ const alarms = findStringKeys((it) => it.startsWith('alarm')).map((it) => ({
key: unprefixString('alarm', it),
name: t(it),
}));
return (
<EditItemView endpoint="notifications" item={item} setItem={setItem}>
- {item &&
+ {item
+ && (
<>
<Accordion defaultExpanded>
<AccordionSummary expandIcon={<ExpandMoreIcon />}>
@@ -38,47 +41,52 @@ const NotificationPage = () => {
margin="normal"
value={item.type || 'alarm'}
emptyValue={null}
- onChange={e => setItem({...item, type: e.target.value})}
+ onChange={(e) => setItem({ ...item, type: e.target.value })}
endpoint="/api/notifications/types"
- keyGetter={it => it.type}
- titleGetter={it => t(prefixString('event', it.type))}
+ keyGetter={(it) => it.type}
+ titleGetter={(it) => t(prefixString('event', it.type))}
label={t('sharedType')}
- variant="filled" />
+ variant="filled"
+ />
<SelectField
multiple
margin="normal"
value={item.notificators ? item.notificators.split(/[, ]+/) : []}
- onChange={e => setItem({...item, notificators: e.target.value.join()})}
+ onChange={(e) => setItem({ ...item, notificators: e.target.value.join() })}
endpoint="/api/notifications/notificators"
- keyGetter={it => it.type}
- titleGetter={it => t(prefixString('notificator', it.type))}
+ keyGetter={(it) => it.type}
+ titleGetter={(it) => t(prefixString('notificator', it.type))}
label={t('notificationNotificators')}
- variant="filled" />
- {(!item.type || item.type === 'alarm') &&
+ variant="filled"
+ />
+ {(!item.type || item.type === 'alarm')
+ && (
<SelectField
multiple
margin="normal"
value={item.attributes && item.attributes.alarms ? item.attributes.alarms.split(/[, ]+/) : []}
- onChange={e => setItem({...item, attributes: {...item.attributes, alarms: e.target.value.join()}})}
+ onChange={(e) => setItem({ ...item, attributes: { ...item.attributes, alarms: e.target.value.join() } })}
data={alarms}
- keyGetter={it => it.key}
+ keyGetter={(it) => it.key}
label={t('sharedAlarms')}
- variant="filled" />
- }
+ variant="filled"
+ />
+ )}
<FormControlLabel
- control={
+ control={(
<Checkbox
checked={item.always}
- onChange={event => setItem({...item, always: event.target.checked})}
- />
- }
- label={t('notificationAlways')} />
+ onChange={(event) => setItem({ ...item, always: event.target.checked })}
+ />
+ )}
+ label={t('notificationAlways')}
+ />
</AccordionDetails>
</Accordion>
</>
- }
+ )}
</EditItemView>
);
-}
+};
export default NotificationPage;
diff --git a/modern/src/settings/NotificationsPage.js b/modern/src/settings/NotificationsPage.js
index 5707f890..079f88d2 100644
--- a/modern/src/settings/NotificationsPage.js
+++ b/modern/src/settings/NotificationsPage.js
@@ -1,5 +1,7 @@
import React, { useState } from 'react';
-import { TableContainer, Table, TableRow, TableCell, TableHead, TableBody, makeStyles, IconButton } from '@material-ui/core';
+import {
+ TableContainer, Table, TableRow, TableCell, TableHead, TableBody, makeStyles, IconButton,
+} from '@material-ui/core';
import MoreVertIcon from '@material-ui/icons/MoreVert';
import t from '../common/localization';
import { useEffectAsync } from '../reactHelper';
@@ -8,11 +10,11 @@ import { prefixString } from '../common/stringUtils';
import { formatBoolean } from '../common/formatter';
import OptionsLayout from './OptionsLayout';
-const useStyles = makeStyles(theme => ({
+const useStyles = makeStyles((theme) => ({
columnAction: {
width: theme.spacing(1),
- padding: theme.spacing(0, 1)
- }
+ padding: theme.spacing(0, 1),
+ },
}));
const NotificationsView = ({ updateTimestamp, onMenuClick }) => {
@@ -32,7 +34,7 @@ const NotificationsView = ({ updateTimestamp, onMenuClick }) => {
return value
.split(/[, ]+/)
.filter(Boolean)
- .map(it => t(prefixString(prefix, it)))
+ .map((it) => t(prefixString(prefix, it)))
.join(', ');
}
return '';
@@ -40,52 +42,50 @@ const NotificationsView = ({ updateTimestamp, onMenuClick }) => {
return (
<TableContainer>
- <Table>
- <TableHead>
- <TableRow>
- <TableCell className={classes.columnAction} />
- <TableCell>{t('notificationType')}</TableCell>
- <TableCell>{t('notificationAlways')}</TableCell>
- <TableCell>{t('sharedAlarms')}</TableCell>
- <TableCell>{t('notificationNotificators')}</TableCell>
- </TableRow>
- </TableHead>
- <TableBody>
- {items.map(item => (
- <TableRow key={item.id}>
- <TableCell className={classes.columnAction} padding="none">
+ <Table>
+ <TableHead>
+ <TableRow>
+ <TableCell className={classes.columnAction} />
+ <TableCell>{t('notificationType')}</TableCell>
+ <TableCell>{t('notificationAlways')}</TableCell>
+ <TableCell>{t('sharedAlarms')}</TableCell>
+ <TableCell>{t('notificationNotificators')}</TableCell>
+ </TableRow>
+ </TableHead>
+ <TableBody>
+ {items.map((item) => (
+ <TableRow key={item.id}>
+ <TableCell className={classes.columnAction} padding="none">
<IconButton
- onClick={event => onMenuClick(event.currentTarget, item.id)}
+ onClick={(event) => onMenuClick(event.currentTarget, item.id)}
>
- <MoreVertIcon />
- </IconButton>
- </TableCell>
- <TableCell>{t(prefixString('event', item.type))}</TableCell>
- <TableCell>{formatBoolean(item.always)}</TableCell>
+ <MoreVertIcon />
+ </IconButton>
+ </TableCell>
+ <TableCell>{t(prefixString('event', item.type))}</TableCell>
+ <TableCell>{formatBoolean(item.always)}</TableCell>
<TableCell>
{formatList('alarm', item.attributes.alarms)}
</TableCell>
<TableCell>
{formatList('notificator', item.notificators)}
</TableCell>
- </TableRow>
- ))}
- </TableBody>
- </Table>
+ </TableRow>
+ ))}
+ </TableBody>
+ </Table>
</TableContainer>
);
};
-const NotificationsPage = () => {
- return (
- <OptionsLayout>
- <EditCollectionView
- content={NotificationsView}
- editPath="/settings/notification"
- endpoint="notifications"
- />
- </OptionsLayout>
- );
-};
+const NotificationsPage = () => (
+ <OptionsLayout>
+ <EditCollectionView
+ content={NotificationsView}
+ editPath="/settings/notification"
+ endpoint="notifications"
+ />
+ </OptionsLayout>
+);
export default NotificationsPage;
diff --git a/modern/src/settings/OptionsLayout/useRoutes.js b/modern/src/settings/OptionsLayout/useRoutes.js
index 901719f8..f2603dd8 100644
--- a/modern/src/settings/OptionsLayout/useRoutes.js
+++ b/modern/src/settings/OptionsLayout/useRoutes.js
@@ -13,7 +13,7 @@ import t from '../../common/localization';
const accountRoute = {
name: t('settingsUser'),
- icon: <PersonIcon />
+ icon: <PersonIcon />,
};
const adminRoutes = [
@@ -21,18 +21,18 @@ const adminRoutes = [
{
name: t('settingsServer'),
href: '/admin/server',
- icon: <StorageIcon />
+ icon: <StorageIcon />,
},
{
name: t('settingsUsers'),
href: '/admin/users',
- icon: <PeopleIcon />
+ icon: <PeopleIcon />,
},
{
name: t('statisticsTitle'),
href: '/admin/statistics',
- icon: <BarChartIcon />
- }
+ icon: <BarChartIcon />,
+ },
];
const mainRoutes = [
@@ -41,38 +41,38 @@ const mainRoutes = [
match: 'geofence',
name: t('sharedGeofences'),
href: '/geofences',
- icon: <CreateIcon />
+ icon: <CreateIcon />,
},
{
match: 'notification',
name: t('sharedNotifications'),
href: '/settings/notifications',
- icon: <NotificationsIcon />
+ icon: <NotificationsIcon />,
},
{
match: 'group',
name: t('settingsGroups'),
href: '/settings/groups',
- icon: <FolderIcon />
+ icon: <FolderIcon />,
},
{
match: 'driver',
name: t('sharedDrivers'),
href: '/settings/drivers',
- icon: <PersonIcon />
+ icon: <PersonIcon />,
},
{
match: 'attribute',
name: t('sharedComputedAttributes'),
href: '/settings/attributes',
- icon: <StorageIcon />
+ icon: <StorageIcon />,
},
{
match: 'maintenance',
name: t('sharedMaintenance'),
href: '/settings/maintenances',
- icon: <BuildIcon />
- }
+ icon: <BuildIcon />,
+ },
];
export default () => {
@@ -81,6 +81,6 @@ export default () => {
accountRoute.href = `/user/${userId}`;
return useMemo(() => [...mainRoutes, ...(isAdmin ? adminRoutes : [])], [
- isAdmin
+ isAdmin,
]);
};