From 23e1742e4075595c5ac36fe6b00fa7b6bcb9cf63 Mon Sep 17 00:00:00 2001
From: seb <sebgreenbus@gmail.com>
Date: Sun, 6 Jul 2025 20:36:23 +0200
Subject: [PATCH] Add unit pricing measure to product XML generation in
 feeds.cjs. Updated Product, ProductDetailPage, and AddToCartButton components
 to support new pricing fields (fGrundPreis, cGrundEinheit) for compliance
 with German regulations. Enhanced SearchBar with enter icon functionality for
 improved user experience.

---
 prerender/seo/feeds.cjs             | 23 +++++++++++++++++++++++
 src/components/AddToCartButton.js   |  2 ++
 src/components/Product.js           |  8 ++++----
 src/components/ProductDetailPage.js |  7 +++++++
 src/components/ProductList.js       |  4 ++--
 src/components/header/SearchBar.js  | 29 +++++++++++++++++++++++++++--
 6 files changed, 65 insertions(+), 8 deletions(-)

diff --git a/prerender/seo/feeds.cjs b/prerender/seo/feeds.cjs
index 119bb84..b13c537 100644
--- a/prerender/seo/feeds.cjs
+++ b/prerender/seo/feeds.cjs
@@ -11,6 +11,22 @@ Crawl-delay: 0
   return robotsTxt;
 };
 
