fix(perf): fix remaining lazy-loading and dead toggle issues from PR review
- Gate TeamListView dialogs with showCreateDialog/launchDialogOpen - Gate SchedulesView and ScheduleSection lazy dialogs with dialogOpen - Fix import order in SchedulesView (import type before lazy constant) - Add Show raw toggle button to MarkdownViewer rendered view
This commit is contained in:
parent
90d887fcce
commit
f2231d7dad
4 changed files with 60 additions and 30 deletions
|
|
@ -1169,12 +1169,36 @@ export const MarkdownViewer: React.FC<MarkdownViewerProps> = React.memo(function
|
||||||
<span className="text-sm font-medium" style={{ color: COLOR_TEXT_SECONDARY }}>
|
<span className="text-sm font-medium" style={{ color: COLOR_TEXT_SECONDARY }}>
|
||||||
{label}
|
{label}
|
||||||
</span>
|
</span>
|
||||||
{copyable && (
|
<span className="flex-1" />
|
||||||
<>
|
<button
|
||||||
<span className="flex-1" />
|
type="button"
|
||||||
<CopyButton text={content} inline />
|
className="text-xs underline"
|
||||||
</>
|
style={{ color: PROSE_LINK }}
|
||||||
)}
|
onClick={() => setShowRaw(true)}
|
||||||
|
title="Show raw"
|
||||||
|
>
|
||||||
|
Show raw
|
||||||
|
</button>
|
||||||
|
{copyable && <CopyButton text={content} inline />}
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
|
||||||
|
{/* Show raw toggle for no-label path */}
|
||||||
|
{!label && (
|
||||||
|
<div
|
||||||
|
className="flex items-center justify-between px-3 py-1 text-xs"
|
||||||
|
style={{ color: COLOR_TEXT_MUTED }}
|
||||||
|
>
|
||||||
|
<span />
|
||||||
|
<button
|
||||||
|
type="button"
|
||||||
|
className="underline"
|
||||||
|
style={{ color: PROSE_LINK }}
|
||||||
|
onClick={() => setShowRaw(true)}
|
||||||
|
title="Show raw"
|
||||||
|
>
|
||||||
|
Show raw
|
||||||
|
</button>
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -28,12 +28,14 @@ import { ScheduleRunLogDialog } from '../team/schedule/ScheduleRunLogDialog';
|
||||||
import { ScheduleRunRow } from '../team/schedule/ScheduleRunRow';
|
import { ScheduleRunRow } from '../team/schedule/ScheduleRunRow';
|
||||||
import { ScheduleStatusBadge } from '../team/schedule/ScheduleStatusBadge';
|
import { ScheduleStatusBadge } from '../team/schedule/ScheduleStatusBadge';
|
||||||
|
|
||||||
const LaunchTeamDialog = lazy(() =>
|
|
||||||
import('../team/dialogs/LaunchTeamDialog').then((m) => ({ default: m.LaunchTeamDialog }))
|
|
||||||
);
|
|
||||||
|
|
||||||
import type { Schedule, ScheduleRun, ScheduleStatus } from '@shared/types';
|
import type { Schedule, ScheduleRun, ScheduleStatus } from '@shared/types';
|
||||||
|
|
||||||
|
const LaunchTeamDialog = lazy(() =>
|
||||||
|
import('@renderer/components/team/dialogs/LaunchTeamDialog').then((m) => ({
|
||||||
|
default: m.LaunchTeamDialog,
|
||||||
|
}))
|
||||||
|
);
|
||||||
|
|
||||||
// =============================================================================
|
// =============================================================================
|
||||||
// Constants
|
// Constants
|
||||||
// =============================================================================
|
// =============================================================================
|
||||||
|
|
@ -565,15 +567,17 @@ export const SchedulesView = (): React.JSX.Element => {
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* Create/Edit Dialog */}
|
{/* Create/Edit Dialog */}
|
||||||
<Suspense fallback={null}>
|
{dialogOpen && (
|
||||||
<LaunchTeamDialog
|
<Suspense fallback={null}>
|
||||||
mode="schedule"
|
<LaunchTeamDialog
|
||||||
open={dialogOpen}
|
mode="schedule"
|
||||||
teamName={editingSchedule?.teamName}
|
open={dialogOpen}
|
||||||
schedule={editingSchedule}
|
teamName={editingSchedule?.teamName}
|
||||||
onClose={handleClose}
|
schedule={editingSchedule}
|
||||||
/>
|
onClose={handleClose}
|
||||||
</Suspense>
|
/>
|
||||||
|
</Suspense>
|
||||||
|
)}
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
|
||||||
|
|
@ -736,7 +736,7 @@ export const TeamListView = memo(function TeamListView(): React.JSX.Element {
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
const createDialogElement = (
|
const createDialogElement = showCreateDialog && (
|
||||||
<Suspense fallback={null}>
|
<Suspense fallback={null}>
|
||||||
<CreateTeamDialog
|
<CreateTeamDialog
|
||||||
open={showCreateDialog}
|
open={showCreateDialog}
|
||||||
|
|
@ -755,7 +755,7 @@ export const TeamListView = memo(function TeamListView(): React.JSX.Element {
|
||||||
</Suspense>
|
</Suspense>
|
||||||
);
|
);
|
||||||
|
|
||||||
const launchDialogElement = (
|
const launchDialogElement = launchDialogOpen && (
|
||||||
<Suspense fallback={null}>
|
<Suspense fallback={null}>
|
||||||
<LaunchTeamDialog
|
<LaunchTeamDialog
|
||||||
mode="launch"
|
mode="launch"
|
||||||
|
|
|
||||||
|
|
@ -307,15 +307,17 @@ export const ScheduleSection = ({ teamName }: ScheduleSectionProps): React.JSX.E
|
||||||
)}
|
)}
|
||||||
|
|
||||||
{/* Create/Edit Dialog */}
|
{/* Create/Edit Dialog */}
|
||||||
<Suspense fallback={null}>
|
{dialogOpen && (
|
||||||
<LaunchTeamDialog
|
<Suspense fallback={null}>
|
||||||
mode="schedule"
|
<LaunchTeamDialog
|
||||||
open={dialogOpen}
|
mode="schedule"
|
||||||
teamName={teamName}
|
open={dialogOpen}
|
||||||
schedule={editingSchedule}
|
teamName={teamName}
|
||||||
onClose={handleClose}
|
schedule={editingSchedule}
|
||||||
/>
|
onClose={handleClose}
|
||||||
</Suspense>
|
/>
|
||||||
|
</Suspense>
|
||||||
|
)}
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue