feat: client side fullNote cache

web/src/lib/client.ts

@@ -73,6 +73,7 @@ interface FullVersionResponse {
 	createdAt: Date
 }
 
+// Some of these could just be local variables as they're not used globally
 export const currentUser: Writable<User | null> = writable(null)
 export const currentFullNote: Writable<FullNote | null> = writable(null)
 export const availableNotes: Writable<NoteMetadata[] | null> = writable(null)
@@ -87,6 +88,8 @@ class ApiClient {
 	private lastAtUpdate = new Date(0)
 	private lastCsrfUpdate = new Date(0)
 	private refreshInProgress = false
+	private loadedNotesCache = new Map<string, FullNote>()
+	// TODO: private loadedVersionsCache = new Map<string, FullVersion>()
 
 	constructor(baseUrl: string) {
 		this.baseUrl = baseUrl
@@ -543,6 +546,12 @@ class ApiClient {
 			throw new Error("Invalid note ID format.")
 		}
 
+		const cachedNote = this.loadedNotesCache.get(noteID)
+		if (cachedNote != null) {
+			console.log(`cache hit ${noteID}`)
+			return cachedNote
+		}
+
 		return this.handleRequest(
 			async () => {
 				const response = await fetch(`${this.baseUrl}/notes/${noteID}`, {
@@ -556,7 +565,8 @@ class ApiClient {
 				})
 				const note = this.deserializeFullNote(data)
 
-				console.log(note)
+				console.log(`caching ${noteID}`)
+				this.loadedNotesCache.set(noteID, note)
 
 				return note
 			},

web/src/lib/components/NoteView.svelte

@@ -102,9 +102,6 @@
 	}
 
 	const selectNote = async (noteId: string) => {
-		// TODO: check from cache props first before requesting from API
-
-		console.log(`loading ${noteId}`)
 		const note = await apiClient.getFullNote(noteId)
 
 		if (note) {

web/src/lib/components/Sidebar.svelte

@@ -15,8 +15,6 @@
 	export let createNewNote: () => Promise<void>
 	export let selectNote: (noteId: string) => Promise<void>
 
-	// TODO: add caching props -> e.g. `export const previousNotes: FullNote[]`
-
 	const formatDate = (dateString: string | Date): string => {
 		if (!dateString) {
 			return ""
@@ -51,8 +49,7 @@
 		: notes
 </script>
 
-<!-- TODO: make the sidebar take up whole screen width on mobile -->
+<!-- TODO: add admin modal button (+ component similar to the settings modal) if the user is an admin -->
-<!-- TODO: add admin modal (opens a view similar to the settings modal) button to the bottom (if the user is an admin) -->
 
 <aside
 	class="sidebar z-10"