About the new updated from $app/state

[frederikhors]

Right now I'm using this:

• +layout.svelte:

<script lang="ts">
    import { getStores, page } from '$app/stores';

    const { updated } = getStores();

    onMount(() => callMe(updated));
</script>

• custom.ts:

function callMe(updated: Readable<boolean>): Promise<void> {
    // other code here
    
    const sw_registration = await navigator.serviceWorker.getRegistration();

    // other code here

    updated.subscribe(async (value) => {
        if (!value) return;

        if (sw_registration) {
            await sw_registration.update();
        } else {
            update_app();
        }
    });
}

And this is super useful.

Now from kit@2.12.0 $app/stores's updated is deprecated and we should use $app/state's updated instead. Good.

But how to use it?

Should I use an $effect? But I can only use the $effect inside a .svelte file, right?

Another way?

[brunnerh]

You can use $effect (and any other rune) in JS/TS files that have .svelte. in the name, e.g. custom.svelte.ts.

import { updated } from '$app/state';

export function watchUpdated() {
  $effect(() => {
    if (updated.current) {
      // do something
    }
  });
}