Implement API error handling

1 files changed, 5 insertions, 2 deletions

diff --git a/modern/src/reports/StopReportPage.js b/modern/src/reports/StopReportPage.js
index dd55b774..dc2ac19a 100644
--- a/modern/src/reports/StopReportPage.js
+++ b/modern/src/reports/StopReportPage.js
@@ -12,6 +12,7 @@ import PageLayout from '../common/components/PageLayout';
 import ReportsMenu from './components/ReportsMenu';
 import ColumnSelect from './components/ColumnSelect';
 import usePersistedState from '../common/util/usePersistedState';
+import { useCatch } from '../reactHelper';
 
 const columnsArray = [
   ['startTime', 'reportStartTime'],
@@ -33,7 +34,7 @@ const StopReportPage = () => {
   const [columns, setColumns] = usePersistedState('stopColumns', ['startTime', 'endTime', 'startOdometer', 'address']);
   const [items, setItems] = useState([]);
 
-  const handleSubmit = async (deviceId, from, to, mail, headers) => {
+  const handleSubmit = useCatch(async (deviceId, from, to, mail, headers) => {
     const query = new URLSearchParams({
       deviceId, from, to, mail,
     });
@@ -47,8 +48,10 @@ const StopReportPage = () => {
           window.location.assign(window.URL.createObjectURL(await response.blob()));
         }
       }
+    } else {
+      throw Error(await response.text());
     }
-  };
+  });
 
   const formatValue = (item, key) => {
     switch (key) {