From c3f9846a7467c2321dd4eccdb8aa445045694a8f Mon Sep 17 00:00:00 2001
From: microsoldering <geelongmicrosoldering@gmail.com>
Date: Fri, 27 Dec 2024 15:36:51 +1100
Subject: [PATCH 1/4] Update ReplayPage.jsx

Disable "Show" button while we wait for api response. Prevents subsequent API requests until the first one has returned
---
 src/other/ReplayPage.jsx | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/src/other/ReplayPage.jsx b/src/other/ReplayPage.jsx
index ce3b3467ac..da1ac01cce 100644
--- a/src/other/ReplayPage.jsx
+++ b/src/other/ReplayPage.jsx
@@ -92,6 +92,7 @@ const ReplayPage = () => {
   const [to, setTo] = useState();
   const [expanded, setExpanded] = useState(true);
   const [playing, setPlaying] = useState(false);
+  const [loading, setLoading] = useState(false);
 
   const deviceName = useSelector((state) => {
     if (selectedDeviceId) {
@@ -131,6 +132,7 @@ const ReplayPage = () => {
   }, [setShowCard]);
 
   const handleSubmit = useCatch(async ({ deviceId, from, to }) => {
+    setLoading(true);
     setSelectedDeviceId(deviceId);
     setFrom(from);
     setTo(to);
@@ -140,12 +142,14 @@ const ReplayPage = () => {
       setIndex(0);
       const positions = await response.json();
       setPositions(positions);
+      setLoading(false);
       if (positions.length) {
         setExpanded(false);
       } else {
         throw Error(t('sharedNoData'));
       }
     } else {
+      setLoading(false);
       throw Error(await response.text());
     }
   });
@@ -213,7 +217,7 @@ const ReplayPage = () => {
               </div>
             </>
           ) : (
-            <ReportFilter handleSubmit={handleSubmit} fullScreen showOnly />
+            <ReportFilter handleSubmit={handleSubmit} fullScreen showOnly loading={loading} />
           )}
         </Paper>
       </div>

From aff58bcda961f17f33d5c8661377e5fab48d1e31 Mon Sep 17 00:00:00 2001
From: microsoldering <geelongmicrosoldering@gmail.com>
Date: Fri, 27 Dec 2024 15:39:46 +1100
Subject: [PATCH 2/4] Update ReportFilter.jsx

Change "Show" button text to reflect Loading state during loading for better user experience
---
 src/reports/components/ReportFilter.jsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/reports/components/ReportFilter.jsx b/src/reports/components/ReportFilter.jsx
index fc60ed3a25..05d28ec668 100644
--- a/src/reports/components/ReportFilter.jsx
+++ b/src/reports/components/ReportFilter.jsx
@@ -186,7 +186,7 @@ const ReportFilter = ({
             disabled={disabled}
             onClick={() => handleClick('json')}
           >
-            <Typography variant="button" noWrap>{t('reportShow')}</Typography>
+            <Typography variant="button" noWrap>{loading ? t('sharedLoading') : t('reportShow')}</Typography>
           </Button>
         ) : (
           <SplitButton

From 5e0d2356cca2f788dca0f55b990e230f5eb7a22f Mon Sep 17 00:00:00 2001
From: microsoldering <geelongmicrosoldering@gmail.com>
Date: Fri, 27 Dec 2024 16:48:40 +1100
Subject: [PATCH 3/4] Update src/reports/components/ReportFilter.jsx

Define translation conditionally

Co-authored-by: Anton Tananaev <anton.tananaev@gmail.com>
---
 src/reports/components/ReportFilter.jsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/reports/components/ReportFilter.jsx b/src/reports/components/ReportFilter.jsx
index 05d28ec668..1549ea9911 100644
--- a/src/reports/components/ReportFilter.jsx
+++ b/src/reports/components/ReportFilter.jsx
@@ -186,7 +186,7 @@ const ReportFilter = ({
             disabled={disabled}
             onClick={() => handleClick('json')}
           >
-            <Typography variant="button" noWrap>{loading ? t('sharedLoading') : t('reportShow')}</Typography>
+            <Typography variant="button" noWrap>{t(loading ? 'sharedLoading' : 'reportShow')}</Typography>
           </Button>
         ) : (
           <SplitButton

From 712de60c4030b89f659857a25da08eb3ac80ea03 Mon Sep 17 00:00:00 2001
From: microsoldering <geelongmicrosoldering@gmail.com>
Date: Fri, 27 Dec 2024 17:13:59 +1100
Subject: [PATCH 4/4] Update ReplayPage.jsx

setLoading in a try>finally rather than referencing multiple times
---
 src/other/ReplayPage.jsx | 24 +++++++++++++-----------
 1 file changed, 13 insertions(+), 11 deletions(-)

diff --git a/src/other/ReplayPage.jsx b/src/other/ReplayPage.jsx
index da1ac01cce..199f346107 100644
--- a/src/other/ReplayPage.jsx
+++ b/src/other/ReplayPage.jsx
@@ -137,20 +137,22 @@ const ReplayPage = () => {
     setFrom(from);
     setTo(to);
     const query = new URLSearchParams({ deviceId, from, to });
-    const response = await fetch(`/api/positions?${query.toString()}`);
-    if (response.ok) {
-      setIndex(0);
-      const positions = await response.json();
-      setPositions(positions);
-      setLoading(false);
-      if (positions.length) {
-        setExpanded(false);
+    try {
+      const response = await fetch(`/api/positions?${query.toString()}`);
+      if (response.ok) {
+        setIndex(0);
+        const positions = await response.json();
+        setPositions(positions);
+        if (positions.length) {
+          setExpanded(false);
+        } else {
+          throw Error(t('sharedNoData'));
+        }
       } else {
-        throw Error(t('sharedNoData'));
+        throw Error(await response.text());
       }
-    } else {
+    } finally {
       setLoading(false);
-      throw Error(await response.text());
     }
   });