Next.js Discord

Discord Forum

<Suspense />

Unanswered
Sloth bear posted this in #help-forum
Open in Discord
Sloth bearOP
Hello !
My <Suspense /> is not working. I put a delay in my childrens for testing

import React, { Suspense, lazy } from 'react';
import ReactLoading from 'react-loading';
import { Typo } from '@/ui/design-sytem/typo';
import { Data } from '@/config/mustawas';

const VideoBar = lazy(() => import('../Navigation/video-bar'));

export interface SelectedVideoProps {
selected_chapter: keyof Data;
selected_course: string;
selected_video?: string;
className?: string;
}

export const SelectedVideo = ({
selected_chapter,
selected_course,
selected_video = 'video1',
}: SelectedVideoProps) => {
return (
<div className="pt-20 pl-20">
<Typo
fontFamily="sfPro"
fontSize={36}
fontWeight="Bold"
letterSpacing={0.5}
>
Courses
</Typo>
<div className="pt-12 space-x-10 flex">
<Suspense fallback={<ReactLoading type="spin" color="black" />}>
<video
src="dcdcdcdcdc"
width="700"
height="397"
controls
autoPlay
playsInline
/>
</Suspense>
<Suspense fallback={<ReactLoading type="spin" color="black" />}>
<VideoBar
selected_chapter={selected_chapter}
selected_course={selected_course}
percentage_videos={42}
/>
</Suspense>
</div>
</div>
);
};

0 Replies