perf(vite): add dynamic imports

This commit is contained in:
Alois 2026-08-31 20:48:32 +02:00
commit 85921a0a08
Signed by: alois
SSH key fingerprint: SHA256:GBzT2DXvAuGV9XIV5W3WrzVpjU54FThmxHXdbz95J24
29 changed files with 470 additions and 326 deletions

View file

@ -24,6 +24,7 @@
"@tensamin/cache": "workspace:*",
"@tensamin/crypto": "workspace:*",
"@tensamin/hotkeys": "workspace:*",
"@tensamin/markdown": "workspace:*",
"@tensamin/mtp": "workspace:*",
"@tensamin/shared": "workspace:*",
"@tensamin/storage": "workspace:*",

View file

@ -1,5 +1,5 @@
import { Button } from "@methanium/ui";
import { Emoji } from "@methanium/ui/markdown";
import Emoji from "@tensamin/markdown/emoji";
import { getRecentEmojis, useEmojiRanks } from "./emojiRanks";
export default function EmojiPicker({

View file

@ -1,6 +1,6 @@
import { useStorage } from "@tensamin/storage/context";
import { useCallback, useEffect, useState } from "react";
import { normalizeShortcode } from "@methanium/ui/markdown";
import { normalizeShortcode } from "@tensamin/markdown/emoji";
const RANKS_CHANGED_EVENT = "tensamin-reaction-ranks-changed";
let recordQueue = Promise.resolve();

View file

@ -1,4 +1,4 @@
import { Input, type InputController } from "@methanium/ui/markdown";
import Input, { type InputController } from "@tensamin/markdown/input";
import {
Card,
CardHeader,
@ -10,7 +10,14 @@ import {
PopoverTrigger,
} from "@methanium/ui";
import { useStorage } from "@tensamin/storage/context";
import React, { useCallback, useEffect, useState, useRef } from "react";
import React, {
lazy,
Suspense,
useCallback,
useEffect,
useState,
useRef,
} from "react";
import { Button } from "@methanium/ui";
import { Plus, Laugh, FileVideo, SendHorizonal } from "lucide-react";
@ -21,14 +28,15 @@ import { cn, useIsMobile } from "@methanium/ui";
import { encryptChatText } from "@tensamin/crypto/chatSecret";
import { useSession } from "@tensamin/storage/session";
import EmojiPicker from "./emoji/emojiPicker";
import { useEmojiRanks, useRecordEmojiUse } from "./emoji/emojiRanks";
import GifPicker from "./media/gifPicker";
import ReplyBox from "./replyBox";
import { useHotkey } from "@tensamin/hotkeys";
import { editLastMessageHotkey } from "../hotkeys";
import { useUser } from "@tensamin/identity/context";
const EmojiPicker = lazy(() => import("./emoji/emojiPicker"));
const GifPicker = lazy(() => import("./media/gifPicker"));
export default function InputComponent({
value,
setValue,
@ -351,13 +359,15 @@ export default function InputComponent({
)}
/>
<PopoverContent className="w-auto p-0">
<EmojiPicker
onSelect={(shortcode) => {
setValue(`${value}${shortcode} `);
recordUse(shortcode);
setEmojiPopoverOpen(false);
}}
/>
<Suspense fallback={null}>
<EmojiPicker
onSelect={(shortcode) => {
setValue(`${value}${shortcode} `);
recordUse(shortcode);
setEmojiPopoverOpen(false);
}}
/>
</Suspense>
</PopoverContent>
</Popover>
{isMobile ? (
@ -371,12 +381,14 @@ export default function InputComponent({
</DrawerTrigger>
<DrawerContent className="h-[80dvh]">
<div className="min-h-0 flex-1 p-3">
<GifPicker
onSelect={(url) => {
void handleSubmit(url, true);
setGifPopoverOpen(false);
}}
/>
<Suspense fallback={null}>
<GifPicker
onSelect={(url) => {
void handleSubmit(url, true);
setGifPopoverOpen(false);
}}
/>
</Suspense>
</div>
</DrawerContent>
</Drawer>
@ -408,14 +420,16 @@ export default function InputComponent({
className="absolute left-0 top-0 z-10 h-4 w-4 cursor-nwse-resize"
onPointerDown={handleGifPopoverResizeStart}
/>
<GifPicker
resizeHeight={gifPopoverSize?.height}
resizeWidth={gifPopoverSize?.width}
onSelect={(url) => {
void handleSubmit(url, true);
setGifPopoverOpen(false);
}}
/>
<Suspense fallback={null}>
<GifPicker
resizeHeight={gifPopoverSize?.height}
resizeWidth={gifPopoverSize?.width}
onSelect={(url) => {
void handleSubmit(url, true);
setGifPopoverOpen(false);
}}
/>
</Suspense>
</PopoverContent>
</Popover>
)}

View file

@ -1,4 +1,4 @@
import { Text } from "@methanium/ui/markdown";
import Text from "@tensamin/markdown/text";
import { useStorage } from "@tensamin/storage/context";
import {
Avatar,

View file

@ -19,7 +19,9 @@ import { useMTP } from "@tensamin/mtp";
import { getMessage, useChat } from "../context";
import { decryptChatText, encryptChatText } from "@tensamin/crypto/chatSecret";
import { log, toast } from "@tensamin/shared/log";
import { Emoji, Input, normalizeShortcode, Text } from "@methanium/ui/markdown";
import Emoji, { normalizeShortcode } from "@tensamin/markdown/emoji";
import Input from "@tensamin/markdown/input";
import Text from "@tensamin/markdown/text";
import { useRecordEmojiUse } from "./emoji/emojiRanks";
import ReplyBox from "./replyBox";
import { useHotkey } from "@tensamin/hotkeys";

View file

@ -44,7 +44,7 @@ import type {
Ref,
} from "react";
import { useChat } from "../context";
import { Emoji } from "@methanium/ui/markdown";
import Emoji from "@tensamin/markdown/emoji";
import EmojiPicker from "./emoji/emojiPicker";
import { getRecentEmojis, useEmojiRanks } from "./emoji/emojiRanks";

View file

@ -6,7 +6,7 @@ import {
cn,
Skeleton,
} from "@methanium/ui";
import { Text } from "@methanium/ui/markdown";
import Text from "@tensamin/markdown/text";
import type { SelectedUser } from "@tensamin/identity/context";
import Wrapper from "@tensamin/identity/wrapper";
import { Forward, X } from "lucide-react";