diff --git a/packages/app-shell/src/views/studio-design/StudioDesignSurface.tsx b/packages/app-shell/src/views/studio-design/StudioDesignSurface.tsx
index 01304d60b..1ab1333d1 100644
--- a/packages/app-shell/src/views/studio-design/StudioDesignSurface.tsx
+++ b/packages/app-shell/src/views/studio-design/StudioDesignSurface.tsx
@@ -256,15 +256,24 @@ function PackageSwitcher({ packageId, tab }: { packageId: string; tab: string })
 
   React.useEffect(() => {
     let cancelled = false;
-    fetchPackages()
-      .then((parsed) => {
-        if (!cancelled) setPkgs(parsed);
-      })
-      .catch(() => {
-        /* leave null — switcher still works for navigation-free display */
-      });
+    const load = () => {
+      fetchPackages()
+        .then((parsed) => {
+          if (!cancelled) setPkgs(parsed);
+        })
+        .catch(() => {
+          /* leave null — switcher still works for navigation-free display */
+        });
+    };
+    load();
+    // Refresh the switcher list (and thus the top-bar package name) when a
+    // package is created or its manifest is edited elsewhere — PackageFormDialog
+    // dispatches `objectui:packages-changed` on create/edit. Without this the
+    // header showed the OLD name after a rename until a full page reload.
+    window.addEventListener('objectui:packages-changed', load);
     return () => {
       cancelled = true;
+      window.removeEventListener('objectui:packages-changed', load);
     };
   }, [packageId]);