From 410b363883cc8b441bc2a858825ade07d72a19ca Mon Sep 17 00:00:00 2001
From: IT Fixcomart <it@fixcomart.co.id>
Date: Tue, 1 Nov 2022 10:40:36 +0700
Subject: Add progress bar and performance optimization

---
 src/components/productCard.js | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

(limited to 'src/components/productCard.js')

diff --git a/src/components/productCard.js b/src/components/productCard.js
index 6e703670..f51473ad 100644
--- a/src/components/productCard.js
+++ b/src/components/productCard.js
@@ -1,13 +1,17 @@
 import Link from "next/link";
 import currencyFormat from "../helpers/currencyFormat";
 import { createSlug } from "../helpers/slug";
+import { LazyLoadImage } from "react-lazy-load-image-component";
+
+import 'react-lazy-load-image-component/src/effects/blur.css';
+
 
 export default function productCard({ data }) {
   let product = data;
   return (
     <div className="product-card">
       <Link href={'/shop/product/' + createSlug(product.name, product.id)} className="block">
-        <img src={product.image ? product.image : '/images/noimage.jpeg'} alt={product.name} className="product-card__image" loading="lazy" />
+        <LazyLoadImage effect="blur" src={product.image ? product.image : '/images/noimage.jpeg'} alt={product.name} className="product-card__image" />
       </Link>
       <div className="product-card__description">
         <div>
-- 
cgit v1.2.3