From 12ed71b406c2b4de5c43bab6cf23a682bfdd27bc Mon Sep 17 00:00:00 2001 From: sebseb7 Date: Sun, 7 Sep 2025 06:09:14 +0200 Subject: [PATCH] refactor: streamline GrowTentKonfigurator by removing unused variables and console logs - Eliminated unnecessary tracking of response status and related logic for product list updates. - Removed console logging statements to clean up the code and improve performance. - Added a check to ensure all category data sections are loaded before rendering related components, enhancing user experience. --- src/pages/GrowTentKonfigurator.js | 94 ++++++++++++------------------- 1 file changed, 35 insertions(+), 59 deletions(-) diff --git a/src/pages/GrowTentKonfigurator.js b/src/pages/GrowTentKonfigurator.js index b1d0988..fe292d4 100644 --- a/src/pages/GrowTentKonfigurator.js +++ b/src/pages/GrowTentKonfigurator.js @@ -158,11 +158,7 @@ class GrowTentKonfigurator extends Component { window.socketManager.off(`productList:${categoryId}`); - // Track if we've received the full response to ignore stub response if needed - let receivedFullResponse = false; - window.socketManager.on(`productList:${categoryId}`,(response) => { - receivedFullResponse = true; setCachedCategoryData(categoryId, response); // Force re-render when data arrives @@ -175,15 +171,7 @@ class GrowTentKonfigurator extends Component { window.socketManager.emit( "getCategoryProducts", { categoryId: categoryId, language: currentLanguage, requestTranslation: currentLanguage === 'de' ? false : true }, - (response) => { - // Only process stub response if we haven't received the full response yet - if (!receivedFullResponse) { - setCachedCategoryData(categoryId, response); - if (categoryId === 'Zelte') { - this.forceUpdate(); - } - } - } + () => {} ); } @@ -264,8 +252,6 @@ class GrowTentKonfigurator extends Component { }); return matchingProducts.map(product => { - // Convert to the format expected by the configurator - console.log('Raw product from backend:', product); return product; }); // No sorting needed } @@ -274,10 +260,6 @@ class GrowTentKonfigurator extends Component { filterLampsByTentSize(tentShape, products, attributes) { if (!products || !attributes || !tentShape) return []; - console.log('Filtering lamps for tent shape:', tentShape); - console.log('Available lamp products:', products.length); - console.log('Available lamp attributes:', attributes.length); - // Group attributes by product ID and attribute name const attributesByProduct = {}; attributes.forEach(attr => { @@ -301,13 +283,9 @@ class GrowTentKonfigurator extends Component { // Check availability - only show products that are available for delivery const isAvailable = (product.available > 0) || (product.availableSupplier === 1); - - console.log(`Product ${product.id}: tentSize=${tentSizeAttr}, match=${sizeMatch}, available=${isAvailable}`); - return sizeMatch && isAvailable; }); - console.log('Filtered lamps:', matchingProducts.length); return matchingProducts; } @@ -315,7 +293,6 @@ class GrowTentKonfigurator extends Component { getLampsForTentShape(shapeId) { const cachedData = getCachedCategoryData('Lampen'); if (!cachedData || !cachedData.products || !cachedData.attributes) { - console.log('No cached lamp data available'); return []; } @@ -326,7 +303,6 @@ class GrowTentKonfigurator extends Component { getVentilationForTentShape(shapeId) { const cachedData = getCachedCategoryData('Abluft-sets'); if (!cachedData || !cachedData.products || !cachedData.attributes) { - console.log('No cached ventilation data available'); return []; } @@ -337,10 +313,6 @@ class GrowTentKonfigurator extends Component { filterVentilationByTentSize(tentShape, products, attributes) { if (!products || !attributes || !tentShape) return []; - console.log('Filtering ventilation for tent shape:', tentShape); - console.log('Available ventilation products:', products.length); - console.log('Available ventilation attributes:', attributes.length); - // Group attributes by product ID and attribute name const attributesByProduct = {}; attributes.forEach(attr => { @@ -362,9 +334,6 @@ class GrowTentKonfigurator extends Component { // Only filter by tent size match, not by availability const sizeMatch = tentSizeAttr === tentShape; - - console.log(`Ventilation Product ${product.id}: tentSize=${tentSizeAttr}, match=${sizeMatch}`); - return sizeMatch; }).map(product => { // Add availability flag to each product for UI rendering @@ -375,7 +344,6 @@ class GrowTentKonfigurator extends Component { }; }); - console.log('Filtered ventilation (including non-deliverable):', matchingProducts.length); return matchingProducts; } @@ -650,10 +618,6 @@ class GrowTentKonfigurator extends Component { ); } - console.log('Product display:', { - productsCount: filteredTents.length, - firstProduct: filteredTents[0] || null - }); if (filteredTents.length === 0) { return ( @@ -1245,7 +1209,14 @@ class GrowTentKonfigurator extends Component { render() { - + // Check if all 4 category data sections have loaded + const tentsData = getCachedCategoryData('Zelte'); + const lampsData = getCachedCategoryData('Lampen'); + const ventilationData = getCachedCategoryData('Abluft-sets'); + const extrasData = getCachedCategoryData('Set-zubehoer'); + + const allDataLoaded = tentsData && lampsData && ventilationData && extrasData; + return ( @@ -1256,14 +1227,14 @@ class GrowTentKonfigurator extends Component { Stelle dein perfektes Indoor Grow Setup zusammen - + {/* Bundle Discount Information */} - - {this.renderTentSizeSection()} - {this.state.selectedTentShape && } - - {this.renderLightSection()} - - - {this.renderVentilationSection()} - - - {this.renderExtrasSection()} - - {/* Inline summary section - expands when scrolling to bottom */} - {this.renderInlineSummary()} - + {allDataLoaded && ( + <> + + + {this.renderTentSizeSection()} + {this.state.selectedTentShape && } + + {this.renderLightSection()} + + + {this.renderVentilationSection()} + + + {this.renderExtrasSection()} + + {/* Inline summary section - expands when scrolling to bottom */} + {this.renderInlineSummary()} + + )}