Remove zoom and badge code

Author: timwlee

blocks/product-list-page/product-list-page.js

@@ -22,8 +22,8 @@ import { fetchPlaceholders, getProductLink } from '../../scripts/commerce.js';
 import '../../scripts/initializers/search.js';
 import '../../scripts/initializers/wishlist.js';
 
-let useZoomViewer = false;
-let useProductBadges = false;
+// let useZoomViewer = false;
+// let useProductBadges = false;
 
 export default async function decorate(block) {
   const labels = await fetchPlaceholders();
@@ -74,8 +74,8 @@ export default async function decorate(block) {
   const $productList = fragment.querySelector('.search__product-list');
   const $pagination = fragment.querySelector('.search__pagination');
 
-  useZoomViewer = config.zoom || 'false';
-  useProductBadges = config.badges || 'false';
+  // useZoomViewer = config.zoom || 'false';
+  // useProductBadges = config.badges || 'false';
 
   //block.innerHTML = '';
   block.appendChild(fragment);
@@ -102,7 +102,7 @@ export default async function decorate(block) {
     }).catch(() => console.error('Error searching for products'));
   } else {
     await search({
-      phrase: q || config.searchterm || '',
+      phrase: q || config.searchTerm || '',
       currentPage: page ? Number(page) : 1,
       pageSize: 8,
       sort: getSortFromParams(sort),
@@ -300,30 +300,30 @@ function insertPromo(block, promosData) {
   let resultList = block.querySelector('.product-discovery-product-list__grid');
   resultList.querySelectorAll('.dropin-product-item-card.promo-card').forEach((el) => el.remove());
 
-  if (useProductBadges === 'true') {
-    fetch('/extras/badges.json').then((badges) => {
-      badges.json().then((bd) => {
-        resultList.querySelectorAll('.dropin-product-item-card').forEach((el) => {
-          if (el.classList.contains('promo-card')) return;
-          const anchor = el.querySelector('.dropin-product-item-card__title a');
-          const href = anchor?.href;
-          const card = bd.data.find((bdge) => href.includes(bdge.url));
-          if (card) {
-            const badge = document.createElement('div');
-            badge.className = 'dropin-product-item-card__badge';
-            badge.innerHTML = card?.badge;
-            el.append(badge);
-          }
-        });
-      });
-    });
-  }
-
-  if (useZoomViewer === 'true') {
-    resultList.querySelectorAll('.dropin-product-item-card__image').forEach((el) => {
-      el.classList.add('zoom');
-    });
-  }
+  // if (useProductBadges === 'true') {
+  //   fetch('/extras/badges.json').then((badges) => {
+  //     badges.json().then((bd) => {
+  //       resultList.querySelectorAll('.dropin-product-item-card').forEach((el) => {
+  //         if (el.classList.contains('promo-card')) return;
+  //         const anchor = el.querySelector('.dropin-product-item-card__title a');
+  //         const href = anchor?.href;
+  //         const card = bd.data.find((bdge) => href.includes(bdge.url));
+  //         if (card) {
+  //           const badge = document.createElement('div');
+  //           badge.className = 'dropin-product-item-card__badge';
+  //           badge.innerHTML = card?.badge;
+  //           el.append(badge);
+  //         }
+  //       });
+  //     });
+  //   });
+  // }
+
+  // if (useZoomViewer === 'true') {
+  //   resultList.querySelectorAll('.dropin-product-item-card__image').forEach((el) => {
+  //     el.classList.add('zoom');
+  //   });
+  // }
 
   if (!resultList) return;
 

component-definition.json

@@ -283,7 +283,7 @@
                   "selector": "div:nth-child(1)>div:nth-child(2)>p:nth-child(1)"
                 },
                 {
-                  "name": "searchterm",
+                  "name": "searchTerm",
                   "selector": "div:nth-child(2)>div:nth-child(2)>p:nth-child(1)"
                 },
                 {

component-models.json

@@ -263,21 +263,9 @@
       {
         "component": "text",
         "valueType": "string",
-        "name": "searchterm",
+        "name": "searchTerm",
         "label": "Search Term",
         "value": ""
-      },
-      {
-        "component": "boolean",
-        "label": "Zoom Product Image on Hover",
-        "name": "zoom",
-        "valueType": "boolean"
-      },
-      {
-        "component": "boolean",
-        "label": "Use Product Badges",
-        "name": "badges",
-        "valueType": "boolean"
       }
     ]
   },

ue/models/blocks/product-list-page.json

@@ -10,7 +10,7 @@
           "columns": 2,
           "fields": [
             { "name": "category", "selector": "div:nth-child(1)>div:nth-child(2)>p:nth-child(1)" },
-            { "name": "searchterm", "selector": "div:nth-child(2)>div:nth-child(2)>p:nth-child(1)" },
+            { "name": "searchTerm", "selector": "div:nth-child(2)>div:nth-child(2)>p:nth-child(1)" },
             { "name": "zoom", "selector": "div:nth-child(3)>div:nth-child(2)>p:nth-child(1)" },
             { "name": "badges", "selector": "div:nth-child(4)>div:nth-child(2)>p:nth-child(1)" }
           ]
@@ -32,21 +32,9 @@
         {
           "component": "text",
           "valueType": "string",
-          "name": "searchterm",
+          "name": "searchTerm",
           "label": "Search Term",
           "value": ""
-        },
-        {
-          "component": "boolean",
-          "label": "Zoom Product Image on Hover",
-          "name": "zoom",
-          "valueType": "boolean"
-        },
-        {
-          "component": "boolean",
-          "label": "Use Product Badges",
-          "name": "badges",
-          "valueType": "boolean"
         }
       ]
     }