From 0d42449cdd6e53cb8e98555660aefee81997a9d3 Mon Sep 17 00:00:00 2001
From: Rafi Zadanly <zadanlyr@gmail.com>
Date: Wed, 29 Mar 2023 15:08:07 +0700
Subject: fix

---
 src/pages/video.jsx | 21 ++++++++++++---------
 1 file changed, 12 insertions(+), 9 deletions(-)

(limited to 'src/pages/video.jsx')

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'
-- 
cgit v1.2.3

