Add device export report

1 files changed, 13 insertions, 2 deletions

diff --git a/modern/src/settings/DevicesPage.jsx b/modern/src/settings/DevicesPage.jsx
index 5ef5aae5..e4bfe5b5 100644
--- a/modern/src/settings/DevicesPage.jsx
+++ b/modern/src/settings/DevicesPage.jsx
@@ -2,10 +2,10 @@ import React, { useState } from 'react';
 import { useSelector } from 'react-redux';
 import { useNavigate } from 'react-router-dom';
 import {
-  Table, TableRow, TableCell, TableHead, TableBody,
+  Table, TableRow, TableCell, TableHead, TableBody, Button, TableFooter,
 } from '@mui/material';
 import LinkIcon from '@mui/icons-material/Link';
-import { useEffectAsync } from '../reactHelper';
+import { useCatch, useEffectAsync } from '../reactHelper';
 import { useTranslation } from '../common/components/LocalizationProvider';
 import PageLayout from '../common/components/PageLayout';
 import SettingsMenu from './components/SettingsMenu';
@@ -48,6 +48,10 @@ const DevicesPage = () => {
     }
   }, [timestamp]);
 
+  const handleExport = () => {
+    window.location.assign(`/api/reports/devices/xlsx`);
+  };
+
   const actionConnections = {
     key: 'connections',
     title: t('sharedConnections'),
@@ -94,6 +98,13 @@ const DevicesPage = () => {
             </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>