feat: persist edits in localStorage

Previously, edits existed only in memory. Reloading the page lost all changes,
forcing users to export with Copy to preserve anything.

This change persists visa dates and trips to the browser's localStorage on
every mutation, restoring them on load in preference to trips.js. The Reset
button clears the saved copy and returns to the file. All data remains in the
browser; no account or server is involved.

Author: indradhanush

index.html

@@ -509,8 +509,9 @@ <h1>UK ILR absence tracker</h1>
           <div class="card grow">
             <h2>Trips</h2>
             <p class="note">
-              Edit a date and everything recalculates. Edits are not saved
-              &mdash; use Copy to keep them.
+              Edit a date and everything recalculates. Edits are saved in this
+              browser and restored when you come back. Copy exports them as
+              trips.js; Reset discards them.
             </p>
             <div class="scrolly"><table id="triptable"></table></div>
             <p class="badnote" id="tripwarn"></p>

src/app.ts

@@ -140,6 +140,43 @@ interface Domain {
     }));
   }
 
+  /**
+   * Edits persist in localStorage so a revisit finds them immediately, with
+   * no sign-in and nothing leaving the browser. The saved copy wins over
+   * trips.js on load; Reset discards it and returns to the file.
+   */
+  const DATA_KEY = "ilr.data.v1";
+
+  function saveData(): void {
+    const payload = JSON.stringify({ visaValidFrom, firstArrivalOn, trips });
+    try { localStorage.setItem(DATA_KEY, payload); } catch { /* private mode */ }
+  }
+
+  function clearSavedData(): void {
+    try { localStorage.removeItem(DATA_KEY); } catch { /* private mode */ }
+  }
+
+  /** True when saved data existed and was loaded. Malformed data is ignored. */
+  function restoreData(): boolean {
+    let raw: string | null = null;
+    try { raw = localStorage.getItem(DATA_KEY); } catch { /* private mode */ }
+    if (!raw) return false;
+    try {
+      const d = JSON.parse(raw);
+      if (!d || !Array.isArray(d.trips)) return false;
+      const str = (v: unknown) => (typeof v === "string" ? v : "");
+      visaValidFrom = str(d.visaValidFrom);
+      firstArrivalOn = str(d.firstArrivalOn);
+      trips = d.trips.map((t: unknown) => {
+        const o = (t || {}) as Record<string, unknown>;
+        return { depart: str(o.depart), ret: str(o.ret), place: str(o.place), reason: str(o.reason) };
+      });
+      return true;
+    } catch {
+      return false;
+    }
+  }
+
   /**
    * The initial stay as a pseudo-trip in front of the real ones, so overlap
    * and picker-bound checks can treat all occupied date ranges uniformly.
@@ -653,6 +690,7 @@ interface Domain {
       if (!had && overlapsRow(0)) {
         if (f === "visa") visaValidFrom = prev; else firstArrivalOn = prev;
       }
+      saveData();
       render();
       return;
     }
@@ -668,13 +706,15 @@ interface Domain {
     } else {
       trip[f as keyof Trip] = t.value;
     }
+    saveData();
     render();
   });
 
   el("triptable").addEventListener("click", (e) => {
     const t = e.target as HTMLElement;
     if (t.dataset.del === undefined) return;
     trips.splice(Number(t.dataset.del), 1);
+    saveData();
     render();
   });
 
@@ -687,10 +727,12 @@ interface Domain {
       if (t.depart && t.ret) last = Math.max(last, toDay(t.ret) + 30);
     }
     trips.push({ depart: toISO(last), ret: toISO(last + 7), place: "", reason: "" });
+    saveData();
     render();
   });
 
   el("reset").addEventListener("click", () => {
+    clearSavedData();
     loadFromFile();
     render();
     flash("reset to trips.js");
@@ -806,6 +848,7 @@ interface Domain {
   restoreSplit();
   initSplitter();
   loadFromFile();
+  restoreData();
   render();
   watchPlotHeight();
 })();