diff options
Diffstat (limited to 'src')
| -rw-r--r-- | src/pages/video.jsx | 21 |
1 files changed, 12 insertions, 9 deletions
diff --git a/src/pages/video.jsx b/src/pages/video.jsx index 88f460a2..bfd4a126 100644 --- a/src/pages/video.jsx +++ b/src/pages/video.jsx @@ -3,6 +3,7 @@ import Spinner from '@/core/components/elements/Spinner/Spinner' import BasicLayout from '@/core/components/layouts/BasicLayout' import useVideo from '@/lib/video/hooks/useVideo' import { useRouter } from 'next/router' +import { LazyLoadComponent } from 'react-lazy-load-image-component' export default function Video() { const router = useRouter() @@ -27,15 +28,17 @@ export default function Video() { <div className='grid grid-cols-1 md:grid-cols-4 gap-6'> {video.data?.videos?.map((video) => ( <div className='shadow bg-white rounded' key={video.id}> - <iframe - src={`https://www.youtube.com/embed/${video.url.match(/v=([^&]*)/)[1]}`} - title='YouTube video player' - allow='accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share' - allowFullScreen={true} - width='100%' - height={200} - className='rounded' - /> + <LazyLoadComponent> + <iframe + src={`https://www.youtube.com/embed/${video.url.match(/v=([^&]*)/)[1]}`} + title='YouTube video player' + allow='accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share' + allowFullScreen={true} + width='100%' + height={200} + className='rounded' + /> + </LazyLoadComponent> <div className='p-3'> <a href='https://www.youtube.com/@indoteknikb2bindustriale-c778' |