From 9b38ed6f2a0d19f8e7fc6396bc851b12c358578b Mon Sep 17 00:00:00 2001
From: sebseb7 <sebgreenbus@gmail.com>
Date: Thu, 31 Jul 2025 04:50:55 +0200
Subject: [PATCH] refactor: enhance SharedCarousel to support language context
 updates and improve category fetching logic

---
 src/components/SharedCarousel.js | 24 +++++++++++++++++++++---
 src/services/CategoryService.js  | 11 +++++++++--
 2 files changed, 30 insertions(+), 5 deletions(-)

diff --git a/src/components/SharedCarousel.js b/src/components/SharedCarousel.js
index f4d332e..dea9b85 100644
--- a/src/components/SharedCarousel.js
+++ b/src/components/SharedCarousel.js
@@ -1,4 +1,4 @@
-import React from "react";
+import React from 'react';
 import Box from "@mui/material/Box";
 import Typography from "@mui/material/Typography";
 import IconButton from "@mui/material/IconButton";
@@ -6,6 +6,7 @@ import ChevronLeft from "@mui/icons-material/ChevronLeft";
 import ChevronRight from "@mui/icons-material/ChevronRight";
 import CategoryBox from "./CategoryBox.js";
 import { withTranslation } from 'react-i18next';
+import { withLanguage } from '../i18n/withTranslation.js';
 
 const ITEM_WIDTH = 130 + 16; // 130px width + 16px gap
 const AUTO_SCROLL_SPEED = 0.5; // px per frame (~60fps, so ~30px/sec)
@@ -45,7 +46,7 @@ class SharedCarousel extends React.Component {
   componentDidMount() {
     this._isMounted = true;
     if (!this.state.categories || this.state.categories.length === 0) {
-      window.categoryService.get(209).then((response) => {
+      window.categoryService.get(209,this.props.languageContext?.currentLanguage || this.props.i18n.language).then((response) => {
         if (this._isMounted && response.children && response.children.length > 0) {
           this.originalCategories = response.children;
           // Duplicate for seamless looping
@@ -57,6 +58,23 @@ class SharedCarousel extends React.Component {
     }
   }
 
+  componentDidUpdate(prevProps) {
+    console.log("componentDidUpdate", prevProps.languageContext?.currentLanguage, this.props.languageContext?.currentLanguage);
+    if(prevProps.languageContext?.currentLanguage !== this.props.languageContext?.currentLanguage) {
+      this.setState({ categories: [] },() => {
+        window.categoryService.get(209,this.props.languageContext?.currentLanguage || this.props.i18n.language).then((response) => {
+          console.log("response", response);
+          if (response.children && response.children.length > 0) {
+            this.originalCategories = response.children;  
+            this.categories = [...response.children, ...response.children];
+            this.setState({ categories: this.categories });
+            this.startAutoScroll();
+          }
+        });
+      });
+    }
+  }
+
   componentWillUnmount() {
     this._isMounted = false;
     this.stopAutoScroll();
@@ -386,4 +404,4 @@ class SharedCarousel extends React.Component {
   }
 }
 
-export default withTranslation()(SharedCarousel);
+export default withTranslation()(withLanguage(SharedCarousel));
diff --git a/src/services/CategoryService.js b/src/services/CategoryService.js
index 5ae169e..fc0b6a8 100644
--- a/src/services/CategoryService.js
+++ b/src/services/CategoryService.js
@@ -29,9 +29,16 @@ class CategoryService {
       }
       
       return new Promise((resolve) => {
-        window.socketManager.emit("categoryList", {categoryId: categoryId, language: language}, (response) => {
+        window.socketManager.emit("categoryList", {categoryId: categoryId, language: language, requestTranslation: language === "de" ? false : true}, (response) => {
           console.log("CategoryService", cacheKey);
-          if (response.categoryTree) {
+          if (response.translatedCategoryTree) {
+            if (!window.categoryCache) {
+              window.categoryCache = {};
+            }
+            window.categoryCache[cacheKey] = response.translatedCategoryTree;
+            console.log("mutex unlocked and returning new value");
+            resolve(response.translatedCategoryTree);
+          } else if (response.categoryTree) {
             if (!window.categoryCache) {
               window.categoryCache = {};
             }