mirror of
https://github.com/siteboon/claudecodeui.git
synced 2026-06-28 15:25:27 +08:00
refactor: use shared props for Sidebar props in AppContent
This commit is contained in:
83
src/App.jsx
83
src/App.jsx
@@ -18,7 +18,7 @@
|
|||||||
* Handles both existing sessions (with real IDs) and new sessions (with temporary IDs).
|
* Handles both existing sessions (with real IDs) and new sessions (with temporary IDs).
|
||||||
*/
|
*/
|
||||||
|
|
||||||
import React, { useState, useEffect, useCallback, useRef } from 'react';
|
import React, { useState, useEffect, useCallback, useRef, useMemo } from 'react';
|
||||||
import { BrowserRouter as Router, Routes, Route, useNavigate, useParams } from 'react-router-dom';
|
import { BrowserRouter as Router, Routes, Route, useNavigate, useParams } from 'react-router-dom';
|
||||||
import Sidebar from './components/Sidebar';
|
import Sidebar from './components/Sidebar';
|
||||||
import MainContent from './components/MainContent';
|
import MainContent from './components/MainContent';
|
||||||
@@ -571,6 +571,54 @@ function AppContent() {
|
|||||||
}
|
}
|
||||||
}, []);
|
}, []);
|
||||||
|
|
||||||
|
const handleShowSettings = useCallback(() => {
|
||||||
|
setShowSettings(true);
|
||||||
|
}, []);
|
||||||
|
|
||||||
|
const handleCollapseSidebar = useCallback(() => {
|
||||||
|
setPreference('sidebarVisible', false);
|
||||||
|
}, [setPreference]);
|
||||||
|
|
||||||
|
const handleExpandSidebar = useCallback(() => {
|
||||||
|
setPreference('sidebarVisible', true);
|
||||||
|
}, [setPreference]);
|
||||||
|
|
||||||
|
const sidebarSharedProps = useMemo(() => ({
|
||||||
|
projects,
|
||||||
|
selectedProject,
|
||||||
|
selectedSession,
|
||||||
|
onProjectSelect: handleProjectSelect,
|
||||||
|
onSessionSelect: handleSessionSelect,
|
||||||
|
onNewSession: handleNewSession,
|
||||||
|
onSessionDelete: handleSessionDelete,
|
||||||
|
onProjectDelete: handleProjectDelete,
|
||||||
|
isLoading: isLoadingProjects,
|
||||||
|
loadingProgress,
|
||||||
|
onRefresh: handleSidebarRefresh,
|
||||||
|
onShowSettings: handleShowSettings,
|
||||||
|
isPWA,
|
||||||
|
isMobile,
|
||||||
|
onToggleSidebar: handleCollapseSidebar,
|
||||||
|
onExpandSidebar: handleExpandSidebar
|
||||||
|
}), [
|
||||||
|
projects,
|
||||||
|
selectedProject,
|
||||||
|
selectedSession,
|
||||||
|
handleProjectSelect,
|
||||||
|
handleSessionSelect,
|
||||||
|
handleNewSession,
|
||||||
|
handleSessionDelete,
|
||||||
|
handleProjectDelete,
|
||||||
|
isLoadingProjects,
|
||||||
|
loadingProgress,
|
||||||
|
handleSidebarRefresh,
|
||||||
|
handleShowSettings,
|
||||||
|
isPWA,
|
||||||
|
isMobile,
|
||||||
|
handleCollapseSidebar,
|
||||||
|
handleExpandSidebar
|
||||||
|
]);
|
||||||
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="fixed inset-0 flex bg-background">
|
<div className="fixed inset-0 flex bg-background">
|
||||||
@@ -582,23 +630,8 @@ function AppContent() {
|
|||||||
}`}
|
}`}
|
||||||
>
|
>
|
||||||
<Sidebar
|
<Sidebar
|
||||||
projects={projects}
|
{...sidebarSharedProps}
|
||||||
selectedProject={selectedProject}
|
|
||||||
selectedSession={selectedSession}
|
|
||||||
onProjectSelect={handleProjectSelect}
|
|
||||||
onSessionSelect={handleSessionSelect}
|
|
||||||
onNewSession={handleNewSession}
|
|
||||||
onSessionDelete={handleSessionDelete}
|
|
||||||
onProjectDelete={handleProjectDelete}
|
|
||||||
isLoading={isLoadingProjects}
|
|
||||||
loadingProgress={loadingProgress}
|
|
||||||
onRefresh={handleSidebarRefresh}
|
|
||||||
onShowSettings={() => setShowSettings(true)}
|
|
||||||
isPWA={isPWA}
|
|
||||||
isMobile={isMobile}
|
|
||||||
onToggleSidebar={() => setPreference('sidebarVisible', false)}
|
|
||||||
isCollapsed={!sidebarVisible}
|
isCollapsed={!sidebarVisible}
|
||||||
onExpandSidebar={() => setPreference('sidebarVisible', true)}
|
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
@@ -629,21 +662,7 @@ function AppContent() {
|
|||||||
onTouchStart={(e) => e.stopPropagation()}
|
onTouchStart={(e) => e.stopPropagation()}
|
||||||
>
|
>
|
||||||
<Sidebar
|
<Sidebar
|
||||||
projects={projects}
|
{...sidebarSharedProps}
|
||||||
selectedProject={selectedProject}
|
|
||||||
selectedSession={selectedSession}
|
|
||||||
onProjectSelect={handleProjectSelect}
|
|
||||||
onSessionSelect={handleSessionSelect}
|
|
||||||
onNewSession={handleNewSession}
|
|
||||||
onSessionDelete={handleSessionDelete}
|
|
||||||
onProjectDelete={handleProjectDelete}
|
|
||||||
isLoading={isLoadingProjects}
|
|
||||||
loadingProgress={loadingProgress}
|
|
||||||
onRefresh={handleSidebarRefresh}
|
|
||||||
onShowSettings={() => setShowSettings(true)}
|
|
||||||
isPWA={isPWA}
|
|
||||||
isMobile={isMobile}
|
|
||||||
onToggleSidebar={() => setPreference('sidebarVisible', false)}
|
|
||||||
isCollapsed={false}
|
isCollapsed={false}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
Reference in New Issue
Block a user