+// Helper function to determine unit pricing measure based on product data
+const determineUnitPricingMeasure = (product) => {
+  // Use the actual unit data from the product structure
+  if (product.fEinheitMenge && product.cEinheit) {
+    const amount = parseFloat(product.fEinheitMenge);
+    const unit = product.cEinheit.trim();
+    
+    if (amount > 0 && unit) {
+      return `${amount} ${unit}`;
+    }
+  }
+  
+  // Return null if no unit data available - don't corrupt data with fallbacks
+  return null;
+};
+
 const generateProductsXml = (allProductsData = [], baseUrl, config) => {
   const currentDate = new Date().toISOString();
 
@@ -325,6 +341,13 @@ const generateProductsXml = (allProductsData = [], baseUrl, config) => {
       <g:shipping_weight>${parseFloat(product.weight).toFixed(2)} g</g:shipping_weight>`;
       }
 
+      // Add unit pricing measure (required by German law for many products)
+      const unitPricingMeasure = determineUnitPricingMeasure(product);
+      if (unitPricingMeasure) {
+        productsXml += `
+      <g:unit_pricing_measure>${unitPricingMeasure}</g:unit_pricing_measure>`;
+      }
+
       productsXml += `
     </item>`;
 
diff --git a/src/components/AddToCartButton.js b/src/components/AddToCartButton.js
index 40dcc79..05e0457 100644
--- a/src/components/AddToCartButton.js
+++ b/src/components/AddToCartButton.js
@@ -51,6 +51,8 @@ class AddToCartButton extends Component {
         seoName: this.props.seoName,
         pictureList: this.props.pictureList,
         price: this.props.price,
+        fGrundPreis: this.props.fGrundPreis,
+        cGrundEinheit: this.props.cGrundEinheit,
         quantity: 1,
         weight: this.props.weight,
         vat: this.props.vat,
diff --git a/src/components/Product.js b/src/components/Product.js
index 5fee10e..1b8ce82 100644
--- a/src/components/Product.js
+++ b/src/components/Product.js
@@ -68,7 +68,7 @@ class Product extends Component {
   render() {
     const { 
       id, name, price, available, manufacturer, seoName,
-      currency, vat, massMenge, massEinheit, thc,
+      currency, vat, cGrundEinheit, fGrundPreis, thc,
       floweringWeeks,incoming, neu, weight, versandklasse, availableSupplier
     } = this.props;
 
@@ -341,8 +341,8 @@ class Product extends Component {
 
            
               </Typography>
-              {massMenge != 1 && massEinheit && (<Typography variant="body2" color="text.secondary" sx={{ m: 0,p: 0 }}>
-                  ({new Intl.NumberFormat('de-DE', {style: 'currency', currency: currency || 'EUR'}).format(price/massMenge)}/{massEinheit})
+              {cGrundEinheit && fGrundPreis && fGrundPreis != price && (<Typography variant="body2" color="text.secondary" sx={{ m: 0,p: 0 }}>
+                  ({new Intl.NumberFormat('de-DE', {style: 'currency', currency: currency || 'EUR'}).format(fGrundPreis)}/{cGrundEinheit})
               </Typography>   )}
               </div>
                  {/*incoming*/}
@@ -358,7 +358,7 @@ class Product extends Component {
             >
               <ZoomInIcon />
             </IconButton>
-            <AddToCartButton cartButton={true} availableSupplier={availableSupplier} available={available} incoming={incoming} seoName={seoName} pictureList={this.props.pictureList} id={id} price={price} vat={vat} weight={weight} name={name} versandklasse={versandklasse}/>
+            <AddToCartButton cartButton={true} availableSupplier={availableSupplier} cGrundEinheit={cGrundEinheit} fGrundPreis={fGrundPreis} available={available} incoming={incoming} seoName={seoName} pictureList={this.props.pictureList} id={id} price={price} vat={vat} weight={weight} name={name} versandklasse={versandklasse}/>
           </Box>
         </Card>
       </Box>
diff --git a/src/components/ProductDetailPage.js b/src/components/ProductDetailPage.js
index 5e84826..5073701 100644
--- a/src/components/ProductDetailPage.js
+++ b/src/components/ProductDetailPage.js
@@ -452,7 +452,11 @@ class ProductDetailPage extends Component {
                   </Typography>
                   <Typography variant="body2" color="text.secondary">
                     inkl. {product.vat}% MwSt.
+                    {product.cGrundEinheit && product.fGrundPreis && (
+                      <>; {new Intl.NumberFormat('de-DE', {style: 'currency', currency: 'EUR'}).format(product.fGrundPreis)}/{product.cGrundEinheit}</>
+                    )}
                   </Typography>
+
                   {product.versandklasse &&
                     product.versandklasse != "standard" &&
                     product.versandklasse != "kostenlos" && (
@@ -516,12 +520,15 @@ class ProductDetailPage extends Component {
                       available={product.available}
                       id={product.id}
                       availableSupplier={product.availableSupplier}
+                      cGrundEinheit={product.cGrundEinheit}
+                      fGrundPreis={product.fGrundPreis}
                       price={product.price}
                       vat={product.vat}
                       weight={product.weight}
                       name={cleanProductName(product.name)}
                       versandklasse={product.versandklasse}
                     />
+
                     <Typography 
                       variant="caption" 
                       sx={{ 
diff --git a/src/components/ProductList.js b/src/components/ProductList.js
index fe53a9a..bc4349e 100644
--- a/src/components/ProductList.js
+++ b/src/components/ProductList.js
@@ -462,8 +462,8 @@ class ProductList extends Component {
                 available={product.available}
                 manufacturer={product.manufacturer}
                 vat={product.vat}
-                massMenge={product.massMenge}
-                massEinheit={product.massEinheit}
+                cGrundEinheit={product.cGrundEinheit}
+                fGrundPreis={product.fGrundPreis}
                 incoming={product.incomingDate}
                 neu={product.neu}
                 thc={product.thc}
diff --git a/src/components/header/SearchBar.js b/src/components/header/SearchBar.js
index d52891e..80c7da0 100644
--- a/src/components/header/SearchBar.js
+++ b/src/components/header/SearchBar.js
@@ -8,7 +8,9 @@ import ListItem from "@mui/material/ListItem";
 import ListItemText from "@mui/material/ListItemText";
 import Typography from "@mui/material/Typography";
 import CircularProgress from "@mui/material/CircularProgress";
+import IconButton from "@mui/material/IconButton";
 import SearchIcon from "@mui/icons-material/Search";
+import KeyboardReturnIcon from "@mui/icons-material/KeyboardReturn";
 import { useNavigate, useLocation } from "react-router-dom";
 import SocketContext from "../../contexts/SocketContext.js";
 
@@ -184,6 +186,15 @@ const SearchBar = () => {
     }, 200);
   };
 
+  // Handle enter icon click
+  const handleEnterClick = () => {
+    delete window.currentSearchQuery;
+    setShowSuggestions(false);
+    if (searchQuery.trim()) {
+      navigate(`/search?q=${encodeURIComponent(searchQuery)}`);
+    }
+  };
+
   // Clean up timers on unmount
   React.useEffect(() => {
     return () => {
@@ -244,9 +255,23 @@ const SearchBar = () => {
               <SearchIcon />
             </InputAdornment>
           ),
-          endAdornment: loadingSuggestions && (
+          endAdornment: (
             <InputAdornment position="end">
-              <CircularProgress size={16} />
+              {loadingSuggestions && <CircularProgress size={16} />}
+              <IconButton
+                size="small"
+                onClick={handleEnterClick}
+                sx={{
+                  ml: loadingSuggestions ? 0.5 : 0,
+                  p: 0.5,
+                  color: "text.secondary",
+                  "&:hover": {
+                    color: "primary.main",
+                  },
+                }}
+              >
+                <KeyboardReturnIcon fontSize="small" />
+              </IconButton>
             </InputAdornment>
           ),
           sx: { borderRadius: 2, bgcolor: "background.paper" },