From 83ccff6cb0ff2e7e51edd180b05aa63b966ba2c3 Mon Sep 17 00:00:00 2001
From: Torsten Dittmann <torsten.dittmann@googlemail.com>
Date: Fri, 16 May 2025 18:35:33 +0200
Subject: [PATCH] Fix editor file handling and add UI improvements

Enable empty code files, normalize paths, mark currentFile as reactive,
and convert editor styles to SCSS
---
 src/lib/components/editor/editor.svelte                    | 4 ++--
 src/lib/components/studio/studio.svelte.ts                 | 2 +-
 .../studio/artifact-[artifact]/code.svelte                 | 7 ++++---
 3 files changed, 7 insertions(+), 6 deletions(-)

diff --git a/src/lib/components/editor/editor.svelte b/src/lib/components/editor/editor.svelte
index a5b2956a4..7ae0c8e6d 100644
--- a/src/lib/components/editor/editor.svelte
+++ b/src/lib/components/editor/editor.svelte
@@ -14,7 +14,7 @@
     let editorElement: HTMLDivElement;
 
     export function openFile(code: string, path: string) {
-        if (!code || path.endsWith('/')) return;
+        if (path.endsWith('/')) return;
         const uri = monaco.Uri.parse(path);
         const model = monaco.editor.getModel(uri) ?? monaco.editor.createModel(code, null, uri);
         model.setValue(code);
@@ -68,7 +68,7 @@
 
 <div class="editor" role="presentation" bind:this={editorElement}></div>
 
-<style>
+<style lang="scss">
     .editor {
         height: 100%;
         overflow: hidden;
diff --git a/src/lib/components/studio/studio.svelte.ts b/src/lib/components/studio/studio.svelte.ts
index 00f46ff8d..7ec41f7a0 100644
--- a/src/lib/components/studio/studio.svelte.ts
+++ b/src/lib/components/studio/studio.svelte.ts
@@ -17,7 +17,7 @@ class Studio {
     terminals = new SvelteMap<symbol, Synapse>();
     activeTerminal = $state(this.mainTerminalId);
     filesystem: SvelteSet<string> = $state(new SvelteSet());
-    currentFile: string | null = null;
+    currentFile: string | null = $state(null);
     openFiles: SvelteSet<string> = $state(new SvelteSet());
     synapse: Synapse;
     editor: monaco.editor.IStandaloneCodeEditor;
diff --git a/src/routes/(console)/project-[project]/studio/artifact-[artifact]/code.svelte b/src/routes/(console)/project-[project]/studio/artifact-[artifact]/code.svelte
index a8dba5261..edabc02d8 100644
--- a/src/routes/(console)/project-[project]/studio/artifact-[artifact]/code.svelte
+++ b/src/routes/(console)/project-[project]/studio/artifact-[artifact]/code.svelte
@@ -12,11 +12,12 @@
     let mainRef: HTMLElement;
 
     studio.synapse.addEventListener('syncWorkDir', ({ message }) => {
-        if (studio.streaming) return;
+        if (studio.streaming === false) return;
         const { path, content, event } = message.data as SyncWorkDirData;
         if (event !== 'add' && event !== 'change') return;
-        studio.currentFile = path;
-        instance?.openFile(content, path);
+        const normalizedPath = path.startsWith('/') ? path.substring(1) : path;
+        studio.currentFile = normalizedPath;
+        instance?.openFile(content, normalizedPath);
     });
 
     async function openFile(path: string) {