diff --git a/frontend/src/app/DocumentsLayout.jsx b/frontend/src/app/DocumentsLayout.jsx index f83fad9..202c16c 100644 --- a/frontend/src/app/DocumentsLayout.jsx +++ b/frontend/src/app/DocumentsLayout.jsx @@ -1,11 +1,15 @@ import React from 'react'; import Sidebar from '../sidebar/Sidebar'; +import { useSidebarContext } from '../sidebar/SidebarContext'; -const DocumentsLayout = ({ sidebarProps, children, sidebarCollapsed }) => ( -
- {!sidebarCollapsed ? : null} - {children} -
-); +const DocumentsLayout = ({ sidebarProps, children }) => { + const { collapsed } = useSidebarContext(); + return ( +
+ {!collapsed ? : null} + {children} +
+ ); +}; export default DocumentsLayout; diff --git a/frontend/src/app/DocumentsRoute.jsx b/frontend/src/app/DocumentsRoute.jsx index 203b019..e54a2a9 100644 --- a/frontend/src/app/DocumentsRoute.jsx +++ b/frontend/src/app/DocumentsRoute.jsx @@ -1,12 +1,13 @@ -import React, { useCallback, useMemo, useState } from 'react'; +import React, { useCallback, useMemo } from 'react'; import { useNavigate } from 'react-router-dom'; import { useAppShell } from '../appShellContext'; import DocumentsLayout from './DocumentsLayout'; import { useWorkspaceSurface } from './useWorkspaceSurface'; import PanelHeader from '../ui/PanelHeader'; import BreadcrumbTrail from '../ui/BreadcrumbTrail'; +import { SidebarProvider, useSidebarContext } from '../sidebar/SidebarContext'; -const DocumentsRoute = () => { +const DocumentsRouteContent = () => { const { sidebarProps, documentsTableProps, @@ -28,19 +29,17 @@ const DocumentsRoute = () => { notifyApiError, } = useAppShell(); const navigate = useNavigate(); + const { collapsed: sidebarCollapsed, setCollapsed } = useSidebarContext(); - const [sidebarCollapsed, setSidebarCollapsed] = useState(false); - const collapseSidebar = useCallback(() => setSidebarCollapsed(true), []); - const expandSidebar = useCallback(() => setSidebarCollapsed(false), []); + const expandSidebar = useCallback(() => setCollapsed(false), [setCollapsed]); const sidebarPropsWithActions = useMemo( () => ({ ...sidebarProps, onManageTags: openTagsModal, onManageCorrespondents: openCorrespondentsModal, - onCollapse: collapseSidebar, }), - [sidebarProps, openTagsModal, openCorrespondentsModal, collapseSidebar], + [sidebarProps, openTagsModal, openCorrespondentsModal], ); const breadcrumbs = documentsTableProps?.breadcrumbs || null; @@ -93,10 +92,7 @@ const DocumentsRoute = () => { if (!surface) { return ( - +
@@ -142,10 +138,7 @@ const DocumentsRoute = () => { } return ( - +
{header ? ( { ); }; +const DocumentsRoute = () => ( + + + +); + export default DocumentsRoute; diff --git a/frontend/src/sidebar/Sidebar.jsx b/frontend/src/sidebar/Sidebar.jsx index 8413413..212535d 100644 --- a/frontend/src/sidebar/Sidebar.jsx +++ b/frontend/src/sidebar/Sidebar.jsx @@ -21,6 +21,7 @@ import PanelHeader from '../ui/PanelHeader'; import useFloatingMenu from '../ui/useFloatingMenu'; import { getTagColorStyle } from '../utils/colors'; +import { useSidebarContext } from './SidebarContext'; const FolderNode = ({ node, @@ -177,13 +178,16 @@ const Sidebar = ({ isFilterActive, onLogout, status, - onCollapse, tenantName, tenants = [], activeTenantId = null, onSelectTenant, onOpenSettings, }) => { + const { setCollapsed } = useSidebarContext(); + const handleCollapse = useCallback(() => { + setCollapsed(true); + }, [setCollapsed]); const neutralHueInputId = useId(); const sortedCorrespondents = useMemo(() => { if (!Array.isArray(correspondents)) { @@ -504,14 +508,14 @@ const Sidebar = ({ )} actions={ - onCollapse + handleCollapse ? [ (