134 improvement add a button that allows closing the sidebar (#135)

* Enhance sidebar navigation and layout configuration

- Added support for configurable sidebar collapsed style
- Updated layout components to use new sidebar configuration
- Added environment variable for sidebar trigger display
- Simplified page header and navigation components
- Improved sidebar responsiveness and user experience

* Refactor admin account page layout and action buttons

- Moved action buttons from sidebar to PageHeader for both personal and team account pages
- Updated button variants and styling for better visual hierarchy
- Improved spacing and layout of account page components
- Added border to PageHeader for better visual separation

* Update version updater dialog styling

- Replaced `space-x-4` with `gap-x-2` for better spacing
- Wrapped translation text in a `span` for improved layout
- Maintained consistent icon and text alignment in dialog title

* Refactor sidebar state management and configuration

- Simplified sidebar context and removed minimized state
- Updated layout components to use new sidebar open/closed state
- Modified sidebar navigation to handle collapsed state dynamically
- Added environment variable for sidebar trigger and collapsed style
- Improved sidebar responsiveness and rendering logic

* Remove sidebar configuration and environment variables

- Simplified sidebar context by removing `minimized` state in components
- Updated account selector components to use simplified sidebar state
- Removed unused helper functions in sidebar implementation

apps/web/app/admin/layout.tsx

@@ -1,4 +1,9 @@
+import { use } from 'react';
+
+import { cookies } from 'next/headers';
+
 import { Page, PageMobileNavigation, PageNavigation } from '@kit/ui/page';
+import { SidebarProvider } from '@kit/ui/shadcn-sidebar';
 
 import { AdminSidebar } from '~/admin/_components/admin-sidebar';
 import { AdminMobileNavigation } from '~/admin/_components/mobile-navigation';
@@ -10,17 +15,30 @@ export const metadata = {
 export const dynamic = 'force-dynamic';
 
 export default function AdminLayout(props: React.PropsWithChildren) {
+  const state = use(getLayoutState());
+
   return (
-    <Page style={'sidebar'}>
-      <PageNavigation>
-        <AdminSidebar />
-      </PageNavigation>
+    <SidebarProvider defaultOpen={state.open}>
+      <Page style={'sidebar'}>
+        <PageNavigation>
+          <AdminSidebar />
+        </PageNavigation>
 
-      <PageMobileNavigation>
-        <AdminMobileNavigation />
-      </PageMobileNavigation>
+        <PageMobileNavigation>
+          <AdminMobileNavigation />
+        </PageMobileNavigation>
 
-      {props.children}
-    </Page>
+        {props.children}
+      </Page>
+    </SidebarProvider>
   );
 }
+
+async function getLayoutState() {
+  const cookieStore = await cookies();
+  const sidebarOpenCookie = cookieStore.get('sidebar:state');
+
+  return {
+    open: sidebarOpenCookie?.value !== 'true',
+  };
+}