From 49b029d60a0ad90057e5f5431f599a8e6d5d4458 Mon Sep 17 00:00:00 2001
From: syntaxbullet <syntaxbullet@protonmail.com>
Date: Sat, 11 Jul 2026 11:38:59 +0200
Subject: [PATCH] feat: update project name to 'image-studio' and enhance
 document title in App component

---
 bun.lock     |  2 +-
 package.json |  2 +-
 view/App.tsx | 10 +++++++++-
 3 files changed, 11 insertions(+), 3 deletions(-)

diff --git a/bun.lock b/bun.lock
index 5cfe9fb..d17d7e1 100644
--- a/bun.lock
+++ b/bun.lock
@@ -3,7 +3,7 @@
   "configVersion": 1,
   "workspaces": {
     "": {
-      "name": "bun-react-template",
+      "name": "image-studio",
       "dependencies": {
         "@phosphor-icons/react": "^2.1.10",
         "@radix-ui/react-slot": "^1.2.3",
diff --git a/package.json b/package.json
index 3253e10..aac2bf8 100644
--- a/package.json
+++ b/package.json
@@ -1,5 +1,5 @@
 {
-  "name": "bun-react-template",
+  "name": "image-studio",
   "version": "0.1.0",
   "private": true,
   "type": "module",
diff --git a/view/App.tsx b/view/App.tsx
index 1009c12..0add7f6 100644
--- a/view/App.tsx
+++ b/view/App.tsx
@@ -36,6 +36,10 @@ export function App({ app }: AppProps) {
   const chromaKeyOpen = workspace.panel === "chromaKey";
   const layersOpen = workspace.panel === "layers";
 
+  useEffect(() => {
+    window.document.title = `${document.name} — Image Studio`;
+  }, [document.name]);
+
   useEffect(() => {
     if (generateOpen) void app.workflows.generation.loadResources();
   }, [app.workflows.generation, generateOpen]);
@@ -157,7 +161,11 @@ export function App({ app }: AppProps) {
         closeLayers={closeLayers}
         documentActions={app.actions.document}
       />
-      <header className="pointer-events-none absolute inset-x-3 top-3 z-10 flex h-20 items-center justify-end gap-4 rounded-full px-4 text-white backdrop-blur-xl">
+      <header className="pointer-events-none absolute inset-x-3 top-3 z-10 flex h-20 items-center justify-between gap-4 rounded-full px-4 text-white backdrop-blur-xl">
+        <div className="min-w-0 pl-2">
+          <p className="text-[0.65rem] font-semibold uppercase tracking-[0.22em] text-white/45">Image Studio</p>
+          <h1 className="truncate text-sm font-semibold text-white/90" title={document.name}>{document.name}</h1>
+        </div>
         <div className="pointer-events-auto flex items-center gap-2">
           <button type="button" className="rounded-full border-0 bg-transparent p-0" onClick={openGenerate} aria-label="Open generation activity" title="Open generation activity">
             <GenerationJobStatus generation={generation} compact />