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 { prefixString, unprefixString } from '../common/stringUtils'; import SelectField from '../form/SelectField'; const useStyles = makeStyles(() => ({ details: { flexDirection: 'column', }, })); const NotificationPage = () => { const classes = useStyles(); const [item, setItem] = useState(); const alarms = findStringKeys((it) => it.startsWith('alarm')).map((it) => ({ key: unprefixString('alarm', it), name: t(it), })); return ( {item && ( <> }> {t('sharedRequired')} 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" /> 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') && ( setItem({ ...item, attributes: { ...item.attributes, alarms: e.target.value.join() } })} data={alarms} keyGetter={(it) => it.key} label={t('sharedAlarms')} variant="filled" /> )} setItem({ ...item, always: event.target.checked })} /> )} label={t('notificationAlways')} /> )} ); }; export default NotificationPage;