diff --git a/src/sections/Home/Partners-home/index.js b/src/sections/Home/Partners-home/index.js
index d4174c44ec6a..0973fa104824 100644
--- a/src/sections/Home/Partners-home/index.js
+++ b/src/sections/Home/Partners-home/index.js
@@ -1,4 +1,4 @@
-import React from "react";
+import React, { useState, useEffect } from "react";
import { Container, Row } from "../../../reusecore/Layout";
import SectionTitle from "../../../reusecore/SectionTitle";
import PartnerItemWrapper from "./partnerSection.style";
@@ -8,27 +8,57 @@ import Slider from "react-slick";
import "slick-carousel/slick/slick.css";
import "slick-carousel/slick/slick-theme.css";
-const settings = {
- initialSlide: 1,
- lazyLoad: true,
- arrows: false,
- dots: false,
- infinite: true,
- speed: 500,
- centerMode: true,
- variableWidth: true,
- autoplay: true,
- autoplaySpeed: 1500,
- className: "partner-slider",
- responsive: [
- {
- breakpoint: 1400,
- settings: "unslick"
- }
- ]
-};
+const PartnerImage = ({ partner }) => (
+
+
+
+);
const Projects = () => {
+ const [imagesLoaded, setImagesLoaded] = useState(false);
+
+ useEffect(() => {
+ const imagePromises = partners.map(partner => {
+ return new Promise((resolve, reject) => {
+ const img = new Image();
+ img.onload = resolve;
+ img.onerror = reject;
+ img.src = partner.imageLink;
+ });
+ });
+
+ Promise.all(imagePromises)
+ .then(() => setImagesLoaded(true))
+ .catch(error => console.error("Error preloading images:", error));
+ }, []);
+
+ const settings = {
+ initialSlide: 1,
+ lazyLoad: false,
+ arrows: false,
+ dots: false,
+ infinite: true,
+ speed: 500,
+ centerMode: true,
+ variableWidth: true,
+ autoplay: true,
+ autoplaySpeed: 1500,
+ className: "partner-slider",
+ responsive: [
+ {
+ breakpoint: 1400,
+ settings: "unslick"
+ }
+ ]
+ };
+
return (
@@ -42,15 +72,17 @@ const Projects = () => {
-
- {partners.map((partner, index) => (
-
-
-
-
-
- ))}
-
+ {imagesLoaded ? (
+
+ {partners.map((partner, index) => (
+
+
+
+ ))}
+
+ ) : (
+ Loading partners...
+ )}
);
};