From b4a3da5174aebabe5cd0598469e9c43d74e0a215 Mon Sep 17 00:00:00 2001
From: Fred Boniface <fred@fjla.uk>
Date: Fri, 5 Jul 2024 10:45:38 +0100
Subject: [PATCH] Add nearToMeCache store using session storage

---
 src/lib/cards/NearToMeCard.svelte | 14 +++++++-------
 src/lib/stores/nearToMeCache.ts   | 26 ++++++++++++++++++++++++++
 2 files changed, 33 insertions(+), 7 deletions(-)
 create mode 100644 src/lib/stores/nearToMeCache.ts

diff --git a/src/lib/cards/NearToMeCard.svelte b/src/lib/cards/NearToMeCard.svelte
index 36057a0..673c511 100644
--- a/src/lib/cards/NearToMeCard.svelte
+++ b/src/lib/cards/NearToMeCard.svelte
@@ -9,6 +9,7 @@
     import InLineLoading from "$lib/navigation/InLineLoading.svelte";
     import { apiGet } from "$lib/scripts/apiFetch";
     import { onMount } from "svelte";
+    import { nearToMeCache } from "$lib/stores/nearToMeCache";
 
     let errorMessage: string;
     let stations: NearestStationResponse[] = [];
@@ -18,7 +19,7 @@
         showHelp: true,
         showRefresh: true,
         helpText: "Your location may not be accurate on desktop and laptop devices.",
-        onRefresh: refresh,
+        onRefresh: getNearestStations,
         refreshing: false,
     };
 
@@ -28,19 +29,15 @@
         toast.success("Done\nTo disable location, go to settings");
     }
 
-    function refresh() {
-        config.refreshing = true;
-        stations = [];
-        getNearestStations();
-    }
-
     async function getNearestStations() {
         // Get location, then fetch nearest stations and push to `stations` variable
+        config.refreshing = true;
         const currentLocation = await getCurrentLocation();
         const apiPath: string = `/api/v2/live/station/nearest/${currentLocation.latitude}/${currentLocation.longitude}`;
         try {
             const apiResponse = (await apiGet(apiPath)) as NearestStationResponse[];
             stations = apiResponse;
+            nearToMeCache.set(apiResponse)
         } catch (err) {
             errorMessage = err as string;
         } finally {
@@ -53,6 +50,9 @@
             if (!$uuid || $uuid === "null") {
                 errorMessage = "Register to use this feature";
             } else {
+                if ($nearToMeCache.length) {
+                    stations = $nearToMeCache
+                }
                 getNearestStations();
             }
         }
diff --git a/src/lib/stores/nearToMeCache.ts b/src/lib/stores/nearToMeCache.ts
new file mode 100644
index 0000000..da843f0
--- /dev/null
+++ b/src/lib/stores/nearToMeCache.ts
@@ -0,0 +1,26 @@
+import { writable, type Writable } from "svelte/store";
+import { browser } from "$app/environment";
+import type { NearestStationResponse } from "@owlboard/ts-types";
+
+export const nearToMeCache = writable(fromSessionStorage("nearToMeCache", []));
+toSessionStorage(nearToMeCache, "nearToMeCache");
+
+function fromSessionStorage(storageKey: string, fallback: NearestStationResponse[]): NearestStationResponse[] {
+    if (browser) {
+        const storedValue = sessionStorage.getItem(storageKey);
+        if (storedValue !== "undefined" && storedValue !== null) {
+            return typeof fallback === "object" ? JSON.parse(storedValue) : storedValue;
+        }
+    }
+    return fallback;
+}
+
+function toSessionStorage(store: Writable<NearestStationResponse[]>, storageKey: string) {
+    if (browser) {
+        store.subscribe((value) => {
+            let storageValue = typeof value === "object" ? JSON.stringify(value.sort()) : value;
+
+            sessionStorage.setItem(storageKey, storageValue);
+        });
+    }
+}