perf: lazy-load TipTap via RichText components

client/src/shared/ui/RichTextMessageContent.lazy.tsx

@@ -0,0 +1,26 @@
+import { lazy, Suspense } from 'react'
+import Box from '@mui/material/Box'
+import CircularProgress from '@mui/material/CircularProgress'
+
+const RichTextMessageContentImpl = lazy(() =>
+  import('./RichTextMessageContent').then((m) => ({ default: m.RichTextMessageContent })),
+)
+
+type RichTextMessageContentProps = {
+  value: string
+  tone?: 'default' | 'review' | 'chat'
+}
+
+export function RichTextMessageContent(props: RichTextMessageContentProps) {
+  return (
+    <Suspense
+      fallback={
+        <Box sx={{ display: 'flex', justifyContent: 'center', p: 1 }}>
+          <CircularProgress size={16} />
+        </Box>
+      }
+    >
+      <RichTextMessageContentImpl {...props} />
+    </Suspense>
+  )
+}