From 6fb6593c2114fc05371aecf4e1e015b52c21e071 Mon Sep 17 00:00:00 2001
From: Maya <jovannmc@femboyfurry.net>
Date: Fri, 25 Jul 2025 14:40:00 +0300
Subject: [PATCH] fix: effects store race condition

---
 src/lib/animation/index.ts | 17 ++++++++---------
 src/routes/+layout.svelte  |  3 +++
 2 files changed, 11 insertions(+), 9 deletions(-)

diff --git a/src/lib/animation/index.ts b/src/lib/animation/index.ts
index 0c44dd0..004e4a3 100644
--- a/src/lib/animation/index.ts
+++ b/src/lib/animation/index.ts
@@ -12,15 +12,14 @@ import {
 let effectsEnabled = true;
 let isMobileDevice = false;
 
-// FIXME: there is sometimes an issue in dev where subscribing to the store just breaks everything? (.subscribe() not existing on effects, somehow)
-// you gotta restart the dev server to fix and it only seems to happen in dev. somehow effects being called before its defined?
-effects.subscribe((value) => {
-	effectsEnabled = value;
-});
-
-isMobile.subscribe((value) => {
-	isMobileDevice = value;
-});
+export function initStores() {
+	effects.subscribe((value) => {
+		effectsEnabled = value;
+	});
+	isMobile.subscribe((value) => {
+		isMobileDevice = value;
+	});
+}
 
 export const transition =
 	"linear(0,0.006,0.025 2.8%,0.101 6.1%,0.539 18.9%,0.721 25.3%,0.849 31.5%,0.937 38.1%,0.968 41.8%,0.991 45.7%,1.006 50.1%,1.015 55%,1.017 63.9%,1.001)";
diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte
index dcdda5b..8f754d4 100644
--- a/src/routes/+layout.svelte
+++ b/src/routes/+layout.svelte
@@ -23,6 +23,7 @@
 	import "$lib/css/app.scss";
 	import { browser } from "$app/environment";
 	import { page } from "$app/state";
+	import { initStores as initAnimStores } from "$lib/animation/index.js";
 
 	let { children, data } = $props();
 	let enablePlausible = $state(false);
@@ -60,6 +61,8 @@
 	};
 
 	onMount(() => {
+		initAnimStores();
+
 		isMobile.set(window.innerWidth <= 768);
 		window.addEventListener("resize", () => {
 			isMobile.set(window.innerWidth <= 768);