From 14797fc6d3932638e07285f7bac64e7e2dca389a Mon Sep 17 00:00:00 2001
From: Type-Style <github@type-style.de>
Date: Fri, 19 Jul 2024 21:01:09 +0200
Subject: [PATCH 1/4] [Fix] #93, offline message improvement

---
 src/client/pages/Start.tsx | 14 ++++++++++++--
 1 file changed, 12 insertions(+), 2 deletions(-)

diff --git a/src/client/pages/Start.tsx b/src/client/pages/Start.tsx
index 8d91287c..5a4bd91a 100644
--- a/src/client/pages/Start.tsx
+++ b/src/client/pages/Start.tsx
@@ -88,11 +88,21 @@ function Start() {
       setMessageObj({ isError: null, status: null, message: null });
       setNextFetch(new Date().getTime() + fetchIntervalMs);
     } catch (error) {
+      console.log("error fetching data %o", error);
+      
+      if (!error.response) {
+        setMessageObj({ isError: true, status: 499, message: error.message || "offline" });
+        setNextFetch(new Date().getTime() + fetchIntervalMs);
+        return;
+      }
+      
+      if (error.response.status == 403) { setLogin(false) }
+      
+      setMessageObj({ isError: true, status: error.response.data.status || error.response.status, message: error.response.data.message || error.message });
+      
       clearInterval(intervalID.current); intervalID.current = null;
       console.info("cleared Interval");
       setNextFetch(null);
-      if (error.response.status == 403) { setLogin(false) }
-      setMessageObj({ isError: true, status: error.response.data.status || error.response.status, message: error.response.data.message || error.message });
     }
   };
 

From d0537e40257fc660680a0153872034127312c44c Mon Sep 17 00:00:00 2001
From: Type-Style <github@type-style.de>
Date: Thu, 15 Aug 2024 11:28:03 +0200
Subject: [PATCH 2/4] [Task] #93, removed background in status module when no
 data is present

---
 src/client/components/Status.tsx | 2 +-
 src/client/css/start.css         | 4 ++++
 src/client/pages/Start.tsx       | 2 +-
 3 files changed, 6 insertions(+), 2 deletions(-)

diff --git a/src/client/components/Status.tsx b/src/client/components/Status.tsx
index 5c1991ea..7d5026ed 100644
--- a/src/client/components/Status.tsx
+++ b/src/client/components/Status.tsx
@@ -50,7 +50,7 @@ function Map({ entries }: { entries: Models.IEntry[] }) {
 		<ul>
 			<li>datapoints: {entries.length - statusData.ignoredEntries}<i>({statusData.ignoredEntries})</i></li>
 			<li>Ø upload: {statusData.uploadMean}s </li>
-			<li>Ø speed: GPS: {statusData.speedGPSMean}km/h Calc: {statusData.speedCalcMean == "NaN" ? " - " : statusData.speedCalcMean	}km/h </li>
+			<li>Ø speed: GPS: {statusData.speedGPSMean}km/h Calc: {statusData.speedCalcMean == "NaN" ? " - " : statusData.speedCalcMean}km/h </li>
 			<li></li>
 		</ul>
 	)
diff --git a/src/client/css/start.css b/src/client/css/start.css
index b1973109..67b3530b 100644
--- a/src/client/css/start.css
+++ b/src/client/css/start.css
@@ -57,6 +57,10 @@
 			position: relative;
 			z-index: 0;
 
+			&.emptyData::after {
+				content: none;
+			}
+
 			&::after {
 				content: "";
 				position: absolute;
diff --git a/src/client/pages/Start.tsx b/src/client/pages/Start.tsx
index 5a4bd91a..3745aa2c 100644
--- a/src/client/pages/Start.tsx
+++ b/src/client/pages/Start.tsx
@@ -146,7 +146,7 @@ function Start() {
 
         <div className="grid-item map"><Map entries={entries} /></div>
         <div className="grid-item theme"><ModeSwitcher /></div>
-        <div className="grid-item status cut-after"><Status entries={entries} /></div>
+        <div className={`grid-item status ${entries.length ? "cut-after" : 'emptyData'}`}><Status entries={entries} /></div>
         <div className="grid-item images">
           <div className="image">image1</div>
           <div className="image">image2</div>

From a3d2ffc2022402fa0be62439b65fb842b6d4fb97 Mon Sep 17 00:00:00 2001
From: Type-Style <github@type-style.de>
Date: Thu, 15 Aug 2024 11:29:21 +0200
Subject: [PATCH 3/4] [Task] #61, add cut class to map for styling

---
 src/client/pages/Start.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/client/pages/Start.tsx b/src/client/pages/Start.tsx
index 3745aa2c..cbc6ecf1 100644
--- a/src/client/pages/Start.tsx
+++ b/src/client/pages/Start.tsx
@@ -144,7 +144,7 @@ function Start() {
           </Button>
         </div>
 
-        <div className="grid-item map"><Map entries={entries} /></div>
+        <div className="grid-item map cut"><Map entries={entries} /></div>
         <div className="grid-item theme"><ModeSwitcher /></div>
         <div className={`grid-item status ${entries.length ? "cut-after" : 'emptyData'}`}><Status entries={entries} /></div>
         <div className="grid-item images">

From 31f7797e136d277ca9a7d078e94e8ac47d10b688 Mon Sep 17 00:00:00 2001
From: Type-Style <github@type-style.de>
Date: Thu, 15 Aug 2024 11:44:43 +0200
Subject: [PATCH 4/4] [Fix] #93 fix tests, be more specific on url, and let
 test fail non silently when csrf is not found

---
 src/tests/login.test.ts | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/src/tests/login.test.ts b/src/tests/login.test.ts
index 4bb56996..e7a593e9 100644
--- a/src/tests/login.test.ts
+++ b/src/tests/login.test.ts
@@ -25,7 +25,7 @@ describe('Login', () => {
     try {
       response = await axios({
         method: "post",
-        url: "/login/csrf",
+        url: "http://localhost:80/login/csrf",
         headers: { 
           "content-type": "application/x-www-form-urlencoded",
           "x-requested-with": "XMLHttpRequest"
@@ -34,6 +34,7 @@ describe('Login', () => {
       serverStatus = response.status;
     } catch (error) {
       console.error(error);
+      throw Error("fail");
     }
 
 
@@ -79,7 +80,8 @@ describe('Login', () => {
 
   it('test invalid credentials to return error', async () => {
     try {
-      userDataWithToken.csrfToken = csrfToken
+      userDataWithToken.csrfToken = csrfToken;
+      console.log("csrfToken %o", userDataWithToken.csrfToken);
       await axios.post('http://localhost:80/login', qs.stringify(userDataWithToken));
     } catch (error) {
       const axiosError = error as AxiosError;