diff --git a/src/renderer/src/components/app/AuthenticatedAppShell.tsx b/src/renderer/src/components/app/AuthenticatedAppShell.tsx index 8f94658..d0dce91 100644 --- a/src/renderer/src/components/app/AuthenticatedAppShell.tsx +++ b/src/renderer/src/components/app/AuthenticatedAppShell.tsx @@ -1,4 +1,4 @@ -import React from 'react' +import React, { Suspense } from 'react' import { ArrowUpCircle, Database, @@ -16,12 +16,13 @@ import type { UpdateStatus } from '../../../../main/types/update.types' import type { CurrentUser, Page } from '../../hooks/useAppBootstrap' -import UpdateDialog from '../UpdateDialog' import { Toast } from '../ui/Toast' import CleanerPage from '../../pages/CleanerPage' import ExtractorPage from '../../pages/ExtractorPage' import SettingsPage from '../../pages/SettingsPage' +const UpdateDialog = React.lazy(() => import('../UpdateDialog')) + interface AuthenticatedAppShellProps { currentUser: CurrentUser | null currentPage: Page @@ -192,18 +193,20 @@ export function AuthenticatedAppShell({ - - onDownloadAndInstallAdminRelease(release) - } - onRefreshCatalog={onRefreshCatalog} - /> + + + onDownloadAndInstallAdminRelease(release) + } + onRefreshCatalog={onRefreshCatalog} + /> + ) } diff --git a/src/renderer/src/pages/CleanerPage.tsx b/src/renderer/src/pages/CleanerPage.tsx index 4e95f04..279fc48 100644 --- a/src/renderer/src/pages/CleanerPage.tsx +++ b/src/renderer/src/pages/CleanerPage.tsx @@ -1,14 +1,17 @@ -import React from 'react' +import React, { Suspense } from 'react' import { CleanerExecutionBar } from '../components/cleaner/CleanerExecutionBar' import { CleanerResultsTable } from '../components/cleaner/CleanerResultsTable' import { CleanerSidebar } from '../components/cleaner/CleanerSidebar' import { CleanerToolbar } from '../components/cleaner/CleanerToolbar' -import MaterialTypeManagementDialog from '../components/MaterialTypeManagementDialog' -import ExecutionReportDialog from '../components/ExecutionReportDialog' -import ReportViewerDialog from '../components/ReportViewerDialog' import { ConfirmDialog } from '../components/ui/ConfirmDialog' import { useCleaner } from '../hooks/useCleaner' +const MaterialTypeManagementDialog = React.lazy( + () => import('../components/MaterialTypeManagementDialog') +) +const ExecutionReportDialog = React.lazy(() => import('../components/ExecutionReportDialog')) +const ReportViewerDialog = React.lazy(() => import('../components/ReportViewerDialog')) + const CleanerPage: React.FC = () => { const typeManagementButtonRef = React.useRef(null) const executeButtonRef = React.useRef(null) @@ -129,42 +132,45 @@ const CleanerPage: React.FC = () => { /> - {/* Material Type Management Dialog */} - setIsTypeDialogOpen(false)} - isAdmin={isAdmin} - currentUsername={currentUsername} - triggerRef={typeManagementButtonRef} - /> + + setIsTypeDialogOpen(false)} + isAdmin={isAdmin} + currentUsername={currentUsername} + triggerRef={typeManagementButtonRef} + /> + - {/* Execution Report Dialog */} - { - setIsReportDialogOpen(false) - resetStartTime() - }} - ordersProcessed={reportData?.ordersProcessed} - materialsDeleted={reportData?.materialsDeleted} - materialsSkipped={reportData?.materialsSkipped} - errors={reportData?.errors} - dryRun={dryRun} - isExecuting={isExecuting} - progress={progress} - startTime={startTime} - triggerRef={executeButtonRef} - retriedOrders={reportData?.retriedOrders} - successfulRetries={reportData?.successfulRetries} - /> + + { + setIsReportDialogOpen(false) + resetStartTime() + }} + ordersProcessed={reportData?.ordersProcessed} + materialsDeleted={reportData?.materialsDeleted} + materialsSkipped={reportData?.materialsSkipped} + errors={reportData?.errors} + dryRun={dryRun} + isExecuting={isExecuting} + progress={progress} + startTime={startTime} + triggerRef={executeButtonRef} + retriedOrders={reportData?.retriedOrders} + successfulRetries={reportData?.successfulRetries} + /> + - {/* Report Viewer Dialog */} - setIsReportViewerOpen(false)} - isAdmin={isAdmin} - currentUsername={currentUsername} - /> + + setIsReportViewerOpen(false)} + isAdmin={isAdmin} + currentUsername={currentUsername} + /> + {/* Confirmation Dialog */} {confirmDialog && }