new navigation flow

src/lib/serial/connection.ts

@@ -1,6 +1,7 @@
 import {writable} from "svelte/store"
 import {CharaDevice} from "$lib/serial/device"
 import type {Chord} from "$lib/serial/chord"
+import type {Writable} from "svelte/store"
 
 export const serialPort = writable<CharaDevice>()
 
@@ -17,12 +18,14 @@ export type CharaLayout = [number[], number[], number[]]
 
 export const layout = writable<CharaLayout>([[], [], []])
 
-export const syncing = writable(false)
+export const unsavedChanges = writable(0)
+
+export const syncStatus: Writable<"done" | "error" | "downloading" | "uploading"> = writable("done")
 
 let device: CharaDevice // @hmr:keep
 
 export async function initSerial() {
-  syncing.set(true)
+  syncStatus.set("downloading")
   device ??= new CharaDevice()
   serialPort.set(device)
 
@@ -40,5 +43,5 @@ export async function initSerial() {
     chordInfo.push(await device.getChord(i))
   }
   chords.set(chordInfo)
-  syncing.set(false)
+  syncStatus.set("done")
 }

src/lib/serial/storage.ts

@@ -0,0 +1,23 @@
+import {chords, layout} from "$lib/serial/connection"
+
+const PROFILE_KEY = "profiles"
+const CHORD_LIBRARY_STORAGE_KEY = "chord-library"
+const LAYOUT_STORAGE_KEY = "layouts"
+
+export function initLocalStorage() {
+  const storedLayout = localStorage.getItem(LAYOUT_STORAGE_KEY)
+  if (storedLayout) {
+    layout.set(JSON.parse(storedLayout))
+  }
+  const storedChords = localStorage.getItem(CHORD_LIBRARY_STORAGE_KEY)
+  if (storedChords) {
+    chords.set(JSON.parse(storedChords))
+  }
+
+  layout.subscribe(layout => {
+    localStorage.setItem(LAYOUT_STORAGE_KEY, JSON.stringify(layout))
+  })
+  chords.subscribe(chords => {
+    localStorage.setItem(CHORD_LIBRARY_STORAGE_KEY, JSON.stringify(chords))
+  })
+}