diff --git a/apps/desktop/src/pages/ConversationPage.tsx b/apps/desktop/src/pages/ConversationPage.tsx index 214a014..cb33418 100644 --- a/apps/desktop/src/pages/ConversationPage.tsx +++ b/apps/desktop/src/pages/ConversationPage.tsx @@ -1,6 +1,6 @@ import { parseMessagePayload, pinMessage, unpinMessage } from '@chat-app/shared/chat'; import { extractErrorCode } from '@chat-app/shared/i18n'; -import { useCallback, useEffect, useLayoutEffect, useMemo, useRef, useState } from 'react'; +import { lazy, Suspense, useCallback, useEffect, useLayoutEffect, useMemo, useRef, useState } from 'react'; import { useTranslation } from 'react-i18next'; import { useParams } from 'react-router-dom'; @@ -26,7 +26,9 @@ import { SpinnerIcon, XIcon, } from '../components/icons'; -import { ImageAnnotator } from '../components/ImageAnnotator'; +const ImageAnnotator = lazy(() => + import('../components/ImageAnnotator').then((m) => ({ default: m.ImageAnnotator })), +); import { InCallPanel } from '../components/InCallPanel'; import { IncomingCallPanel } from '../components/IncomingCallPanel'; import { CallPreviewPanel } from '../components/CallPreviewPanel'; @@ -49,9 +51,15 @@ import { createWatchTogetherPayload, createGamePayload, } from '../lib/conversationFeatures'; -import { WhiteboardModal } from '../components/WhiteboardModal'; -import { WatchTogetherModal } from '../components/WatchTogetherModal'; -import { GameModal } from '../components/GameModal'; +const WhiteboardModal = lazy(() => + import('../components/WhiteboardModal').then((m) => ({ default: m.WhiteboardModal })), +); +const WatchTogetherModal = lazy(() => + import('../components/WatchTogetherModal').then((m) => ({ default: m.WatchTogetherModal })), +); +const GameModal = lazy(() => + import('../components/GameModal').then((m) => ({ default: m.GameModal })), +); import { createWhiteboard, createWatchSession, parseYouTubeUrl, createGame, type GameType } from '@chat-app/shared/chat'; import { compressImages } from '../lib/imageCompress'; import { ensureInstallId } from '../lib/installId'; @@ -1321,35 +1329,43 @@ export function ConversationPage() { /> {annotatingIndex !== null && attachments[annotatingIndex] && ( - setAnnotatingIndex(null)} - onSave={(next) => { - setAttachments((prev) => prev.map((f, i) => (i === annotatingIndex ? next : f))); - setAnnotatingIndex(null); - }} - /> + + setAnnotatingIndex(null)} + onSave={(next) => { + setAttachments((prev) => prev.map((f, i) => (i === annotatingIndex ? next : f))); + setAnnotatingIndex(null); + }} + /> + )} {openWhiteboardId && ( - setOpenWhiteboardId(null)} - /> + + setOpenWhiteboardId(null)} + /> + )} {openWatchSessionId && ( - setOpenWatchSessionId(null)} - /> + + setOpenWatchSessionId(null)} + /> + )} {openGameId && ( - setOpenGameId(null)} - /> + + setOpenGameId(null)} + /> + )} {gameDialogOpen && (