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