diff --git a/src/app/MainApp.tsx b/src/app/MainApp.tsx index 03a5aed..6765620 100644 --- a/src/app/MainApp.tsx +++ b/src/app/MainApp.tsx @@ -67,6 +67,21 @@ export function MainApp({ profile, grades, payment, onSignedOut }: Props) { ); } +/** + * صفحه‌ها از قبل گرفته شده‌اند، ولی `lazy` حتی برای ماژولِ آماده هم یک رندرِ تهی می‌گیرد؛ نشان دادنِ + * «یه لحظه صبر کن» در همان یک-دو فریم همان پرشِ ریزِ بینِ صفحه‌ها بود. لودر فقط اگر بارگیری + * واقعاً طول کشید (شبکه‌ی کند، پیش از تمام شدنِ preload) پس از ۳۰۰ms ظاهر می‌شود. + * با مرورگر دیده نشده؛ فقط از روی کد. + */ +function DelayedLoading() { + const [show, setShow] = useState(false); + useEffect(() => { + const t = setTimeout(() => setShow(true), 300); + return () => clearTimeout(t); + }, []); + return show ? : null; +} + function Screens({ onSignedOut }: Pick) { const nav = useNav(); const { route } = nav; @@ -84,7 +99,7 @@ function Screens({ onSignedOut }: Pick) { exit={{ opacity: 0, x: 18 }} transition={{ duration: 0.18 }} > - }> + }>