Migrated to Sveltekit page state.

CHANGELOG.md

@@ -9,6 +9,7 @@ Dates are in `YYYY-MM-DD` format and versions are in [semantic versioning](http:
 
 - Added ability to change user interface font to one of the supported fonts.
 - Fixed #604, adding a project chat feature to enable communication between project collaborators and gallery owners.
+- Migrated to Sveltekit page state.
 
 ## 0.13.2 2024-12-09
 

package.json

@@ -54,7 +54,7 @@
         "svelte-jester": "^5",
         "svelte-preprocess": "^6.0",
         "@sveltejs/adapter-static": "^3",
-        "@sveltejs/kit": "^2",
+        "@sveltejs/kit": "^2.12.0",
         "@sveltejs/vite-plugin-svelte": "^5",
         "@types/matter-js": "^0",
         "@types/node": "^22",

src/components/app/Link.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-    import { page } from '$app/stores';
+    import { page } from '$app/state';
 
     interface Props {
         to: string;
@@ -18,7 +18,7 @@
     }: Props = $props();
 </script>
 
-{#if to === '/' ? $page.route.id === '/' : $page.route.id?.startsWith(to)}
+{#if to === '/' ? page.route.id === '/' : page.route.id?.startsWith(to)}
     {@render children?.()}
 {:else}<a
         data-sveltekit-preload-data="tap"

src/components/app/ProjectPreview.svelte

@@ -1,11 +1,12 @@
+<!-- @migration task: review uses of `navigating` -->
 <script lang="ts">
     import type Project from '@models/Project';
     import Evaluator from '@runtime/Evaluator';
     import { Chats, DB, locales } from '../../db/Database';
     import { isAudience, isFlagged } from '../../models/Moderation';
     import { getUser } from '../project/Contexts';
     import Link from './Link.svelte';
-    import { navigating } from '$app/stores';
+    import { navigating } from '$app/state';
     import Spinning from './Spinning.svelte';
     import { toStage } from '@output/Stage';
     import { EXCEPTION_SYMBOL, PHRASE_SYMBOL } from '@parser/Symbols';
@@ -135,7 +136,7 @@
                             >&mdash;</em
                         >{:else}
                         {project.getName()}{/if}</Link
-                >{#if $navigating && `${$navigating.to?.url.pathname}${$navigating.to?.url.search}` === path}
+                >{#if navigating && `${navigating.to?.url.pathname}${navigating.to?.url.search}` === path}
                     <Spinning />{:else}{@render children?.()}{/if}{/if}
             {#if unread}<div class="notification">{PHRASE_SYMBOL}</div
                 >{/if}</div