+page.server.js and writable stores, load always re-run

[fabienc974]

Hi all,
I'm doing my app from scratch with latest sveltekit.

I have an issue with the load function in my +page.server.js which always re-run when I visit my +page.svelte
I've read the doc and it says that the load function won't re-run except in specific case : https://kit.svelte.dev/docs/load#invalidation
I'm think I'm not in any of these cases.

What I do is :

1. +page.server.js (organisation/+page.server.js)

• Load the datas from bdd via graphql queries (/lib/qraphql/organisation-gql.js)
• Send back the datas to my +page.svelte

``
// imports
import { read } from '$lib/graphql/organisation-gql';
import { error } from '@sveltejs/kit';

// variables
export const load = async (
/** @type {{ locals: { jwt: any; id: any; username: any; }; }} */ event
) => {
// récupération des données de sessions
const { jwt, id, username } = event.locals;

// fetch des datas de l'organisation
try {
	const getData = async () => {
		return await read(event.locals);
	};

	const datas = await getData();
	console.log('organisation ===> ', datas.body.organizations.data[0].attributes.users.data);
	return {organisation:datas.body.organizations.data[0].attributes.users.data};
} catch (err) {
	throw error(404, 'Impossible de récupérer les données');
}

// retour des données

};
``

2. +page.js

• When I get the datas, I init my store with the values and display the datas

`<script>
// imports
import Slotter from '$lib/ui/back/Slotter.svelte';
import { organisationStore } from '$lib/store/organisation-store';

// variables
export let data;

// envoie des datas dans le store init
let o = data.organisation;

organisationStore.init(o);
$: organisation = $organisationStore;

</script>

Données sur l'entreprise

{JSON.stringify(organisation)} `

But, when I navigate my site, if I navigate to my organisation page, I'm not getting the datas from the store, but from the load function which re-runs again;

To be sure my store was populated with datas, I call it in integration page, and the datas loaded from the store as expected, without new query. (To make this example work, I first need to visit my organisation page, otherwise the store will never be instantiated with initial values, and my integration page will throw an error.)

////// tested another way
I've tested another approach, without +page.server.js on other pages of my project

1. +page.svelte

• I directly call my store, and I fetch datas from my store.
  Problem is, when the page load/shows, I should await the datas to be fetched before rendering it for the first time.
  When I navigate again, datas are gathered from the store.

(In the following page, the store has already been called in my +layout.svelte)

`

<script> // imports import { integrationStore } from '$lib/store/integration-store'; import IntegrationTable from '$lib/ui/back/account/IntegrationTable.svelte'; import Slotter from '$lib/ui/back/Slotter.svelte'; // variables // functions //reactives $: elem = $integrationStore; </script> {#if elem.length !== 0} {:else} Loading... {/if} `

I don't know which approach is better.
I'll prefer the first approach with the load function, but I don't know how to stop it to re-runs.

If you have a better idea !

Thanks for your help