From 5b79004946a1413df35ad0fe51004051fd525922 Mon Sep 17 00:00:00 2001
From: ernstmul <ernst.mulders@gmail.com>
Date: Fri, 23 May 2025 14:05:30 +0200
Subject: [PATCH] Keep editor page open when refreshing the page

---
 .../studio/artifact-[artifact]/+layout.svelte | 23 +++++++++++++++----
 1 file changed, 19 insertions(+), 4 deletions(-)

diff --git a/src/routes/(console)/project-[project]/studio/artifact-[artifact]/+layout.svelte b/src/routes/(console)/project-[project]/studio/artifact-[artifact]/+layout.svelte
index f23995cd3..e7a3146a3 100644
--- a/src/routes/(console)/project-[project]/studio/artifact-[artifact]/+layout.svelte
+++ b/src/routes/(console)/project-[project]/studio/artifact-[artifact]/+layout.svelte
@@ -29,13 +29,28 @@
     import { untrack } from 'svelte';
     import Debug from './debug.svelte';
     import { dev } from '$app/environment';
+    import { goto } from '$app/navigation';
 
     const { children, data } = $props();
 
-    let view: 'preview' | 'editor' = $state('preview');
+    let view: 'preview' | 'editor' = $state(
+        page.url.searchParams.has('code') ? 'editor' : 'preview'
+    );
 
     let debug = $state(false);
 
+    function changeView(newView: 'preview' | 'editor') {
+        const newUrl = new URL(page.url.href);
+        if (newView === 'editor') {
+            newUrl.searchParams.set('code', '');
+            goto(newUrl.pathname + newUrl.search, { replaceState: true });
+        } else {
+            newUrl.searchParams.delete('code');
+            goto(newUrl.pathname + newUrl.search, { replaceState: true });
+        }
+        view = newView;
+    }
+
     $effect(() => {
         const { artifact } = page.params;
         untrack(() => studio.selectArtifact(artifact));
@@ -51,7 +66,7 @@
 
     let editorHeight = $derived(resizerTopPosition + 1);
     let terminalHeight = $derived(
-        layoutElement.offsetHeight - resizerTopPosition - terminalTabsHeight
+        layoutElement ? layoutElement.offsetHeight - resizerTopPosition - terminalTabsHeight : 0
     );
 
     $effect(() => {
@@ -192,12 +207,12 @@
                         <Tab
                             selected={view === 'preview'}
                             on:click={() => {
-                                view = 'preview';
+                                changeView('preview');
                             }}>Preview</Tab>
                         <Tab
                             selected={view === 'editor'}
                             on:click={() => {
-                                view = 'editor';
+                                changeView('editor');
                             }}>Code</Tab>
                     </Tabs>
                 </Layout.Stack>