From 226ca3e8345fdb7be9f74b41ad05c6d04b0d9a5e Mon Sep 17 00:00:00 2001
From: sebseb7 <sebgreenbus@gmail.com>
Date: Wed, 23 Jul 2025 10:20:35 +0200
Subject: [PATCH] refactor: improve cache utilization and data fetching logic
 in SharedCarousel and CategoryList components for enhanced performance and
 maintainability

---
 src/components/SharedCarousel.js      | 78 +++++++++++++--------------
 src/components/header/CategoryList.js |  1 +
 2 files changed, 39 insertions(+), 40 deletions(-)

diff --git a/src/components/SharedCarousel.js b/src/components/SharedCarousel.js
index e16ffaf..2a6bc5c 100644
--- a/src/components/SharedCarousel.js
+++ b/src/components/SharedCarousel.js
@@ -78,50 +78,48 @@ const SharedCarousel = () => {
   }, [i18n]);
 
   useEffect(() => {
-    // Only fetch if we don't have categories
+    // Check cache first
+    const cache = getProductCache();
+    const categoryTree = cache[`categoryTree_209_${currentLanguage}`]?.categoryTree || 
+                        (currentLanguage === 'de' && cache["categoryTree_209"]?.categoryTree);
+    
+    // Use cache if available
+    if (categoryTree) {
+      setRootCategories(processCategoryTree(categoryTree));
+      return;
+    }
+    
+    // Only fetch if needed
     if (rootCategories.length === 0 && typeof window !== "undefined") {
-      const cache = getProductCache();
-      const categoryTree = cache[`categoryTree_209_${currentLanguage}`]?.categoryTree || 
-                          (currentLanguage === 'de' && cache["categoryTree_209"]?.categoryTree);
-      
-      // If no cache, fetch
-      if (!categoryTree) {
-        window.socketManager.emit("categoryList", { categoryId: 209, language: currentLanguage, requestTranslation: true }, (response) => {
-          if (response && response.success) {
-            // Use translated data if available, otherwise fall back to original
-            const categoryTreeToUse = response.translation || response.categoryTree;
-            
-            if (categoryTreeToUse) {
-              // Store in cache with language-specific key
-              try {
-                if (!window.productCache) window.productCache = {};
-                window.productCache[`categoryTree_209_${currentLanguage}`] = {
-                  categoryTree: categoryTreeToUse,
-                  timestamp: Date.now(),
-                };
-              } catch (err) {
-                console.error(err);
-              }
-              const newCategories = categoryTreeToUse.children || [];
-              setRootCategories(newCategories);
-            }
-          } else if (response && response.categoryTree) {
-            // Fallback for old response format
+      window.socketManager.emit("categoryList", { categoryId: 209, language: currentLanguage, requestTranslation: true }, (response) => {
+        if (response && response.success) {
+          // Use translated data if available, otherwise fall back to original
+          const categoryTreeToUse = response.translation || response.categoryTree;
+          
+          if (categoryTreeToUse) {
             // Store in cache with language-specific key
-            try {
-              if (!window.productCache) window.productCache = {};
-              window.productCache[`categoryTree_209_${currentLanguage}`] = {
-                categoryTree: response.categoryTree,
-                timestamp: Date.now(),
-              };
-            } catch (err) {
-              console.error(err);
-            }
-            const newCategories = response.categoryTree.children || [];
+            if (!window.productCache) window.productCache = {};
+            window.productCache[`categoryTree_209_${currentLanguage}`] = {
+              categoryTree: categoryTreeToUse,
+              timestamp: Date.now(),
+            };
+            
+            const newCategories = categoryTreeToUse.children || [];
             setRootCategories(newCategories);
           }
-        });
-      }
+        } else if (response && response.categoryTree) {
+          // Fallback for old response format
+          // Store in cache with language-specific key
+          if (!window.productCache) window.productCache = {};
+          window.productCache[`categoryTree_209_${currentLanguage}`] = {
+            categoryTree: response.categoryTree,
+            timestamp: Date.now(),
+          };
+          
+          const newCategories = response.categoryTree.children || [];
+          setRootCategories(newCategories);
+        }
+      });
     }
   }, [rootCategories.length, currentLanguage]);
 
diff --git a/src/components/header/CategoryList.js b/src/components/header/CategoryList.js
index 0a106a5..fe9caa4 100644
--- a/src/components/header/CategoryList.js
+++ b/src/components/header/CategoryList.js
@@ -180,6 +180,7 @@ class CategoryList extends Component {
     const categoryTree = windowObj.productCache[cacheKey]?.categoryTree;
     if (categoryTree) {
       this.processCategoryTree(categoryTree);
+      this.setState({ fetchedCategories: true });
       return;
     }