From fdbe0a8504263114d9fe836859d080d1a9660b7b Mon Sep 17 00:00:00 2001
From: Flatlogic Bot <support@flatlogic.com>
Date: Fri, 11 Apr 2025 15:59:18 +0000
Subject: [PATCH] one more change with landing page, and it's look so cure and
 good. thank you!

---
 .../WebPageComponents/HeroComponent/index.tsx | 39 ++++++++++---------
 frontend/src/pages/web_pages/home.tsx         |  2 +-
 2 files changed, 22 insertions(+), 19 deletions(-)

diff --git a/frontend/src/components/WebPageComponents/HeroComponent/index.tsx b/frontend/src/components/WebPageComponents/HeroComponent/index.tsx
index 7b178ce..7e45528 100644
--- a/frontend/src/components/WebPageComponents/HeroComponent/index.tsx
+++ b/frontend/src/components/WebPageComponents/HeroComponent/index.tsx
@@ -21,25 +21,28 @@ export default function HeroSection({
   const [imageHero, setImages] = useState([]);
   const pexelsQueriesWebSite = image;
 
-  useEffect(() => {
-    const fetchImages = async () => {
-      if (design !== HeroDesigns.TEXT_CENTER) {
-        try {
-          const images = await getMultiplePexelsImages(pexelsQueriesWebSite);
-          const formattedImages = images.map((image) => ({
-            src: image.src || undefined,
-            photographer: image.photographer || undefined,
-            photographer_url: image.photographer_url || undefined,
-          }));
-          setImages(formattedImages);
-        } catch (error) {
-          console.error('Error fetching images:', error);
-        }
+useEffect(() => {
+  const fetchImages = async () => {
+    if (image && image.length > 0 && typeof image[0] === 'object' && image[0].src) {
+      setImages(image);
+      return;
+    }
+    if (design !== HeroDesigns.TEXT_CENTER) {
+      try {
+        const images = await getMultiplePexelsImages(pexelsQueriesWebSite);
+        const formattedImages = images.map((img) => ({
+          src: img.src || undefined,
+          photographer: img.photographer || undefined,
+          photographer_url: img.photographer_url || undefined,
+        }));
+        setImages(formattedImages);
+      } catch (error) {
+        console.error('Error fetching images:', error);
       }
-    };
-
-    fetchImages();
-  }, [pexelsQueriesWebSite, design]);
+    }
+  };
+  fetchImages();
+}, [pexelsQueriesWebSite, design]);
 
   let DesignComponent;
 
diff --git a/frontend/src/pages/web_pages/home.tsx b/frontend/src/pages/web_pages/home.tsx
index d57510f..ed9b017 100644
--- a/frontend/src/pages/web_pages/home.tsx
+++ b/frontend/src/pages/web_pages/home.tsx
@@ -93,7 +93,7 @@ export default function WebSite() {
       <main className={`flex-grow    bg-white  rounded-none  `}>
         <HeroSection
           projectName={'Management system'}
-          image={[{src: 'https://images.pexels.com/photos/12345/cool-girl-project.jpg', photographer_url: 'https://www.pexels.com/photo/cool-girl', photographer: 'Cool Girl'}]}
+          image={[{src: 'https://images.pexels.com/photos/774909/pexels-photo-774909.jpeg', photographer_url: 'https://www.pexels.com/photo/woman-in-white-blouse-774909/', photographer: 'Pexels'}]}
           mainText={`Welcome to ${projectName} - where project management feels just like home!`}
           subTitle={`${projectName} empowers project managers to seamlessly oversee multiple organizations, tasks, and teams, enhancing productivity and efficiency.`}
           design={HeroDesigns.IMAGE_RIGHT || ''}