.

components/home/LetDiscover.js

@@ -54,7 +54,7 @@ const LetDiscover = ({ categories }) => {
                 <Swiper
                   modules={[Autoplay, Navigation]}
                   slidesPerView={3}
-                  spaceBetween= {10}
+                  spaceBetween={10}
                   // autoplay={{
                   //     delay: 7000,
                   //     disableOnInteraction: false,
@@ -95,16 +95,14 @@ const LetDiscover = ({ categories }) => {
                       return (
                         <SwiperSlide key={data?.id}>
                           <motion.div variants={zoomIn("left", 0.3)} initial={"hidden"} whileInView={"show"} viewport={{ once: false, amount: 0.2 }}>
-                            <a
-                              onClick={() => {
-                                router.push(`/listing?category=${data.id}`);
-                              }}
-                            >
+                            <Link prefetch href={`/listing?category=${data.id}`}>
+                              <div>
                                 <span className="image-container">
-                                <img priority={false} loading="lazy" layout="fill" alt="" className="image img-fluid" src={cleanImage(data?.attributes?.image?.data?.attributes)} />
+                                  <Image layout="fill" alt="" className="image img-fluid" src={cleanImage(data?.attributes?.image?.data?.attributes)} />
                                 </span>
                                 <div className="title">{data?.attributes?.name}</div>
-                            </a>
+                              </div>
+                            </Link>
                           </motion.div>
                         </SwiperSlide>
                       );