Disable report button when loading

8 files changed, 9 insertions, 9 deletions

diff --git a/src/reports/CombinedReportPage.jsx b/src/reports/CombinedReportPage.jsx
index ab472dfa..32ad5df0 100644
--- a/src/reports/CombinedReportPage.jsx
+++ b/src/reports/CombinedReportPage.jsx
@@ -73,7 +73,7 @@ const CombinedReportPage = () => {
         )}
         <div className={classes.containerMain}>
           <div className={classes.header}>
-            <ReportFilter handleSubmit={handleSubmit} showOnly multiDevice includeGroups />
+            <ReportFilter handleSubmit={handleSubmit} showOnly multiDevice includeGroups loading={loading} />
           </div>
           <Table>
             <TableHead>
diff --git a/src/reports/EventReportPage.jsx b/src/reports/EventReportPage.jsx
index 55c1452c..73e8a2e4 100644
--- a/src/reports/EventReportPage.jsx
+++ b/src/reports/EventReportPage.jsx
@@ -167,7 +167,7 @@ const EventReportPage = () => {
         )}
         <div className={classes.containerMain}>
           <div className={classes.header}>
-            <ReportFilter handleSubmit={handleSubmit} handleSchedule={handleSchedule}>
+            <ReportFilter handleSubmit={handleSubmit} handleSchedule={handleSchedule} loading={loading}>
               <div className={classes.filterItem}>
                 <FormControl fullWidth>
                   <InputLabel>{t('reportEventTypes')}</InputLabel>
diff --git a/src/reports/RouteReportPage.jsx b/src/reports/RouteReportPage.jsx
index 5003ff31..816e95cb 100644
--- a/src/reports/RouteReportPage.jsx
+++ b/src/reports/RouteReportPage.jsx
@@ -118,7 +118,7 @@ const RouteReportPage = () => {
         )}
         <div className={classes.containerMain}>
           <div className={classes.header}>
-            <ReportFilter handleSubmit={handleSubmit} handleSchedule={handleSchedule} multiDevice>
+            <ReportFilter handleSubmit={handleSubmit} handleSchedule={handleSchedule} multiDevice loading={loading}>
               <ColumnSelect
                 columns={columns}
                 setColumns={setColumns}
diff --git a/src/reports/StatisticsPage.jsx b/src/reports/StatisticsPage.jsx
index 3d5dcf8c..9d6ebf96 100644
--- a/src/reports/StatisticsPage.jsx
+++ b/src/reports/StatisticsPage.jsx
@@ -53,7 +53,7 @@ const StatisticsPage = () => {
   return (
     <PageLayout menu={<ReportsMenu />} breadcrumbs={['reportTitle', 'statisticsTitle']}>
       <div className={classes.header}>
-        <ReportFilter handleSubmit={handleSubmit} showOnly ignoreDevice>
+        <ReportFilter handleSubmit={handleSubmit} showOnly ignoreDevice loading={loading}>
           <ColumnSelect columns={columns} setColumns={setColumns} columnsArray={columnsArray} />
         </ReportFilter>
       </div>
diff --git a/src/reports/StopReportPage.jsx b/src/reports/StopReportPage.jsx
index c26351cd..0fd6aba1 100644
--- a/src/reports/StopReportPage.jsx
+++ b/src/reports/StopReportPage.jsx
@@ -129,7 +129,7 @@ const StopReportPage = () => {
         )}
         <div className={classes.containerMain}>
           <div className={classes.header}>
-            <ReportFilter handleSubmit={handleSubmit} handleSchedule={handleSchedule}>
+            <ReportFilter handleSubmit={handleSubmit} handleSchedule={handleSchedule} loading={loading}>
               <ColumnSelect columns={columns} setColumns={setColumns} columnsArray={columnsArray} />
             </ReportFilter>
           </div>
diff --git a/src/reports/SummaryReportPage.jsx b/src/reports/SummaryReportPage.jsx
index c6e00912..9b9c00c9 100644
--- a/src/reports/SummaryReportPage.jsx
+++ b/src/reports/SummaryReportPage.jsx
@@ -116,7 +116,7 @@ const SummaryReportPage = () => {
   return (
     <PageLayout menu={<ReportsMenu />} breadcrumbs={['reportTitle', 'reportSummary']}>
       <div className={classes.header}>
-        <ReportFilter handleSubmit={handleSubmit} handleSchedule={handleSchedule} multiDevice includeGroups>
+        <ReportFilter handleSubmit={handleSubmit} handleSchedule={handleSchedule} multiDevice includeGroups loading={loading}>
           <div className={classes.filterItem}>
             <FormControl fullWidth>
               <InputLabel>{t('sharedType')}</InputLabel>
diff --git a/src/reports/TripReportPage.jsx b/src/reports/TripReportPage.jsx
index 67eca586..22fb9b91 100644
--- a/src/reports/TripReportPage.jsx
+++ b/src/reports/TripReportPage.jsx
@@ -173,7 +173,7 @@ const TripReportPage = () => {
         )}
         <div className={classes.containerMain}>
           <div className={classes.header}>
-            <ReportFilter handleSubmit={handleSubmit} handleSchedule={handleSchedule}>
+            <ReportFilter handleSubmit={handleSubmit} handleSchedule={handleSchedule} loading={loading}>
               <ColumnSelect columns={columns} setColumns={setColumns} columnsArray={columnsArray} />
             </ReportFilter>
           </div>
diff --git a/src/reports/components/ReportFilter.jsx b/src/reports/components/ReportFilter.jsx
index e6e08f16..437a7487 100644
--- a/src/reports/components/ReportFilter.jsx
+++ b/src/reports/components/ReportFilter.jsx
@@ -11,7 +11,7 @@ import SplitButton from '../../common/components/SplitButton';
 import SelectField from '../../common/components/SelectField';
 import { useRestriction } from '../../common/util/permissions';
 
-const ReportFilter = ({ children, handleSubmit, handleSchedule, showOnly, ignoreDevice, multiDevice, includeGroups }) => {
+const ReportFilter = ({ children, handleSubmit, handleSchedule, showOnly, ignoreDevice, multiDevice, includeGroups, loading }) => {
   const classes = useReportStyles();
   const dispatch = useDispatch();
   const t = useTranslation();
@@ -33,7 +33,7 @@ const ReportFilter = ({ children, handleSubmit, handleSchedule, showOnly, ignore
   const [calendarId, setCalendarId] = useState();
 
   const scheduleDisabled = button === 'schedule' && (!description || !calendarId);
-  const disabled = (!ignoreDevice && !deviceId && !deviceIds.length && !groupIds.length) || scheduleDisabled;
+  const disabled = (!ignoreDevice && !deviceId && !deviceIds.length && !groupIds.length) || scheduleDisabled || loading;
 
   const handleClick = (type) => {
     if (type === 'schedule') {