From d40e311b5112c33efab7bf7fcf4aa7de09771496 Mon Sep 17 00:00:00 2001
From: sebseb7 <sebgreenbus@gmail.com>
Date: Wed, 6 Aug 2025 09:50:37 +0200
Subject: [PATCH] feat: enhance ProductDetailPage to handle language changes
 and improve caching logic

- Added logic to detect language changes and clear relevant caches to ensure fresh data loading.
- Updated component state management to reset and reload product data upon language context updates.
- Improved debugging output for better tracking of language-related changes.
---
 src/components/ProductDetailPage.js | 41 ++++++++++++++++++++++++++++-
 1 file changed, 40 insertions(+), 1 deletion(-)

diff --git a/src/components/ProductDetailPage.js b/src/components/ProductDetailPage.js
index 7f998f5..05d9a3d 100644
--- a/src/components/ProductDetailPage.js
+++ b/src/components/ProductDetailPage.js
@@ -165,11 +165,50 @@ class ProductDetailPage extends Component {
   }
 
   componentDidUpdate(prevProps) {
-    if (prevProps.seoName !== this.props.seoName)
+    // Check for seoName changes
+    if (prevProps.seoName !== this.props.seoName) {
       this.setState(
         { product: null, loading: true, upgrading: false, error: null, imageDialogOpen: false },
         this.loadProductData
       );
+      return;
+    }
+    
+    // Check for language changes
+    const prevLanguage = prevProps.languageContext?.currentLanguage || prevProps.i18n?.language || 'de';
+    const currentLanguage = this.props.languageContext?.currentLanguage || this.props.i18n?.language || 'de';
+    
+    if (prevLanguage !== currentLanguage) {
+      console.log('Language changed from', prevLanguage, 'to', currentLanguage, '- reloading product data');
+      
+      // Clear relevant caches to force fresh socket calls with new language
+      if (window.productDetailCache) {
+        // Clear cache for current product
+        delete window.productDetailCache[this.props.seoName];
+        
+        // Clear cache for any komponenten if they exist
+        if (this.state.komponenten && this.state.komponenten.length > 0) {
+          this.state.komponenten.forEach(komponent => {
+            delete window.productDetailCache[komponent.id];
+          });
+        }
+      }
+      
+      // Reset component state and reload data
+      this.setState(
+        {  
+          loading: false, 
+          upgrading: false, 
+          error: null, 
+          imageDialogOpen: false,
+          komponentenData: {},
+          komponentenLoaded: false,
+          totalKomponentenPrice: 0,
+          totalSavings: 0
+        },
+        this.loadProductData
+      );
+    }
   }
 
   loadKomponentImage = (komponentId, pictureList) => {