diff options
Diffstat (limited to 'modern/src/settings/DevicesPage.jsx')
-rw-r--r-- | modern/src/settings/DevicesPage.jsx | 114 |
1 files changed, 0 insertions, 114 deletions
diff --git a/modern/src/settings/DevicesPage.jsx b/modern/src/settings/DevicesPage.jsx deleted file mode 100644 index c0da0ba7..00000000 --- a/modern/src/settings/DevicesPage.jsx +++ /dev/null @@ -1,114 +0,0 @@ -import React, { useState } from 'react'; -import { useSelector } from 'react-redux'; -import { useNavigate } from 'react-router-dom'; -import { - Table, TableRow, TableCell, TableHead, TableBody, Button, TableFooter, -} from '@mui/material'; -import LinkIcon from '@mui/icons-material/Link'; -import { useEffectAsync } from '../reactHelper'; -import { useTranslation } from '../common/components/LocalizationProvider'; -import PageLayout from '../common/components/PageLayout'; -import SettingsMenu from './components/SettingsMenu'; -import CollectionFab from './components/CollectionFab'; -import CollectionActions from './components/CollectionActions'; -import TableShimmer from '../common/components/TableShimmer'; -import SearchHeader, { filterByKeyword } from './components/SearchHeader'; -import { usePreference } from '../common/util/preferences'; -import { formatTime } from '../common/util/formatter'; -import { useDeviceReadonly } from '../common/util/permissions'; -import useSettingsStyles from './common/useSettingsStyles'; - -const DevicesPage = () => { - const classes = useSettingsStyles(); - const navigate = useNavigate(); - const t = useTranslation(); - - const groups = useSelector((state) => state.groups.items); - - const hours12 = usePreference('twelveHourFormat'); - - const deviceReadonly = useDeviceReadonly(); - - const [timestamp, setTimestamp] = useState(Date.now()); - const [items, setItems] = useState([]); - const [searchKeyword, setSearchKeyword] = useState(''); - const [loading, setLoading] = useState(false); - - useEffectAsync(async () => { - setLoading(true); - try { - const response = await fetch('/api/devices'); - if (response.ok) { - setItems(await response.json()); - } else { - throw Error(await response.text()); - } - } finally { - setLoading(false); - } - }, [timestamp]); - - const handleExport = () => { - window.location.assign('/api/reports/devices/xlsx'); - }; - - const actionConnections = { - key: 'connections', - title: t('sharedConnections'), - icon: <LinkIcon fontSize="small" />, - handler: (deviceId) => navigate(`/settings/device/${deviceId}/connections`), - }; - - return ( - <PageLayout menu={<SettingsMenu />} breadcrumbs={['settingsTitle', 'deviceTitle']}> - <SearchHeader keyword={searchKeyword} setKeyword={setSearchKeyword} /> - <Table className={classes.table}> - <TableHead> - <TableRow> - <TableCell>{t('sharedName')}</TableCell> - <TableCell>{t('deviceIdentifier')}</TableCell> - <TableCell>{t('groupParent')}</TableCell> - <TableCell>{t('sharedPhone')}</TableCell> - <TableCell>{t('deviceModel')}</TableCell> - <TableCell>{t('deviceContact')}</TableCell> - <TableCell>{t('userExpirationTime')}</TableCell> - <TableCell className={classes.columnAction} /> - </TableRow> - </TableHead> - <TableBody> - {!loading ? items.filter(filterByKeyword(searchKeyword)).map((item) => ( - <TableRow key={item.id}> - <TableCell>{item.name}</TableCell> - <TableCell>{item.uniqueId}</TableCell> - <TableCell>{item.groupId ? groups[item.groupId]?.name : null}</TableCell> - <TableCell>{item.phone}</TableCell> - <TableCell>{item.model}</TableCell> - <TableCell>{item.contact}</TableCell> - <TableCell>{formatTime(item.expirationTime, 'date', hours12)}</TableCell> - <TableCell className={classes.columnAction} padding="none"> - <CollectionActions - itemId={item.id} - editPath="/settings/device" - endpoint="devices" - setTimestamp={setTimestamp} - customActions={[actionConnections]} - readonly={deviceReadonly} - /> - </TableCell> - </TableRow> - )) : (<TableShimmer columns={7} endAction />)} - </TableBody> - <TableFooter> - <TableRow> - <TableCell colSpan={8} align="right"> - <Button onClick={handleExport} variant="text">{t('reportExport')}</Button> - </TableCell> - </TableRow> - </TableFooter> - </Table> - <CollectionFab editPath="/settings/device" /> - </PageLayout> - ); -}; - -export default DevicesPage; |