perf: lazy-load TaskDetailDialog, SendMessageDialog, CreateTaskDialog, ChangeReviewDialog

Defers parsing 4575 lines of heavy dialog code until first use, reducing
initial bundle parse time for TeamDetailView.
This commit is contained in:
Mike 2026-05-02 22:24:03 +05:00
parent 5d6667b23d
commit 5cd890dcdd

View file

@ -78,12 +78,9 @@ import {
import { useShallow } from 'zustand/react/shallow';
import { AddMemberDialog } from './dialogs/AddMemberDialog';
import { CreateTaskDialog } from './dialogs/CreateTaskDialog';
import { EditTeamDialog } from './dialogs/EditTeamDialog';
import type { TeamLaunchDialogMode } from './dialogs/LaunchTeamDialog';
import { ReviewDialog } from './dialogs/ReviewDialog';
import { SendMessageDialog } from './dialogs/SendMessageDialog';
import { TaskDetailDialog } from './dialogs/TaskDetailDialog';
import { executeTeamRelaunch } from './dialogs/teamRelaunchFlow';
import { KanbanBoard } from './kanban/KanbanBoard';
import { UNASSIGNED_OWNER } from './kanban/KanbanFilterPopover';
@ -107,9 +104,20 @@ const TeamGraphOverlay = lazy(() =>
default: m.TeamGraphOverlay,
}))
);
const TaskDetailDialog = lazy(() =>
import('./dialogs/TaskDetailDialog').then((m) => ({ default: m.TaskDetailDialog }))
);
const SendMessageDialog = lazy(() =>
import('./dialogs/SendMessageDialog').then((m) => ({ default: m.SendMessageDialog }))
);
const CreateTaskDialog = lazy(() =>
import('./dialogs/CreateTaskDialog').then((m) => ({ default: m.CreateTaskDialog }))
);
const ChangeReviewDialog = lazy(() =>
import('./review/ChangeReviewDialog').then((m) => ({ default: m.ChangeReviewDialog }))
);
import { MemberList } from './members/MemberList';
import { MessagesPanel } from './messages/MessagesPanel';
import { ChangeReviewDialog } from './review/ChangeReviewDialog';
import { ScheduleSection } from './schedule/ScheduleSection';
import { TeamSidebarHost } from './sidebar/TeamSidebarHost';
import { TeamSidebarPortalSource } from './sidebar/TeamSidebarPortalSource';
@ -2857,6 +2865,7 @@ export const TeamDetailView = memo(
}}
/>
<Suspense fallback={null}>
<CreateTaskDialog
open={createTaskDialog.open}
teamName={teamName}
@ -2872,6 +2881,7 @@ export const TeamDetailView = memo(
onSubmit={handleCreateTask}
submitting={creatingTask}
/>
</Suspense>
<EditTeamDialog
open={editDialogOpen}
@ -2997,6 +3007,7 @@ export const TeamDetailView = memo(
/>
</Suspense>
<Suspense fallback={null}>
<SendMessageDialog
open={sendDialogOpen}
teamName={teamName}
@ -3052,7 +3063,9 @@ export const TeamDetailView = memo(
setSendDialogDefaultChip(undefined);
}}
/>
</Suspense>
<Suspense fallback={null}>
<TaskDetailDialog
open={selectedTask !== null}
task={selectedTask}
@ -3094,6 +3107,7 @@ export const TeamDetailView = memo(
}}
onDeleteTask={handleDeleteTask}
/>
</Suspense>
<TrashDialog
open={trashOpen}
@ -3110,6 +3124,7 @@ export const TeamDetailView = memo(
}}
/>
<Suspense fallback={null}>
<ChangeReviewDialog
open={reviewDialogState.open}
onOpenChange={(open) =>
@ -3130,6 +3145,7 @@ export const TeamDetailView = memo(
projectPath={data.config.projectPath}
onEditorAction={handleEditorAction}
/>
</Suspense>
</div>
<div
ref={setMessagesPanelMountPoint}