aboutsummaryrefslogtreecommitdiff
path: root/modern/src
diff options
context:
space:
mode:
authorAnton Tananaev <anton.tananaev@gmail.com>2021-09-02 23:20:12 -0700
committerAnton Tananaev <anton.tananaev@gmail.com>2021-09-02 23:20:12 -0700
commite6f906dbb565abdb29297ec67db3c922135c628c (patch)
treea6d1c89436d066ec9171b6a68e8d5e7eeb56d2de /modern/src
parente5f07d30df69c1fff28cf1ff8502e4843a8b543c (diff)
downloadtrackermap-web-e6f906dbb565abdb29297ec67db3c922135c628c.tar.gz
trackermap-web-e6f906dbb565abdb29297ec67db3c922135c628c.tar.bz2
trackermap-web-e6f906dbb565abdb29297ec67db3c922135c628c.zip
Migrate components
Diffstat (limited to 'modern/src')
-rw-r--r--modern/src/DevicePage.js3
-rw-r--r--modern/src/EditCollectionView.js3
-rw-r--r--modern/src/EditItemView.js4
-rw-r--r--modern/src/GeofencePage.js3
-rw-r--r--modern/src/GeofencesPage.js4
-rw-r--r--modern/src/LocalizationProvider.js6
-rw-r--r--modern/src/MainPage.js3
-rw-r--r--modern/src/MainToolbar.js9
-rw-r--r--modern/src/PositionPage.js2
-rw-r--r--modern/src/RegisterDialog.js4
-rw-r--r--modern/src/RemoveDialog.js4
-rw-r--r--modern/src/UserPage.js3
-rw-r--r--modern/src/admin/ServerPage.js5
-rw-r--r--modern/src/admin/StatisticsPage.js6
-rw-r--r--modern/src/admin/UsersPage.js3
-rw-r--r--modern/src/attributes/AddAttributeDialog.js4
-rw-r--r--modern/src/attributes/EditAttributesView.js3
-rw-r--r--modern/src/components/registration/RegisterForm.js3
-rw-r--r--modern/src/map/StatusView.js3
-rw-r--r--modern/src/reports/ChartReportPage.js32
-rw-r--r--modern/src/reports/EventReportPage.js7
-rw-r--r--modern/src/reports/ReportFilter.js4
-rw-r--r--modern/src/reports/ReportLayout.js4
-rw-r--r--modern/src/reports/RouteReportPage.js4
-rw-r--r--modern/src/reports/StopReportPage.js3
-rw-r--r--modern/src/reports/SummaryReportPage.js5
-rw-r--r--modern/src/reports/TripReportPage.js3
-rw-r--r--modern/src/settings/ComputedAttributePage.js4
-rw-r--r--modern/src/settings/ComputedAttributesPage.js4
-rw-r--r--modern/src/settings/DriverPage.js3
-rw-r--r--modern/src/settings/GroupPage.js3
-rw-r--r--modern/src/settings/GroupsPage.js3
-rw-r--r--modern/src/settings/MaintenancePage.js4
-rw-r--r--modern/src/settings/MaintenancesPage.js3
-rw-r--r--modern/src/settings/NotificationsPage.js3
35 files changed, 110 insertions, 54 deletions
diff --git a/modern/src/DevicePage.js b/modern/src/DevicePage.js
index 83b19707..5867c979 100644
--- a/modern/src/DevicePage.js
+++ b/modern/src/DevicePage.js
@@ -5,7 +5,6 @@ import {
Accordion, AccordionSummary, AccordionDetails, makeStyles, Typography, FormControlLabel, Checkbox,
} from '@material-ui/core';
import ExpandMoreIcon from '@material-ui/icons/ExpandMore';
-import t from './LocalizationProvider';
import EditItemView from './EditItemView';
import EditAttributesView from './attributes/EditAttributesView';
import deviceAttributes from './attributes/deviceAttributes';
@@ -13,6 +12,7 @@ import SelectField from './form/SelectField';
import deviceCategories from './common/deviceCategories';
import LinkField from './form/LinkField';
import { prefixString } from './common/stringUtils';
+import { useTranslation } from './LocalizationProvider';
const useStyles = makeStyles(() => ({
details: {
@@ -22,6 +22,7 @@ const useStyles = makeStyles(() => ({
const DevicePage = () => {
const classes = useStyles();
+ const t = useTranslation();
const [item, setItem] = useState();
diff --git a/modern/src/EditCollectionView.js b/modern/src/EditCollectionView.js
index 944ef61b..0bfec615 100644
--- a/modern/src/EditCollectionView.js
+++ b/modern/src/EditCollectionView.js
@@ -7,8 +7,8 @@ import Fab from '@material-ui/core/Fab';
import AddIcon from '@material-ui/icons/Add';
import { useSelector } from 'react-redux';
-import t from './LocalizationProvider';
import RemoveDialog from './RemoveDialog';
+import { useTranslation } from './LocalizationProvider';
const useStyles = makeStyles((theme) => ({
fab: {
@@ -23,6 +23,7 @@ const EditCollectionView = ({
}) => {
const classes = useStyles();
const history = useHistory();
+ const t = useTranslation();
const [selectedId, setSelectedId] = useState(null);
const [selectedAnchorEl, setSelectedAnchorEl] = useState(null);
diff --git a/modern/src/EditItemView.js b/modern/src/EditItemView.js
index add61004..e1aea2a9 100644
--- a/modern/src/EditItemView.js
+++ b/modern/src/EditItemView.js
@@ -5,9 +5,9 @@ import Container from '@material-ui/core/Container';
import Button from '@material-ui/core/Button';
import FormControl from '@material-ui/core/FormControl';
-import t from './LocalizationProvider';
import { useEffectAsync } from './reactHelper';
import OptionsLayout from './settings/OptionsLayout';
+import { useTranslation } from './LocalizationProvider';
const useStyles = makeStyles((theme) => ({
container: {
@@ -27,6 +27,8 @@ const EditItemView = ({
}) => {
const history = useHistory();
const classes = useStyles();
+ const t = useTranslation();
+
const { id } = useParams();
useEffectAsync(async () => {
diff --git a/modern/src/GeofencePage.js b/modern/src/GeofencePage.js
index 2b503a71..485795de 100644
--- a/modern/src/GeofencePage.js
+++ b/modern/src/GeofencePage.js
@@ -5,10 +5,10 @@ import {
Accordion, AccordionSummary, AccordionDetails, makeStyles, Typography,
} from '@material-ui/core';
import ExpandMoreIcon from '@material-ui/icons/ExpandMore';
-import t from './LocalizationProvider';
import EditItemView from './EditItemView';
import EditAttributesView from './attributes/EditAttributesView';
import geofenceAttributes from './attributes/geofenceAttributes';
+import { useTranslation } from './LocalizationProvider';
const useStyles = makeStyles(() => ({
details: {
@@ -18,6 +18,7 @@ const useStyles = makeStyles(() => ({
const GeofencePage = () => {
const classes = useStyles();
+ const t = useTranslation();
const [item, setItem] = useState();
diff --git a/modern/src/GeofencesPage.js b/modern/src/GeofencesPage.js
index d343a381..42dfb6b1 100644
--- a/modern/src/GeofencesPage.js
+++ b/modern/src/GeofencesPage.js
@@ -10,8 +10,7 @@ import Map from './map/Map';
import CurrentLocationMap from './map/CurrentLocationMap';
import GeofenceEditMap from './map/GeofenceEditMap';
import GeofencesList from './GeofencesList';
-
-import t from './LocalizationProvider';
+import { useTranslation } from './LocalizationProvider';
const useStyles = makeStyles((theme) => ({
root: {
@@ -51,6 +50,7 @@ const useStyles = makeStyles((theme) => ({
const GeofencesPage = ({ width }) => {
const classes = useStyles();
const history = useHistory();
+ const t = useTranslation();
return (
<div className={classes.root}>
diff --git a/modern/src/LocalizationProvider.js b/modern/src/LocalizationProvider.js
index 84419683..bf454e71 100644
--- a/modern/src/LocalizationProvider.js
+++ b/modern/src/LocalizationProvider.js
@@ -158,10 +158,12 @@ export const useLocalization = () => {
export const useTranslation = () => {
const context = useContext(LocalizationContext);
- return (key) => context.languages[context.language].data[key];
+ const data = context.languages[context.language];
+ return (key) => data[key];
};
export const useTranslationKeys = (predicate) => {
const context = useContext(LocalizationContext);
- return Object.keys(context.languages[context.language].data).filter(predicate);
+ const data = context.languages[context.language];
+ return Object.keys(data).filter(predicate);
};
diff --git a/modern/src/MainPage.js b/modern/src/MainPage.js
index 5a8d4ce8..ea32fb33 100644
--- a/modern/src/MainPage.js
+++ b/modern/src/MainPage.js
@@ -19,7 +19,7 @@ import GeofenceMap from './map/GeofenceMap';
import CurrentPositionsMap from './map/CurrentPositionsMap';
import CurrentLocationMap from './map/CurrentLocationMap';
import BottomNav from './components/BottomNav';
-import t from './LocalizationProvider';
+import { useTranslation } from './LocalizationProvider';
const useStyles = makeStyles((theme) => ({
root: {
@@ -91,6 +91,7 @@ const MainPage = () => {
const classes = useStyles();
const history = useHistory();
const theme = useTheme();
+ const t = useTranslation();
const isTablet = useMediaQuery(theme.breakpoints.down('md'));
const isPhone = useMediaQuery(theme.breakpoints.down('xs'));
diff --git a/modern/src/MainToolbar.js b/modern/src/MainToolbar.js
index 65b02f51..1e4dabe4 100644
--- a/modern/src/MainToolbar.js
+++ b/modern/src/MainToolbar.js
@@ -18,8 +18,8 @@ import PersonIcon from '@material-ui/icons/Person';
import DescriptionIcon from '@material-ui/icons/Description';
import ReplayIcon from '@material-ui/icons/Replay';
import { sessionActions } from './store';
-import t from './LocalizationProvider';
import * as selectors from './common/selectors';
+import { useTranslation } from './LocalizationProvider';
const useStyles = makeStyles((theme) => ({
flex: {
@@ -38,12 +38,15 @@ const useStyles = makeStyles((theme) => ({
}));
const MainToolbar = () => {
- const dispatch = useDispatch();
- const [drawer, setDrawer] = useState(false);
const classes = useStyles();
const history = useHistory();
+ const dispatch = useDispatch();
+ const t = useTranslation();
+
const userId = useSelector(selectors.getUserId);
+ const [drawer, setDrawer] = useState(false);
+
const openDrawer = () => { setDrawer(true); };
const closeDrawer = () => { setDrawer(false); };
diff --git a/modern/src/PositionPage.js b/modern/src/PositionPage.js
index 51c3c856..37bc922c 100644
--- a/modern/src/PositionPage.js
+++ b/modern/src/PositionPage.js
@@ -4,7 +4,6 @@ import {
makeStyles, Typography, ListItem, ListItemText, ListItemSecondaryAction, List, Container, Paper, Divider,
} from '@material-ui/core';
import { useParams } from 'react-router-dom';
-import t from './LocalizationProvider';
import { useEffectAsync } from './reactHelper';
import MainToolbar from './MainToolbar';
import { formatPosition } from './common/formatter';
@@ -19,6 +18,7 @@ const useStyles = makeStyles((theme) => ({
const PositionPage = () => {
const classes = useStyles();
+ const t = useTranslation();
const { id } = useParams();
diff --git a/modern/src/RegisterDialog.js b/modern/src/RegisterDialog.js
index e1483bc2..66b1c658 100644
--- a/modern/src/RegisterDialog.js
+++ b/modern/src/RegisterDialog.js
@@ -6,9 +6,11 @@ import DialogContent from '@material-ui/core/DialogContent';
import DialogContentText from '@material-ui/core/DialogContentText';
import TextField from '@material-ui/core/TextField';
import Snackbar from '@material-ui/core/Snackbar';
-import t from './LocalizationProvider';
+import { useTranslation } from './LocalizationProvider';
const RegisterDialog = ({ showDialog, onResult }) => {
+ const t = useTranslation();
+
const [name, setName] = useState('');
const [email, setEmail] = useState('');
const [password, setPassword] = useState('');
diff --git a/modern/src/RemoveDialog.js b/modern/src/RemoveDialog.js
index 4ba5c1e9..6d191d6a 100644
--- a/modern/src/RemoveDialog.js
+++ b/modern/src/RemoveDialog.js
@@ -4,11 +4,13 @@ import Dialog from '@material-ui/core/Dialog';
import DialogActions from '@material-ui/core/DialogActions';
import DialogContent from '@material-ui/core/DialogContent';
import DialogContentText from '@material-ui/core/DialogContentText';
-import t from './LocalizationProvider';
+import { useTranslation } from './LocalizationProvider';
const RemoveDialog = ({
open, endpoint, itemId, onResult,
}) => {
+ const t = useTranslation();
+
const handleRemove = async () => {
const response = await fetch(`/api/${endpoint}/${itemId}`, { method: 'DELETE' });
if (response.ok) {
diff --git a/modern/src/UserPage.js b/modern/src/UserPage.js
index d09cd631..0e6af09f 100644
--- a/modern/src/UserPage.js
+++ b/modern/src/UserPage.js
@@ -5,11 +5,11 @@ import {
Accordion, AccordionSummary, AccordionDetails, makeStyles, Typography,
} from '@material-ui/core';
import ExpandMoreIcon from '@material-ui/icons/ExpandMore';
-import t from './LocalizationProvider';
import userAttributes from './attributes/userAttributes';
import EditItemView from './EditItemView';
import EditAttributesView from './attributes/EditAttributesView';
import LinkField from './form/LinkField';
+import { useTranslation } from './LocalizationProvider';
const useStyles = makeStyles(() => ({
details: {
@@ -19,6 +19,7 @@ const useStyles = makeStyles(() => ({
const UserPage = () => {
const classes = useStyles();
+ const t = useTranslation();
const [item, setItem] = useState();
diff --git a/modern/src/admin/ServerPage.js b/modern/src/admin/ServerPage.js
index 05190643..62c93f67 100644
--- a/modern/src/admin/ServerPage.js
+++ b/modern/src/admin/ServerPage.js
@@ -7,12 +7,12 @@ import {
import ExpandMoreIcon from '@material-ui/icons/ExpandMore';
import { useHistory } from 'react-router-dom';
import { useDispatch, useSelector } from 'react-redux';
-import t from '../LocalizationProvider';
import { sessionActions } from '../store';
import EditAttributesView from '../attributes/EditAttributesView';
import deviceAttributes from '../attributes/deviceAttributes';
import userAttributes from '../attributes/userAttributes';
import OptionsLayout from '../settings/OptionsLayout';
+import { useTranslation } from '../LocalizationProvider';
const useStyles = makeStyles((theme) => ({
container: {
@@ -31,9 +31,10 @@ const useStyles = makeStyles((theme) => ({
}));
const ServerPage = () => {
+ const classes = useStyles();
const history = useHistory();
const dispatch = useDispatch();
- const classes = useStyles();
+ const t = useTranslation();
const item = useSelector((state) => state.session.server);
const setItem = (updatedItem) => dispatch(sessionActions.updateServer(updatedItem));
diff --git a/modern/src/admin/StatisticsPage.js b/modern/src/admin/StatisticsPage.js
index 96ee4d18..9d075fef 100644
--- a/modern/src/admin/StatisticsPage.js
+++ b/modern/src/admin/StatisticsPage.js
@@ -3,11 +3,13 @@ import {
FormControl, InputLabel, Select, MenuItem, TextField, Button, TableContainer, Table, TableRow, TableCell, TableHead, TableBody, Paper,
} from '@material-ui/core';
import moment from 'moment';
-import t from '../LocalizationProvider';
import { formatDate } from '../common/formatter';
import OptionsLayout from '../settings/OptionsLayout';
+import { useTranslation } from '../LocalizationProvider';
const Filter = ({ setItems }) => {
+ const t = useTranslation();
+
const [period, setPeriod] = useState('today');
const [from, setFrom] = useState(moment().subtract(1, 'hour'));
const [to, setTo] = useState(moment());
@@ -95,6 +97,8 @@ const Filter = ({ setItems }) => {
};
const StatisticsPage = () => {
+ const t = useTranslation();
+
const [items, setItems] = useState([]);
return (
diff --git a/modern/src/admin/UsersPage.js b/modern/src/admin/UsersPage.js
index 2bfbb755..92db32e0 100644
--- a/modern/src/admin/UsersPage.js
+++ b/modern/src/admin/UsersPage.js
@@ -3,11 +3,11 @@ import {
TableContainer, Table, TableRow, TableCell, TableHead, TableBody, makeStyles, IconButton,
} from '@material-ui/core';
import MoreVertIcon from '@material-ui/icons/MoreVert';
-import t from '../LocalizationProvider';
import { useEffectAsync } from '../reactHelper';
import EditCollectionView from '../EditCollectionView';
import { formatBoolean } from '../common/formatter';
import OptionsLayout from '../settings/OptionsLayout';
+import { useTranslation } from '../LocalizationProvider';
const useStyles = makeStyles((theme) => ({
columnAction: {
@@ -18,6 +18,7 @@ const useStyles = makeStyles((theme) => ({
const UsersView = ({ updateTimestamp, onMenuClick }) => {
const classes = useStyles();
+ const t = useTranslation();
const [items, setItems] = useState([]);
diff --git a/modern/src/attributes/AddAttributeDialog.js b/modern/src/attributes/AddAttributeDialog.js
index 3d392fd5..4669ba02 100644
--- a/modern/src/attributes/AddAttributeDialog.js
+++ b/modern/src/attributes/AddAttributeDialog.js
@@ -4,9 +4,11 @@ import {
} from '@material-ui/core';
import { Autocomplete, createFilterOptions } from '@material-ui/lab';
-import t from '../LocalizationProvider';
+import { useTranslation } from '../LocalizationProvider';
const AddAttributeDialog = ({ open, onResult, definitions }) => {
+ const t = useTranslation();
+
const filter = createFilterOptions({
stringify: (option) => option.name,
});
diff --git a/modern/src/attributes/EditAttributesView.js b/modern/src/attributes/EditAttributesView.js
index 68395d9c..e8ab83e1 100644
--- a/modern/src/attributes/EditAttributesView.js
+++ b/modern/src/attributes/EditAttributesView.js
@@ -5,8 +5,8 @@ import {
} from '@material-ui/core';
import CloseIcon from '@material-ui/icons/Close';
import AddIcon from '@material-ui/icons/Add';
-import t from '../LocalizationProvider';
import AddAttributeDialog from './AddAttributeDialog';
+import { useTranslation } from '../LocalizationProvider';
const useStyles = makeStyles((theme) => ({
addButton: {
@@ -20,6 +20,7 @@ const useStyles = makeStyles((theme) => ({
const EditAttributesView = ({ attributes, setAttributes, definitions }) => {
const classes = useStyles();
+ const t = useTranslation();
const [addDialogShown, setAddDialogShown] = useState(false);
diff --git a/modern/src/components/registration/RegisterForm.js b/modern/src/components/registration/RegisterForm.js
index 2d7fa6f9..2da33a28 100644
--- a/modern/src/components/registration/RegisterForm.js
+++ b/modern/src/components/registration/RegisterForm.js
@@ -5,7 +5,7 @@ import {
import { useHistory } from 'react-router-dom';
import ArrowBackIcon from '@material-ui/icons/ArrowBack';
import StartPage from '../../StartPage';
-import t from '../../LocalizationProvider';
+import { useTranslation } from '../../LocalizationProvider';
const useStyles = makeStyles((theme) => ({
register: {
@@ -25,6 +25,7 @@ const useStyles = makeStyles((theme) => ({
const RegisterForm = () => {
const classes = useStyles();
const history = useHistory();
+ const t = useTranslation();
const [name, setName] = useState('');
const [email, setEmail] = useState('');
diff --git a/modern/src/map/StatusView.js b/modern/src/map/StatusView.js
index f4062f5a..85009db7 100644
--- a/modern/src/map/StatusView.js
+++ b/modern/src/map/StatusView.js
@@ -18,8 +18,8 @@ import {
} from '../common/formatter';
import { useAttributePreference } from '../common/preferences';
import RemoveDialog from '../RemoveDialog';
-import t from '../LocalizationProvider';
import { getPosition } from '../common/selectors';
+import { useTranslation } from '../LocalizationProvider';
const useStyles = makeStyles((theme) => ({
paper: {
@@ -35,6 +35,7 @@ const StatusView = ({
deviceId, onShowDetails, onShowHistory, onEditClick,
}) => {
const classes = useStyles();
+ const t = useTranslation();
const [removeDialogShown, setRemoveDialogShown] = useState(false);
const device = useSelector((state) => state.devices.items[deviceId]);
diff --git a/modern/src/reports/ChartReportPage.js b/modern/src/reports/ChartReportPage.js
index ba476ef8..6679fe4f 100644
--- a/modern/src/reports/ChartReportPage.js
+++ b/modern/src/reports/ChartReportPage.js
@@ -8,7 +8,7 @@ import Graph from './Graph';
import { useAttributePreference } from '../common/preferences';
import { formatDate } from '../common/formatter';
import { speedFromKnots } from '../common/converter';
-import t from '../LocalizationProvider';
+import { useTranslation } from '../LocalizationProvider';
const Filter = ({ children, setItems }) => {
const speedUnit = useAttributePreference('speedUnit');
@@ -37,20 +37,24 @@ const Filter = ({ children, setItems }) => {
);
};
-const ChartType = ({ type, setType }) => (
- <Grid container spacing={3}>
- <Grid item xs={12} sm={6}>
- <FormControl variant="filled" margin="normal" fullWidth>
- <InputLabel>{t('reportChartType')}</InputLabel>
- <Select value={type} onChange={(e) => setType(e.target.value)}>
- <MenuItem value="speed">{t('positionSpeed')}</MenuItem>
- <MenuItem value="accuracy">{t('positionAccuracy')}</MenuItem>
- <MenuItem value="altitude">{t('positionAltitude')}</MenuItem>
- </Select>
- </FormControl>
+const ChartType = ({ type, setType }) => {
+ const t = useTranslation();
+
+ return (
+ <Grid container spacing={3}>
+ <Grid item xs={12} sm={6}>
+ <FormControl variant="filled" margin="normal" fullWidth>
+ <InputLabel>{t('reportChartType')}</InputLabel>
+ <Select value={type} onChange={(e) => setType(e.target.value)}>
+ <MenuItem value="speed">{t('positionSpeed')}</MenuItem>
+ <MenuItem value="accuracy">{t('positionAccuracy')}</MenuItem>
+ <MenuItem value="altitude">{t('positionAltitude')}</MenuItem>
+ </Select>
+ </FormControl>
+ </Grid>
</Grid>
- </Grid>
-);
+ );
+};
const ChartReportPage = () => {
const [items, setItems] = useState([]);
diff --git a/modern/src/reports/EventReportPage.js b/modern/src/reports/EventReportPage.js
index 1c40c3c7..b76ee955 100644
--- a/modern/src/reports/EventReportPage.js
+++ b/modern/src/reports/EventReportPage.js
@@ -9,9 +9,11 @@ import { formatDate } from '../common/formatter';
import ReportFilter from './ReportFilter';
import ReportLayout from './ReportLayout';
import { prefixString } from '../common/stringUtils';
-import t from '../LocalizationProvider';
+import { useTranslation } from '../LocalizationProvider';
const Filter = ({ setItems }) => {
+ const t = useTranslation();
+
const [eventTypes, setEventTypes] = useState(['allEvents']);
const handleSubmit = async (deviceId, from, to, mail, headers) => {
@@ -65,7 +67,10 @@ const Filter = ({ setItems }) => {
const EventReportPage = () => {
const theme = useTheme();
+ const t = useTranslation();
+
const geofences = useSelector((state) => state.geofences.items);
+
const [items, setItems] = useState([]);
const formatGeofence = (value) => {
diff --git a/modern/src/reports/ReportFilter.js b/modern/src/reports/ReportFilter.js
index 56f3e5d7..23c7fc00 100644
--- a/modern/src/reports/ReportFilter.js
+++ b/modern/src/reports/ReportFilter.js
@@ -4,9 +4,11 @@ import {
} from '@material-ui/core';
import { useSelector } from 'react-redux';
import moment from 'moment';
-import t from '../LocalizationProvider';
+import { useTranslation } from '../LocalizationProvider';
const ReportFilter = ({ children, handleSubmit, showOnly }) => {
+ const t = useTranslation();
+
const devices = useSelector((state) => Object.values(state.devices.items));
const [deviceId, setDeviceId] = useState();
const [period, setPeriod] = useState('today');
diff --git a/modern/src/reports/ReportLayout.js b/modern/src/reports/ReportLayout.js
index 67d2ab70..9bf1dd5e 100644
--- a/modern/src/reports/ReportLayout.js
+++ b/modern/src/reports/ReportLayout.js
@@ -13,7 +13,7 @@ import ArrowBackIcon from '@material-ui/icons/ArrowBack';
import SideNav from '../components/SideNav';
import NavBar from '../components/NavBar';
-import t from '../LocalizationProvider';
+import { useTranslation } from '../LocalizationProvider';
const useStyles = makeStyles((theme) => ({
root: {
@@ -64,6 +64,8 @@ const ReportLayout = ({ children, filter }) => {
const classes = useStyles();
const history = useHistory();
const location = useLocation();
+ const t = useTranslation();
+
const [openDrawer, setOpenDrawer] = useState(false);
const [reportTitle, setReportTitle] = useState();
diff --git a/modern/src/reports/RouteReportPage.js b/modern/src/reports/RouteReportPage.js
index 185486bc..fe433422 100644
--- a/modern/src/reports/RouteReportPage.js
+++ b/modern/src/reports/RouteReportPage.js
@@ -8,7 +8,7 @@ import {
import ReportFilter from './ReportFilter';
import ReportLayout from './ReportLayout';
import { useAttributePreference, usePreference } from '../common/preferences';
-import t from '../LocalizationProvider';
+import { useTranslation } from '../LocalizationProvider';
const Filter = ({ setItems }) => {
const handleSubmit = async (deviceId, from, to, mail, headers) => {
@@ -32,6 +32,8 @@ const Filter = ({ setItems }) => {
};
const RouteReportPage = () => {
+ const t = useTranslation();
+
const distanceUnit = useAttributePreference('distanceUnit');
const speedUnit = useAttributePreference('speedUnit');
const coordinateFormat = usePreference('coordinateFormat');
diff --git a/modern/src/reports/StopReportPage.js b/modern/src/reports/StopReportPage.js
index c00c2383..318507ed 100644
--- a/modern/src/reports/StopReportPage.js
+++ b/modern/src/reports/StopReportPage.js
@@ -7,7 +7,7 @@ import {
import ReportFilter from './ReportFilter';
import ReportLayout from './ReportLayout';
import { useAttributePreference } from '../common/preferences';
-import t from '../LocalizationProvider';
+import { useTranslation } from '../LocalizationProvider';
const Filter = ({ setItems }) => {
const handleSubmit = async (deviceId, from, to, mail, headers) => {
@@ -32,6 +32,7 @@ const Filter = ({ setItems }) => {
const StopReportPage = () => {
const theme = useTheme();
+ const t = useTranslation();
const distanceUnit = useAttributePreference('distanceUnit');
const volumeUnit = useAttributePreference('volumeUnit');
diff --git a/modern/src/reports/SummaryReportPage.js b/modern/src/reports/SummaryReportPage.js
index d606dda2..84546f6b 100644
--- a/modern/src/reports/SummaryReportPage.js
+++ b/modern/src/reports/SummaryReportPage.js
@@ -8,9 +8,11 @@ import {
import ReportFilter from './ReportFilter';
import ReportLayout from './ReportLayout';
import { useAttributePreference } from '../common/preferences';
-import t from '../LocalizationProvider';
+import { useTranslation } from '../LocalizationProvider';
const Filter = ({ setItems }) => {
+ const t = useTranslation();
+
const [daily, setDaily] = useState(false);
const handleSubmit = async (deviceId, from, to, mail, headers) => {
@@ -44,6 +46,7 @@ const Filter = ({ setItems }) => {
const SummaryReportPage = () => {
const theme = useTheme();
+ const t = useTranslation();
const distanceUnit = useAttributePreference('distanceUnit');
const speedUnit = useAttributePreference('speedUnit');
diff --git a/modern/src/reports/TripReportPage.js b/modern/src/reports/TripReportPage.js
index 4fa6a340..22a236a2 100644
--- a/modern/src/reports/TripReportPage.js
+++ b/modern/src/reports/TripReportPage.js
@@ -7,7 +7,7 @@ import {
import ReportFilter from './ReportFilter';
import ReportLayout from './ReportLayout';
import { useAttributePreference } from '../common/preferences';
-import t from '../LocalizationProvider';
+import { useTranslation } from '../LocalizationProvider';
const Filter = ({ setItems }) => {
const handleSubmit = async (deviceId, from, to, mail, headers) => {
@@ -32,6 +32,7 @@ const Filter = ({ setItems }) => {
const TripReportPage = () => {
const theme = useTheme();
+ const t = useTranslation();
const distanceUnit = useAttributePreference('distanceUnit');
const speedUnit = useAttributePreference('speedUnit');
diff --git a/modern/src/settings/ComputedAttributePage.js b/modern/src/settings/ComputedAttributePage.js
index a3b45b4a..7aff0da0 100644
--- a/modern/src/settings/ComputedAttributePage.js
+++ b/modern/src/settings/ComputedAttributePage.js
@@ -3,9 +3,9 @@ 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 '../LocalizationProvider';
import EditItemView from '../EditItemView';
import positionAttributes from '../attributes/positionAttributes';
+import { useTranslation } from '../LocalizationProvider';
const useStyles = makeStyles(() => ({
details: {
@@ -15,6 +15,8 @@ const useStyles = makeStyles(() => ({
const ComputedAttributePage = () => {
const classes = useStyles();
+ const t = useTranslation();
+
const [item, setItem] = useState();
const [key, setKey] = useState();
diff --git a/modern/src/settings/ComputedAttributesPage.js b/modern/src/settings/ComputedAttributesPage.js
index 9858ea39..b989b43e 100644
--- a/modern/src/settings/ComputedAttributesPage.js
+++ b/modern/src/settings/ComputedAttributesPage.js
@@ -4,10 +4,10 @@ import {
} from '@material-ui/core';
import MoreVertIcon from '@material-ui/icons/MoreVert';
import { useSelector } from 'react-redux';
-import t from '../LocalizationProvider';
import { useEffectAsync } from '../reactHelper';
import EditCollectionView from '../EditCollectionView';
import OptionsLayout from './OptionsLayout';
+import { useTranslation } from '../LocalizationProvider';
const useStyles = makeStyles((theme) => ({
columnAction: {
@@ -18,6 +18,7 @@ const useStyles = makeStyles((theme) => ({
const ComputedAttributeView = ({ updateTimestamp, onMenuClick }) => {
const classes = useStyles();
+ const t = useTranslation();
const [items, setItems] = useState([]);
const adminEnabled = useSelector((state) => state.session.user && state.session.user.administrator);
@@ -66,7 +67,6 @@ const ComputedAttributeView = ({ updateTimestamp, onMenuClick }) => {
const ComputedAttributesPage = () => (
<OptionsLayout>
-
<EditCollectionView content={ComputedAttributeView} editPath="/settings/attribute" endpoint="attributes/computed" />
</OptionsLayout>
);
diff --git a/modern/src/settings/DriverPage.js b/modern/src/settings/DriverPage.js
index 7bb4497b..a185405e 100644
--- a/modern/src/settings/DriverPage.js
+++ b/modern/src/settings/DriverPage.js
@@ -4,9 +4,9 @@ import {
Accordion, AccordionSummary, AccordionDetails, makeStyles, Typography,
} from '@material-ui/core';
import ExpandMoreIcon from '@material-ui/icons/ExpandMore';
-import t from '../LocalizationProvider';
import EditItemView from '../EditItemView';
import EditAttributesView from '../attributes/EditAttributesView';
+import { useTranslation } from '../LocalizationProvider';
const useStyles = makeStyles(() => ({
details: {
@@ -16,6 +16,7 @@ const useStyles = makeStyles(() => ({
const DriverPage = () => {
const classes = useStyles();
+ const t = useTranslation();
const [item, setItem] = useState();
diff --git a/modern/src/settings/GroupPage.js b/modern/src/settings/GroupPage.js
index ad578e25..faf8acbe 100644
--- a/modern/src/settings/GroupPage.js
+++ b/modern/src/settings/GroupPage.js
@@ -5,11 +5,11 @@ import {
Accordion, AccordionSummary, AccordionDetails, makeStyles, Typography,
} from '@material-ui/core';
import ExpandMoreIcon from '@material-ui/icons/ExpandMore';
-import t from '../LocalizationProvider';
import EditItemView from '../EditItemView';
import EditAttributesView from '../attributes/EditAttributesView';
import deviceAttributes from '../attributes/deviceAttributes';
import SelectField from '../form/SelectField';
+import { useTranslation } from '../LocalizationProvider';
const useStyles = makeStyles(() => ({
details: {
@@ -19,6 +19,7 @@ const useStyles = makeStyles(() => ({
const GroupPage = () => {
const classes = useStyles();
+ const t = useTranslation();
const [item, setItem] = useState();
diff --git a/modern/src/settings/GroupsPage.js b/modern/src/settings/GroupsPage.js
index 89715928..0b28e7bf 100644
--- a/modern/src/settings/GroupsPage.js
+++ b/modern/src/settings/GroupsPage.js
@@ -3,10 +3,10 @@ import {
TableContainer, Table, TableRow, TableCell, TableHead, TableBody, makeStyles, IconButton,
} from '@material-ui/core';
import MoreVertIcon from '@material-ui/icons/MoreVert';
-import t from '../LocalizationProvider';
import { useEffectAsync } from '../reactHelper';
import EditCollectionView from '../EditCollectionView';
import OptionsLayout from './OptionsLayout';
+import { useTranslation } from '../LocalizationProvider';
const useStyles = makeStyles((theme) => ({
columnAction: {
@@ -17,6 +17,7 @@ const useStyles = makeStyles((theme) => ({
const GroupsView = ({ updateTimestamp, onMenuClick }) => {
const classes = useStyles();
+ const t = useTranslation();
const [items, setItems] = useState([]);
diff --git a/modern/src/settings/MaintenancePage.js b/modern/src/settings/MaintenancePage.js
index 287d040d..a9fed7d6 100644
--- a/modern/src/settings/MaintenancePage.js
+++ b/modern/src/settings/MaintenancePage.js
@@ -4,7 +4,6 @@ import {
} from '@material-ui/core';
import InputAdornment from '@material-ui/core/InputAdornment';
import ExpandMoreIcon from '@material-ui/icons/ExpandMore';
-import t from '../LocalizationProvider';
import { prefixString } from '../common/stringUtils';
import EditItemView from '../EditItemView';
import EditAttributesView from '../attributes/EditAttributesView';
@@ -13,6 +12,7 @@ import { useAttributePreference } from '../common/preferences';
import {
speedFromKnots, speedToKnots, distanceFromMeters, distanceToMeters,
} from '../common/converter';
+import { useTranslation } from '../LocalizationProvider';
const useStyles = makeStyles(() => ({
details: {
@@ -22,6 +22,8 @@ const useStyles = makeStyles(() => ({
const MaintenancePage = () => {
const classes = useStyles();
+ const t = useTranslation();
+
const [item, setItem] = useState();
const [labels, setLabels] = useState({ start: '', period: '' });
diff --git a/modern/src/settings/MaintenancesPage.js b/modern/src/settings/MaintenancesPage.js
index 07d78ee9..5b040b55 100644
--- a/modern/src/settings/MaintenancesPage.js
+++ b/modern/src/settings/MaintenancesPage.js
@@ -3,7 +3,6 @@ import {
TableContainer, Table, TableRow, TableCell, TableHead, TableBody, makeStyles, IconButton,
} from '@material-ui/core';
import MoreVertIcon from '@material-ui/icons/MoreVert';
-import t from '../LocalizationProvider';
import { useEffectAsync } from '../reactHelper';
import EditCollectionView from '../EditCollectionView';
@@ -11,6 +10,7 @@ import positionAttributes from '../attributes/positionAttributes';
import { formatDistance, formatSpeed } from '../common/formatter';
import { useAttributePreference } from '../common/preferences';
import OptionsLayout from './OptionsLayout';
+import { useTranslation } from '../LocalizationProvider';
const useStyles = makeStyles((theme) => ({
columnAction: {
@@ -21,6 +21,7 @@ const useStyles = makeStyles((theme) => ({
const MaintenancesView = ({ updateTimestamp, onMenuClick }) => {
const classes = useStyles();
+ const t = useTranslation();
const [items, setItems] = useState([]);
const speedUnit = useAttributePreference('speedUnit');
diff --git a/modern/src/settings/NotificationsPage.js b/modern/src/settings/NotificationsPage.js
index 273c15d5..01483637 100644
--- a/modern/src/settings/NotificationsPage.js
+++ b/modern/src/settings/NotificationsPage.js
@@ -3,12 +3,12 @@ import {
TableContainer, Table, TableRow, TableCell, TableHead, TableBody, makeStyles, IconButton,
} from '@material-ui/core';
import MoreVertIcon from '@material-ui/icons/MoreVert';
-import t from '../LocalizationProvider';
import { useEffectAsync } from '../reactHelper';
import EditCollectionView from '../EditCollectionView';
import { prefixString } from '../common/stringUtils';
import { formatBoolean } from '../common/formatter';
import OptionsLayout from './OptionsLayout';
+import { useTranslation } from '../LocalizationProvider';
const useStyles = makeStyles((theme) => ({
columnAction: {
@@ -19,6 +19,7 @@ const useStyles = makeStyles((theme) => ({
const NotificationsView = ({ updateTimestamp, onMenuClick }) => {
const classes = useStyles();
+ const t = useTranslation();
const [items, setItems] = useState([]);