From 08c1807992142dfece0a5cd616925041b49ee560 Mon Sep 17 00:00:00 2001
From: Saxon Fletcher <saxonafletcher@gmail.com>
Date: Thu, 30 Oct 2025 13:58:47 +1000
Subject: [PATCH] sidebar move up

---
 .../components/layouts/DefaultLayout.tsx      | 47 ++++++++++---------
 .../LayoutHeader/LayoutHeader.tsx             |  1 -
 .../layouts/ProjectLayout/ProjectLayout.tsx   |  5 +-
 apps/studio/state/sidebar-manager-state.tsx   | 10 ++--
 4 files changed, 33 insertions(+), 30 deletions(-)

diff --git a/apps/studio/components/layouts/DefaultLayout.tsx b/apps/studio/components/layouts/DefaultLayout.tsx
index b72a61f2152..8763b5e1b00 100644
--- a/apps/studio/components/layouts/DefaultLayout.tsx
+++ b/apps/studio/components/layouts/DefaultLayout.tsx
@@ -12,6 +12,7 @@ import { SidebarProvider } from 'ui'
 import { LayoutHeader } from './ProjectLayout/LayoutHeader'
 import MobileNavigationBar from './ProjectLayout/NavigationBar/MobileNavigationBar'
 import { ProjectContextProvider } from './ProjectLayout/ProjectContext'
+import { LayoutSidebarProvider } from './ProjectLayout/LayoutSidebar/LayoutSidebarProvider'
 
 export interface DefaultLayoutProps {
   headerTitle?: string
@@ -55,29 +56,31 @@ const DefaultLayout = ({
   return (
     <SidebarProvider defaultOpen={false}>
       <ProjectContextProvider projectRef={ref}>
-        <AppBannerContextProvider>
-          <div className="flex flex-col h-screen w-screen">
-            {/* Top Banner */}
-            <AppBannerWrapper />
-            <div className="flex-shrink-0">
-              <MobileNavigationBar hideMobileMenu={hideMobileMenu} />
-              <LayoutHeader
-                showProductMenu={showProductMenu}
-                headerTitle={headerTitle}
-                backToDashboardURL={
-                  router.pathname.startsWith('/account') ? backToDashboardURL : undefined
-                }
-              />
+        <LayoutSidebarProvider>
+          <AppBannerContextProvider>
+            <div className="flex flex-col h-screen w-screen">
+              {/* Top Banner */}
+              <AppBannerWrapper />
+              <div className="flex-shrink-0">
+                <MobileNavigationBar hideMobileMenu={hideMobileMenu} />
+                <LayoutHeader
+                  showProductMenu={showProductMenu}
+                  headerTitle={headerTitle}
+                  backToDashboardURL={
+                    router.pathname.startsWith('/account') ? backToDashboardURL : undefined
+                  }
+                />
+              </div>
+              {/* Main Content Area */}
+              <div className="flex flex-1 w-full overflow-y-hidden">
+                {/* Sidebar - Only show for project pages, not account pages */}
+                {!router.pathname.startsWith('/account') && <Sidebar />}
+                {/* Main Content */}
+                <div className="flex-grow h-full overflow-y-auto">{children}</div>
+              </div>
             </div>
-            {/* Main Content Area */}
-            <div className="flex flex-1 w-full overflow-y-hidden">
-              {/* Sidebar - Only show for project pages, not account pages */}
-              {!router.pathname.startsWith('/account') && <Sidebar />}
-              {/* Main Content */}
-              <div className="flex-grow h-full overflow-y-auto">{children}</div>
-            </div>
-          </div>
-        </AppBannerContextProvider>
+          </AppBannerContextProvider>
+        </LayoutSidebarProvider>
       </ProjectContextProvider>
     </SidebarProvider>
   )
diff --git a/apps/studio/components/layouts/ProjectLayout/LayoutHeader/LayoutHeader.tsx b/apps/studio/components/layouts/ProjectLayout/LayoutHeader/LayoutHeader.tsx
index 0ee870e3fe0..f4142e8ae02 100644
--- a/apps/studio/components/layouts/ProjectLayout/LayoutHeader/LayoutHeader.tsx
+++ b/apps/studio/components/layouts/ProjectLayout/LayoutHeader/LayoutHeader.tsx
@@ -70,7 +70,6 @@ const LayoutHeader = ({
   const { data: selectedOrganization } = useSelectedOrganizationQuery()
   const { setMobileMenuOpen } = useAppStateSnapshot()
   const gitlessBranching = useIsBranching2Enabled()
-  const { toggleSidebar } = useSidebarManagerSnapshot()
 
   const isAccountPage = router.pathname.startsWith('/account')
 
diff --git a/apps/studio/components/layouts/ProjectLayout/ProjectLayout.tsx b/apps/studio/components/layouts/ProjectLayout/ProjectLayout.tsx
index 507121413df..cb259ffca56 100644
--- a/apps/studio/components/layouts/ProjectLayout/ProjectLayout.tsx
+++ b/apps/studio/components/layouts/ProjectLayout/ProjectLayout.tsx
@@ -21,7 +21,6 @@ import { useEditorType } from '../editors/EditorsLayout.hooks'
 import BuildingState from './BuildingState'
 import ConnectingState from './ConnectingState'
 import { LayoutSidebar } from './LayoutSidebar'
-import { LayoutSidebarProvider } from './LayoutSidebar/LayoutSidebarProvider'
 import { LoadingState } from './LoadingState'
 import { ProjectPausedState } from './PausedState/ProjectPausedState'
 import { PauseFailedState } from './PauseFailedState'
@@ -216,9 +215,7 @@ export const ProjectLayout = forwardRef<HTMLDivElement, PropsWithChildren<Projec
                     )}
                   </main>
                 </ResizablePanel>
-                <LayoutSidebarProvider>
-                  <LayoutSidebar />
-                </LayoutSidebarProvider>
+                <LayoutSidebar />
               </ResizablePanelGroup>
             </ResizablePanel>
           </ResizablePanelGroup>
diff --git a/apps/studio/state/sidebar-manager-state.tsx b/apps/studio/state/sidebar-manager-state.tsx
index bb455845ec4..e0e48404090 100644
--- a/apps/studio/state/sidebar-manager-state.tsx
+++ b/apps/studio/state/sidebar-manager-state.tsx
@@ -151,12 +151,16 @@ export const useRegisterSidebar = (
   )
 
   useEffect(() => {
-    const { registerSidebar, unregisterSidebar } = sidebarManagerState
+    const { registerSidebar, unregisterSidebar, sidebars } = sidebarManagerState
 
-    registerSidebar(id, component, handlers)
+    if (!sidebars[id]) {
+      registerSidebar(id, component, handlers)
+    }
 
     return () => {
-      unregisterSidebar(id)
+      if (sidebars[id]) {
+        unregisterSidebar(id)
+      }
     }
   }, [id])