From a2d71f03d4347dc8face29539f43e8e4b2cb4eb6 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?C=C3=A9dric=20FAMIBELLE-PRONZOLA?= <c.pronzola@live.fr>
Date: Thu, 22 Jul 2021 21:20:14 +0200
Subject: [PATCH] Add placeholder to images from SesyonDialog

---
 components/jwenn-sesyon/sesyon-dialog.js | 13 ++++++++++---
 1 file changed, 10 insertions(+), 3 deletions(-)

diff --git a/components/jwenn-sesyon/sesyon-dialog.js b/components/jwenn-sesyon/sesyon-dialog.js
index e98ba21..90c8d0f 100644
--- a/components/jwenn-sesyon/sesyon-dialog.js
+++ b/components/jwenn-sesyon/sesyon-dialog.js
@@ -15,6 +15,10 @@ import AppleIcon from '@material-ui/icons/Apple'
 import GetAppIcon from '@material-ui/icons/GetApp'
 import {Windows, Linux} from '@icons-pack/react-simple-icons'
 
+import sessionMobile from '../../public/session-mobile-914x1024.png'
+import sessionDesktop from '../../public/session-desktop-1024x549.png'
+import QRCode from '../../public/sesyon-qr-code.png'
+
 const sessionUrl = process.env.NEXT_PUBLIC_SESSION_URL || 'http://sesyon.o-k-i.net'
 
 function Alert(props) {
@@ -110,17 +114,19 @@ export default function SesyonDialog({ouve, handleFemen}) {
             <Box style={{display: 'flex', justifyContent: 'space-around'}}>
               <Box>
                 <Image
-                  src='/session-mobile-914x1024.png'
+                  src={sessionMobile}
                   width={228}
                   height={256}
+                  placeholder='blur'
                 />
               </Box>
               <Divider flexItem orientation='vertical' />
               <Box style={{alignSelf: 'center'}}>
                 <Image
-                  src='/session-desktop-1024x549.png'
+                  src={sessionDesktop}
                   width={256}
                   height={137}
+                  placeholder='blur'
                 />
               </Box>
             </Box>
@@ -167,9 +173,10 @@ export default function SesyonDialog({ouve, handleFemen}) {
           </Typography>
           <Box style={{textAlign: 'center'}}>
             <Image
-              src='/sesyon-qr-code.png'
+              src={QRCode}
               width={200}
               height={200}
+              placeholder='blur'
             />
           </Box>
           <Box style={{textAlign: 'center', marginBlock: 20}}>