feat(web): add responsive workbench navigation

apps/web_v1/src/pages/projects/project-rail.tsx

@@ -9,6 +9,8 @@ export function ProjectRail({
   activeProject,
   projects,
   activeView,
+  open,
+  onClose,
   onSelectWorkspace,
   onSelectWorkspaceExplore,
   onSelectProject,
@@ -17,27 +19,34 @@ export function ProjectRail({
   activeProject: Project
   projects: Project[]
   activeView: WorkbenchView
+  open: boolean
+  onClose: () => void
   onSelectWorkspace: () => void
   onSelectWorkspaceExplore: () => void
   onSelectProject: (project: Project) => void
   onCreateProject: () => void
 }) {
+  const selectAndClose = (action: () => void) => {
+    action()
+    onClose()
+  }
+
   return (
-    <Sider className="project-rail" width={96}>
-      <button className="rail-brand" aria-label="森林AI 工作台" title="森林AI 工作台" onClick={onSelectWorkspace}>
+    <Sider className={open ? 'project-rail open' : 'project-rail'} width={96}>
+      <button className="rail-brand" aria-label="森林AI 工作台" title="森林AI 工作台" onClick={() => selectAndClose(onSelectWorkspace)}>
         <img className="brand-icon" src="/senlinai-icon.svg" alt="" />
       </button>
       <Button
         className={activeView === 'workspace' ? 'dashboard-button active' : 'dashboard-button'}
         icon={<IconDashboard />}
-        onClick={onSelectWorkspace}
+        onClick={() => selectAndClose(onSelectWorkspace)}
         aria-label="工作台"
         title="工作台"
       />
       <Button
         className={activeView === 'workspace-explore' ? 'dashboard-button active' : 'dashboard-button'}
         icon={<IconCompass />}
-        onClick={onSelectWorkspaceExplore}
+        onClick={() => selectAndClose(onSelectWorkspaceExplore)}
         aria-label="探索"
         title="探索"
       />
@@ -46,7 +55,7 @@ export function ProjectRail({
           <Badge key={project.id} count={project.badge} dot={false} className={project.urgent ? 'project-badge urgent' : 'project-badge'}>
             <button
               className={activeView === 'project' && activeProject.id === project.id ? 'project-button active' : 'project-button'}
-              onClick={() => onSelectProject(project)}
+              onClick={() => selectAndClose(() => onSelectProject(project))}
               style={{ '--project-color': project.color } as CSSProperties}
               title={project.name}
             >
@@ -55,7 +64,7 @@ export function ProjectRail({
           </Badge>
         ))}
       </Space>
-      <Button className="create-project" aria-label="新建项目" icon={<IconPlus />} title="新建项目" onClick={onCreateProject} />
+      <Button className="create-project" aria-label="新建项目" icon={<IconPlus />} title="新建项目" onClick={() => selectAndClose(onCreateProject)} />
     </Sider>
   )
 }