- Updated CLAUDE.md to reflect new AI agent team capabilities and features, including real-time task management and built-in code editor. - Refactored PaneContainer to simplify drag-and-drop functionality by lifting DnD context to TabbedLayout. - Removed SidebarHeader component and integrated its functionality into Sidebar for a cleaner layout. - Enhanced Sidebar with a collapse button and improved task/session navigation. - Updated TabBar to streamline tab management and improve user interaction. - Introduced new drag-and-drop handling in TabbedLayout for better user experience across panes.
26 lines
777 B
TypeScript
26 lines
777 B
TypeScript
/**
|
|
* PaneContainer - Horizontal flex container that renders panes side by side.
|
|
* DndContext is owned by TabbedLayout (parent) for cross-component tab DnD.
|
|
*/
|
|
|
|
import { Fragment } from 'react';
|
|
|
|
import { useStore } from '@renderer/store';
|
|
|
|
import { PaneResizeHandle } from './PaneResizeHandle';
|
|
import { PaneView } from './PaneView';
|
|
|
|
export const PaneContainer = (): React.JSX.Element => {
|
|
const panes = useStore((s) => s.paneLayout.panes);
|
|
|
|
return (
|
|
<div id="pane-container" className="flex flex-1 overflow-hidden">
|
|
{panes.map((pane, i) => (
|
|
<Fragment key={pane.id}>
|
|
{i > 0 && <PaneResizeHandle leftPaneId={panes[i - 1].id} rightPaneId={pane.id} />}
|
|
<PaneView paneId={pane.id} />
|
|
</Fragment>
|
|
))}
|
|
</div>
|
|
);
|
|
};
|