add mode to ctx

frontend/src/lib/components/apps/editor/AppEditor.svelte

@@ -75,7 +75,8 @@
 		username: $userStore?.username,
 		query: Object.fromEntries($page.url.searchParams.entries()),
 		hash: $page.url.hash,
-		workspace: $workspaceStore
+		workspace: $workspaceStore,
+		mode: 'editor'
 	}
 
 	const worldStore = buildWorld(context)
@@ -135,7 +136,8 @@
 		context = context
 	}
 
-	$: previewing = $mode === 'preview'
+	$: context.mode = $mode == 'dnd' ? 'editor' : 'viewer'
+
 	$: width = $breakpoint === 'sm' ? 'min-w-[400px] max-w-[656px]' : 'min-w-[710px] w-full'
 
 	let selectedTab: 'insert' | 'settings' = 'insert'
@@ -207,7 +209,7 @@
 			<AppEditorHeader {policy} {fromHub} />
 		{/if}
 
-		{#if previewing}
+		{#if $mode === 'preview'}
 			<SplitPanesWrapper>
 				<div
 					class={twMerge('h-full w-full', $appStore.css?.['app']?.['viewer']?.class)}

frontend/src/lib/components/apps/editor/AppPreview.svelte

@@ -48,9 +48,16 @@
 
 	const allIdsInPath = writable<string[]>([])
 
+	let ncontext: any = { ...context, workspace, mode: 'viewer' }
+
+	function hashchange(e: HashChangeEvent) {
+		ncontext.hash = e.newURL.split('#')[1]
+		ncontext = ncontext
+	}
+
 	const parentWidth = writable(0)
 	setContext<AppViewerContext>('AppViewerContext', {
-		worldStore: buildWorld(context),
+		worldStore: buildWorld(ncontext),
 		initialized: writable({ initialized: false, initializedComponents: [] }),
 		app: appStore,
 		summary: writable(summary),
@@ -77,13 +84,6 @@
 		allIdsInPath
 	})
 
-	let ncontext: any = { ...context, workspace }
-
-	function hashchange(e: HashChangeEvent) {
-		ncontext.hash = e.newURL.split('#')[1]
-		ncontext = ncontext
-	}
-
 	let previousSelectedIds: string[] | undefined = undefined
 	$: if (!deepEqual(previousSelectedIds, $selectedComponent)) {
 		previousSelectedIds = $selectedComponent