Fix infinite hydration loop and stabilize global store synchronization

- Refactored layouts to derive account data from stable props instead of reactive stores.
- Wrapped store updates in untrack() with deep equality guards to prevent infinite re-renders.
- Resolved duplicate untrack declarations and missing imports across the project.
- Added fetch safeguards to Element_data_store to prevent redundant API calls.
- Standardized hydration patterns to break circular dependencies during initial load.
This commit is contained in:
Scott Idem
2026-02-08 17:15:20 -05:00
parent 88bc18cf15
commit 718de1457d
33 changed files with 455 additions and 1567 deletions

View File

@@ -1,4 +1,5 @@
<script lang="ts">
import { untrack } from 'svelte';
let log_lvl: number = 0;
// *** Import Svelte specific
@@ -31,19 +32,32 @@
let { data, children }: Props = $props();
if (log_lvl > 1) {
console.log(`ae_idaa_recovery_meetings +layout.svelte`, data);
}
// NOTE: Derived from data.account_id (prop) instead of $slct.account_id (store)
// to prevent circular dependency loops during hydration.
let ae_acct = $derived(data[data.account_id]);
// *** Quickly pull out data from parent(s)
$slct.account_id = data.account_id;
$effect(() => {
if (log_lvl > 1) {
console.log(`ae_idaa_recovery_meetings +layout.svelte`, data);
}
let ae_acct = data[$slct.account_id];
if (log_lvl) {
console.log(`ae_acct = `, ae_acct);
}
// *** Quickly pull out data from parent(s)
untrack(() => {
$slct.account_id = data.account_id;
});
});
$idaa_slct.event_obj_li = ae_acct.slct.event_obj_li;
$effect(() => {
if (log_lvl) {
console.log(`ae_acct = `, ae_acct);
}
if (ae_acct) {
untrack(() => {
$idaa_slct.event_obj_li = ae_acct.slct.event_obj_li;
});
}
});
// $idaa_slct.event_id = ae_acct.slct.event_id; // Not set here yet.
// *** Set initial variables

View File

@@ -1,4 +1,5 @@
<script lang="ts">
import { untrack } from 'svelte';
interface Props {
/** @type {import('./$types').PageData} */
data: any;
@@ -10,7 +11,6 @@
// *** Import Svelte specific
import { page } from '$app/state';
import { browser } from '$app/environment';
import { untrack } from 'svelte';
// *** Import other supporting libraries
import { db_events } from '$lib/ae_events/db_events';

View File

@@ -42,7 +42,7 @@
import Help_tech from '$lib/app_components/e_app_help_tech.svelte';
// *** Quickly pull out data from parent(s)
let ae_acct = data[$slct.account_id];
let ae_acct = data[data.account_id];
if (log_lvl) {
console.log(`ae_acct = `, ae_acct);
}