Merge branch 'master' of github.com:traccar/traccar-web into fix-key-issue

1 files changed, 56 insertions, 55 deletions

diff --git a/modern/src/settings/NotificationPage.js b/modern/src/settings/NotificationPage.js
index 38ba19e5..a7c06f68 100644
--- a/modern/src/settings/NotificationPage.js
+++ b/modern/src/settings/NotificationPage.js
@@ -1,9 +1,15 @@
 import React, { useState } from 'react';
 
 import {
-  Accordion, AccordionSummary, AccordionDetails, makeStyles, Typography, FormControlLabel, Checkbox,
-} from '@material-ui/core';
-import ExpandMoreIcon from '@material-ui/icons/ExpandMore';
+  Accordion,
+  AccordionSummary,
+  AccordionDetails,
+  Typography,
+  FormControlLabel,
+  Checkbox,
+} from '@mui/material';
+import makeStyles from '@mui/styles/makeStyles';
+import ExpandMoreIcon from '@mui/icons-material/ExpandMore';
 import { useTranslation, useTranslationKeys } from '../common/components/LocalizationProvider';
 import EditItemView from './components/EditItemView';
 import { prefixString, unprefixString } from '../common/util/stringUtils';
@@ -39,60 +45,55 @@ const NotificationPage = () => {
       breadcrumbs={['settingsTitle', 'sharedNotification']}
     >
       {item && (
-        <>
-          <Accordion defaultExpanded>
-            <AccordionSummary expandIcon={<ExpandMoreIcon />}>
-              <Typography variant="subtitle1">
-                {t('sharedRequired')}
-              </Typography>
-            </AccordionSummary>
-            <AccordionDetails className={classes.details}>
-              <SelectField
-                margin="normal"
-                value={item.type}
-                emptyValue={null}
-                onChange={(e) => setItem({ ...item, type: e.target.value })}
-                endpoint="/api/notifications/types"
-                keyGetter={(it) => it.type}
-                titleGetter={(it) => t(prefixString('event', it.type))}
-                label={t('sharedType')}
-                variant="filled"
-              />
-              <SelectField
-                multiple
-                margin="normal"
-                value={item.notificators ? item.notificators.split(/[, ]+/) : []}
-                onChange={(e) => setItem({ ...item, notificators: e.target.value.join() })}
-                endpoint="/api/notifications/notificators"
-                keyGetter={(it) => it.type}
-                titleGetter={(it) => t(prefixString('notificator', it.type))}
-                label={t('notificationNotificators')}
-                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() } })}
-                  data={alarms}
-                  keyGetter={(it) => it.key}
-                  label={t('sharedAlarms')}
-                  variant="filled"
+        <Accordion defaultExpanded>
+          <AccordionSummary expandIcon={<ExpandMoreIcon />}>
+            <Typography variant="subtitle1">
+              {t('sharedRequired')}
+            </Typography>
+          </AccordionSummary>
+          <AccordionDetails className={classes.details}>
+            <SelectField
+              margin="normal"
+              value={item.type}
+              emptyValue={null}
+              onChange={(e) => setItem({ ...item, type: e.target.value })}
+              endpoint="/api/notifications/types"
+              keyGetter={(it) => it.type}
+              titleGetter={(it) => t(prefixString('event', it.type))}
+              label={t('sharedType')}
+            />
+            <SelectField
+              multiple
+              margin="normal"
+              value={item.notificators ? item.notificators.split(/[, ]+/) : []}
+              onChange={(e) => setItem({ ...item, notificators: e.target.value.join() })}
+              endpoint="/api/notifications/notificators"
+              keyGetter={(it) => it.type}
+              titleGetter={(it) => t(prefixString('notificator', it.type))}
+              label={t('notificationNotificators')}
+            />
+            {(!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() } })}
+              data={alarms}
+              keyGetter={(it) => it.key}
+              label={t('sharedAlarms')}
+            />
+            )}
+            <FormControlLabel
+              control={(
+                <Checkbox
+                  checked={item.always}
+                  onChange={(event) => setItem({ ...item, always: event.target.checked })}
                 />
-              )}
-              <FormControlLabel
-                control={(
-                  <Checkbox
-                    checked={item.always}
-                    onChange={(event) => setItem({ ...item, always: event.target.checked })}
-                  />
                 )}
-                label={t('notificationAlways')}
-              />
-            </AccordionDetails>
-          </Accordion>
-        </>
+              label={t('notificationAlways')}
+            />
+          </AccordionDetails>
+        </Accordion>
       )}
     </EditItemView>
   );