refactor: isolate chat hot paths and lazy server watchers

Split static history from live tail, stabilize chat data identities, and reduce scroll-shell churn so old viewport content stops waking on stream deltas. Also defer watcher startup and health polling so idle runtime work better matches actual usage.
This commit is contained in:
Bohdan Triapitsyn
2026-04-05 15:36:11 +03:00
parent fc44465c00
commit 4663abd6f3
17 changed files with 1053 additions and 306 deletions
+3 -4
View File
@@ -21,7 +21,7 @@ import { DiffIcon } from '@/components/icons/DiffIcon';
import { useUIStore, type MainTab } from '@/stores/useUIStore';
import { useConfigStore } from '@/stores/useConfigStore';
import { useSessionUIStore } from '@/sync/session-ui-store';
import { useSession, useSessionMessageRecords } from '@/sync/sync-context';
import { useSession, useSessionMessagesResolved } from '@/sync/sync-context';
import { getAllSyncSessions } from '@/sync/sync-refs';
import { useProjectsStore } from '@/stores/useProjectsStore';
import { useQuotaAutoRefresh, useQuotaStore } from '@/stores/useQuotaStore';
@@ -665,8 +665,7 @@ export const Header: React.FC<HeaderProps> = ({
const openNewSessionDraft = useSessionUIStore((state) => state.openNewSessionDraft);
const isNewSessionDraftOpen = useSessionUIStore((state) => Boolean(state.newSessionDraft?.open));
const currentSessionId = useSessionUIStore((state) => state.currentSessionId);
const currentSessionMessageRecords = useSessionMessageRecords(currentSessionId ?? '');
const currentSessionMessages = currentSessionId ? (currentSessionMessageRecords.length > 0 ? currentSessionMessageRecords : undefined) : undefined;
const currentSessionMessagesResolved = useSessionMessagesResolved(currentSessionId ?? '');
const currentSyncedSession = useSession(currentSessionId ?? null);
const globalActiveSessions = useGlobalSessionsStore((state) => state.activeSessions);
const activeProject = useProjectsStore((state) => {
@@ -760,7 +759,7 @@ export const Header: React.FC<HeaderProps> = ({
const outputLimit = (limit && typeof limit.output === 'number' ? limit.output : 0);
const contextUsage = getContextUsage(contextLimit, outputLimit);
const [stableDesktopContextUsage, setStableDesktopContextUsage] = React.useState<SessionContextUsage | null>(null);
const isContextUsageResolvedForSession = !currentSessionId || currentSessionMessages !== undefined;
const isContextUsageResolvedForSession = !currentSessionId || currentSessionMessagesResolved;
useEffect(() => {
if (!currentSessionId) {
@@ -51,52 +51,6 @@ const normalizeDirectoryKey = (value: string): string => {
return normalized;
};
const MemoSessionSidebar = React.memo(SessionSidebar);
const MemoHeader = React.memo(Header);
const MemoChatView = React.memo(ChatView);
const MemoPlanView = React.memo(PlanView);
const MemoGitView = React.memo(GitView);
const MemoDiffView = React.memo(DiffView);
const MemoTerminalView = React.memo(TerminalView);
const MemoFilesView = React.memo(FilesView);
const MemoRightSidebarTabs = React.memo(RightSidebarTabs);
const DesktopLeftSidebar = React.memo(function DesktopLeftSidebar({
isSidebarOpen,
isMobile,
}: {
isSidebarOpen: boolean;
isMobile: boolean;
}) {
return (
<Sidebar isOpen={isSidebarOpen} isMobile={isMobile} className="border-0">
<ErrorBoundary>
<MemoSessionSidebar />
</ErrorBoundary>
</Sidebar>
);
});
const DesktopRightPanel = React.memo(function DesktopRightPanel({
isRightSidebarOpen,
setDesktopRightSidebarActionsHost,
}: {
isRightSidebarOpen: boolean;
setDesktopRightSidebarActionsHost: React.Dispatch<React.SetStateAction<HTMLDivElement | null>>;
}) {
return (
<RightSidebar
isOpen={isRightSidebarOpen}
className="border-0"
onTopActionsHostChange={setDesktopRightSidebarActionsHost}
>
<ErrorBoundary>
<MemoRightSidebarTabs />
</ErrorBoundary>
</RightSidebar>
);
});
export const MainLayout: React.FC = () => {
const RIGHT_SIDEBAR_AUTO_CLOSE_WIDTH = 1140;
const RIGHT_SIDEBAR_AUTO_OPEN_WIDTH = 1220;