Sveltekit is not reactive when navigating through slug page

When I navigate through [slug] pages, the content does not update although +page.server.ts is correctly called.

I understand this is an expected behavior and that the solution is to use "$:" to listen to change and reevaluate the statement, but this does not work.

Any idea ?

+page.server.ts

import { getPage } from '$lib/services/pages';
export async function load({params}) {
    const page = await getPage(params.slug)
    return { page };
} 

+page.svelte

<script>
    import Editor from '$lib/editor/index.svelte'
    export let data;
    // This is the solution found on similar question but this does not work
    $: content = data.page.text
    // But this works 
    $: console.log(data.page.text)

</script>

<Editor {content}></Editor>

Note: Navigation is made with simple <a> tag on +layout.svelte

EDIT: the Editor component is actually a copy of this tiptap svelte example except the content is passed through the parent.

Thank you

Likely you have a similar error in the Editor component.
Some things you can try

add the following, it will make a dump of your text on screen and should change

<pre>{JSON.stringify(content, null, 2)}</pre>

force the Editor component to remount by using #key, this likely works but it might be better to fix the component itself depending on your needs.

{#key content}
  <Editor {content} />
{/key}

I'm no expert, but I recently had a similar/same problem. The trick seems to be to add parentheses. Like this:

 $: (content = data.page.text)