problem: can't see devmode

src/components/Menu.svelte

@@ -19,7 +19,7 @@
 	let iconClass = 'h-5 w-5 md:h-4 md:w-4';
 
 	$: getClass = (menuItem: string) => {
-		if ($page.url.pathname.startsWith(`/${menuItem}`)) {
+		if ($page.url.pathname.startsWith(`/${menuItem}`) || (menuItem == 'dev' && $devmode)) {
 			return 'flex items-center gap-3 rounded-lg bg-muted px-3 py-2 text-primary transition-all hover:text-primary';
 		} else {
 			return 'flex items-center gap-3 rounded-lg px-3 py-2 text-muted-foreground transition-all hover:text-primary';
@@ -77,5 +77,5 @@
 	}}
 >
 	<Code class={iconClass} />
-	Toggle Dev Mode
+	Dev Mode
 </a>

src/components/MeritSummaryCard.svelte

@@ -17,7 +17,7 @@
 	import { goto } from '$app/navigation';
 	import { base } from '$app/paths';
 	import { Alert } from '@/components/ui/alert';
-	import { currentUser } from '@/stores/session';
+	import { currentUser, devmode } from '@/stores/session';
 	import MeritComment from './MeritComment.svelte';
 	import { Description } from 'formsnap';
 
@@ -222,9 +222,10 @@
 				</Table.Body>
 			</Table.Root>
 		</div>
-		<a href="#" class="text-xs" on:click={() => console.log(merit.Event.rawEvent())}
+		{#if $devmode}
-			>print to console</a
+			<a href="#" class="text-xs" on:click={() => console.log(merit.Event.rawEvent())}
-		></Card.Content
+				>print to console</a
+			>{/if}</Card.Content
 	>
 
 	<Card.Footer class="flex flex-row justify-center border-t px-6 py-3 text-center {background}">

src/components/RocketCard.svelte

@@ -5,6 +5,7 @@
 	import * as Card from '$lib/components/ui/card/index.js';
 	import type { Rocket } from '@/event_helpers/rockets';
 	import { ndk } from '@/ndk';
+	import { devmode } from '@/stores/session';
 	import { Avatar, Name } from '@nostr-dev-kit/ndk-svelte-components';
 	import { ChevronRight } from 'lucide-svelte';
 
@@ -30,12 +31,13 @@
 	</Card.Content>
 	<Card.Footer>
 		<div class="flex flex-wrap justify-between gap-2 lg:gap-1">
-			<Button
+			{#if $devmode}
-				on:click={() => {
+				<Button
-					console.log(rocket.Event.rawEvent());
+					on:click={() => {
-				}}
+						console.log(rocket.Event.rawEvent());
-				variant="outline">Print to Console</Button
+					}}
-			>
+					variant="outline">Print to Console</Button
+				>{/if}
 			<Button
 				on:click={() => {
 					goto(`${base}/rockets/${rocket.URL()}`);

src/components/RocketDashboard.svelte

@@ -11,6 +11,7 @@
 	import ProposedProducts from './ProposedProducts.svelte';
 	import Todo from './Todo.svelte';
 	import UpdateMission from './UpdateMission.svelte';
+	import { devmode } from '@/stores/session';
 
 	export let rocket: NDKEvent;
 
@@ -45,11 +46,12 @@
 				<Card.Title class="pb-4">Actions</Card.Title>
 				<Card.Description class="flex flex-wrap gap-2">
 					<UpdateMission rocketEvent={rocket} />
-					<Button
+					{#if $devmode}
-						on:click={() => {
+						<Button
-							console.log(rocket.rawEvent());
+							on:click={() => {
-						}}>Print to Console</Button
+								console.log(rocket.rawEvent());
-					>
+							}}>Print to Console</Button
+						>{/if}
 				</Card.Description>
 			</Card.Header>
 			<Card.Footer></Card.Footer>