fix browser history state routing

migrants-and-the-state · Jan 30, 2025 · 3d922c8 · 3d922c8
1 parent 082c5bf
commit 3d922c8
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 9 deletions.
diff --git a/src/lib/scope.js b/src/lib/scope.js
@@ -1,4 +1,4 @@
-// import { goto } from '$app/navigation';
+import { goto } from '$app/navigation';
 
 export const validScopes = ['afile', 'page', 'g325a', 'natcert'];
 
@@ -8,6 +8,5 @@ export function getScopeIndex(scope) {
 
 export function updateScopeIndex(index) {
 	const newScope = validScopes[index];
-	window.history.replaceState(history.state, '', `?tab=${newScope}`);
-	// goto(`?tab=${newScope}`);
+	goto(`?tab=${newScope}`, { replaceState: true, invalidateAll: true })
 }
diff --git a/src/routes/view/afile/[anum]/[pageslug]/+page.svelte b/src/routes/view/afile/[anum]/[pageslug]/+page.svelte
@@ -20,6 +20,15 @@
 
 	const manifestId = data.props.manifest_url;
 	const currentPageIdx = writable(0);
+	// if currentPageIdx is updated, update the window location
+	currentPageIdx.subscribe((val) => {
+		let paddedIdx = val.toString().padStart(4, '0');
+		let newTarget = window.location.href.replace(
+			getLastUrlSegment(window.location.href),
+			paddedIdx
+		);
+		goto(newTarget, { replaceState: true, invalidateAll: true });
+	});
 	const numPages = afile.page_count;
 
 	function getLastUrlSegment(url) {
@@ -80,12 +89,6 @@
 
 			// Update the current page based on the canvas index
 			currentPageIdx.set(currentCanvasIndex);
-			let paddedIdx = currentCanvasIndex.toString().padStart(4, '0');
-			let newTarget = window.location.href.replace(
-				getLastUrlSegment(window.location.href),
-				paddedIdx
-			);
-			window.history.replaceState(history.state, '', newTarget);
 		});
 	});
 </script>