From 59dbad9aaa0f198029d0a29be386a8565bf0b5d7 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Daniel=20M=C3=A4ckelmann?=
 <6890706+n1kPLV@users.noreply.github.com>
Date: Fri, 15 Sep 2023 22:43:11 +0200
Subject: [PATCH] Fixed Frontend invalid token handling

---
 Website/src/app/components/dynlist.tsx          | 10 +++++++---
 Website/src/app/components/dynmap.tsx           |  4 ++--
 Website/src/app/components/dynmap_with_list.tsx |  4 ++--
 3 files changed, 11 insertions(+), 7 deletions(-)

diff --git a/Website/src/app/components/dynlist.tsx b/Website/src/app/components/dynlist.tsx
index cc7bc85d..c41a2ec0 100644
--- a/Website/src/app/components/dynlist.tsx
+++ b/Website/src/app/components/dynlist.tsx
@@ -1,6 +1,6 @@
 "use client";
 
-import { RevalidateError } from "@/utils/types";
+import { RevalidateError, UnauthorizedError } from "@/utils/types";
 import { FullTrack, Vehicle } from "@/utils/api";
 import useSWR from "swr";
 import { coordinateFormatter } from "@/utils/helpers";
@@ -8,6 +8,7 @@ import Link from "next/link";
 import TrackerCharge from "@/app/components/tracker";
 import { FunctionComponent } from "react";
 import { getFetcher } from "@/utils/fetcher";
+import { useRouter } from "next/navigation";
 
 /**
  * A component to focus a vehicle. A link to the map view with the respective search parameter
@@ -125,10 +126,13 @@ export default function DynamicList({
 	// sort the vehicles
 	const sorted_vehicles = vehicles?.sort((a, b) => a.id - b.id);
 
+	// obtain the NextJS router
+	const router = useRouter()
+
 	if (logged_in && error) {
-		if (error instanceof RevalidateError && error.statusCode == 401) {
+		if (error instanceof UnauthorizedError || (error instanceof RevalidateError && error.statusCode === 401)) {
 			console.log("Invalid token");
-			window.location.reload();
+			router.refresh();
 		}
 		console.log("revalidate error", error);
 	}
diff --git a/Website/src/app/components/dynmap.tsx b/Website/src/app/components/dynmap.tsx
index 4268a07a..b403f645 100644
--- a/Website/src/app/components/dynmap.tsx
+++ b/Website/src/app/components/dynmap.tsx
@@ -1,7 +1,7 @@
 "use client";
 import dynamic from "next/dynamic";
 import LoadMapScreen from "./loadmap";
-import { MapRefreshConfig, RevalidateError } from "@/utils/types";
+import { MapRefreshConfig, RevalidateError, UnauthorizedError } from "@/utils/types";
 import useSWR from "swr";
 import { useRouter } from "next/navigation";
 import { useState } from "react";
@@ -51,7 +51,7 @@ export default function DynamicMap({
 
 	// log the user out if revalidation fails with a 401 response (this assumes that the request handler removed the cookie)
 	if (logged_in && error) {
-		if (error instanceof RevalidateError && error.statusCode == 401) {
+		if (error instanceof UnauthorizedError || (error instanceof RevalidateError && error.statusCode === 401)) {
 			console.log("Invalid token");
 			router.refresh();
 		}
diff --git a/Website/src/app/components/dynmap_with_list.tsx b/Website/src/app/components/dynmap_with_list.tsx
index 66eeb605..07118955 100644
--- a/Website/src/app/components/dynmap_with_list.tsx
+++ b/Website/src/app/components/dynmap_with_list.tsx
@@ -1,6 +1,6 @@
 "use client";
 
-import { MapRefreshConfig, RevalidateError } from "@/utils/types";
+import { MapRefreshConfig, RevalidateError, UnauthorizedError } from "@/utils/types";
 import useSWR from "swr";
 import { getFetcher } from "@/utils/fetcher";
 import { useRouter } from "next/navigation";
@@ -54,7 +54,7 @@ export default function DynamicMapList({
 
 	// log the user out if revalidation fails with a 401 response (this assumes that the request handler removed the cookie)
 	if (logged_in && error) {
-		if (error instanceof RevalidateError && error.statusCode == 401) {
+		if (error instanceof UnauthorizedError || (error instanceof RevalidateError && error.statusCode === 401)) {
 			console.log("Invalid token");
 			router.refresh();
 		}