From fc73108b07e61ab0159ada120f2fb60c430b1d4c Mon Sep 17 00:00:00 2001
From: Owen Jacobson <owen@grimoire.ca>
Date: Tue, 5 Nov 2024 19:25:20 -0500
Subject: Move `showMenu` out of globals and into page state.

I generally don't love globals, and the scope of this global is pretty narrow. Let's use the context hierarchy for this, instead.

(Kit mentioned that it might be possible to use CSS variables for this.)
---
 ui/routes/(app)/+layout.svelte | 7 ++++---
 1 file changed, 4 insertions(+), 3 deletions(-)

(limited to 'ui/routes/(app)/+layout.svelte')

diff --git a/ui/routes/(app)/+layout.svelte b/ui/routes/(app)/+layout.svelte
index ae3dc6a..0a8c58d 100644
--- a/ui/routes/(app)/+layout.svelte
+++ b/ui/routes/(app)/+layout.svelte
@@ -1,16 +1,17 @@
 <script>
   import { page } from '$app/stores';
   import { goto } from '$app/navigation';
-  import { onMount, onDestroy } from 'svelte';
+  import { onMount, onDestroy, getContext } from 'svelte';
 
   import { boot, subscribeToEvents } from '$lib/apiServer';
-  import { showMenu, currentUser, logins, channelsList, messages } from '$lib/store';
+  import { currentUser, logins, channelsList, messages } from '$lib/store';
 
   import ChannelList from '$lib/components/ChannelList.svelte';
   import CreateChannelForm from '$lib/components/CreateChannelForm.svelte';
 
   let events = null;
 
+  let pageContext = getContext('page');
   let { children } = $props();
   let loading = $state(true);
   let channel = $derived($page.params.channel);
@@ -62,7 +63,7 @@
   <h2>Loading&hellip;</h2>
 {:else}
   <div id="interface" class="p-2">
-    <nav id="sidebar" data-expanded={$showMenu}>
+    <nav id="sidebar" data-expanded={pageContext.showMenu}>
       <div class="channel-list">
         <ChannelList active={channel} channels={$channelsList.channels} />
       </div>
-- 
cgit v1.2.3