wickes-css2 2.103.0-gift-cards.16 → 2.103.0-gift-cards.18

package/src/js/components/banner-placement-manager.js

@@ -0,0 +1,267 @@
+var Wick = Wick || {};
+Wick.BannerPlacementManager = {
+  SPONSOR_BANNERS_DISPLAYED_EVENT: 'sponsorAdsDisplayedEvent',
+  el: {
+    banners: '.card-product-banner',
+    sponsorBanners: '.card-sponsor-banner',
+    sponsorProducts: '.card-sponsor-product',
+    allBanners: '.card-product-banner, .card-sponsor-banner, .card-sponsor-product',
+    productCard: '.product-card',
+    allListSlots: '.product-card, .card-product-banner, .card-sponsor-banner, .card-sponsor-product',
+    productsWrap: '.products-list-v2',
+    $products: $('.product-card'),
+    attrPositionDesktop: 'data-desktop-position',
+    attrPositionMobile: 'data-mobile-position',
+    attrRequiredAmountDesktop: 'data-required-amount-desktop',
+    attrRequiredAmountMobile: 'data-required-amount-mobile',
+    hide: 'd-none',
+    sponsoredAdvBanners: '.sponsored-ad'
+  },
+  classes: {
+    sponsorBanners: 'card-sponsor-banner',
+    sponsorProducts: 'card-sponsor-product',
+    productBanners: 'card-product-banner',
+    bannerInactiveClass: 'card-product-banner--inactive'
+  },
+  isEventSent: false,
+  currentBreakpoint: null,
+  checkProductsInColumn() {
+    Wick.BannerPlacementManager.addInactiveClasses();
+    Wick.BannerPlacementManager.arrangeBannersInRightOrder();
+    const $allBanners = $(Wick.BannerPlacementManager.el.allBanners);
+    const totalProducts = Wick.BannerPlacementManager.getListLength();
+    const totalSlots = totalProducts + $allBanners.length;
+    $allBanners.each((index, banner) => {
+      const bannerPosition = Wick.BannerPlacementManager.getBannerPosition(banner);
+
+      if ($(banner).hasClass('card-product-banner')) {
+        if (bannerPosition > totalSlots) {
+          Wick.BannerPlacementManager.hideBanner(banner);
+          $(Wick.BannerPlacementManager.el.productsWrap).append(banner);
+          return;
+        }
+      }
+
+      if ($(banner).hasClass(Wick.BannerPlacementManager.classes.sponsorBanners) || $(banner).hasClass(Wick.BannerPlacementManager.classes.sponsorProducts)) {
+        if (bannerPosition > totalProducts) {
+          Wick.BannerPlacementManager.showBanner(banner);
+          Wick.BannerPlacementManager.removeInactiveClass(banner);
+          $(Wick.BannerPlacementManager.el.productsWrap).append(banner);
+          return;
+        }
+      }
+
+      Wick.BannerPlacementManager.hideBannerDueLimit(banner, index);
+      Wick.BannerPlacementManager.moveBannerToSpecifiedPosition(banner);
+    });
+  },
+  moveBannerToSpecifiedPosition(banner) {
+    const $listSlots = Wick.BannerPlacementManager.getListSlots();
+    const bannerPosition = Wick.BannerPlacementManager.getBannerPosition(banner) - 2;
+    const listSlotsLength = $listSlots.length;
+
+    if (Wick.BannerPlacementManager.isBannerVisible(banner)) {
+      if (bannerPosition <= listSlotsLength) {
+        if ($listSlots[bannerPosition]) {
+          Wick.BannerPlacementManager.showBanner(banner);
+          Wick.BannerPlacementManager.removeInactiveClass(banner);
+          Wick.BannerPlacementManager.moveBanner(banner, $listSlots[bannerPosition]);
+        } else {
+          Wick.BannerPlacementManager.hideBanner(banner);
+          Wick.BannerPlacementManager.coverEdgeCases(banner);
+        }
+      } else {
+        if ($(banner).hasClass(Wick.BannerPlacementManager.classes.sponsorBanners) || $(banner).hasClass(Wick.BannerPlacementManager.classes.sponsorProducts)) {
+          Wick.BannerPlacementManager.showBanner(banner);
+          Wick.BannerPlacementManager.removeInactiveClass(banner);
+          $(Wick.BannerPlacementManager.el.productsWrap).append(banner);
+        } else {
+          Wick.BannerPlacementManager.hideBanner(banner);
+        }
+      }
+    }
+  },
+  moveBanner(banner, targetElement) {
+    $(banner).remove();
+    $(targetElement).after(banner);
+  },
+  hideBanner(banner) {
+    $(banner).addClass(Wick.BannerPlacementManager.el.hide);
+  },
+  showBanner(banner) {
+    $(banner).removeClass(Wick.BannerPlacementManager.el.hide);
+  },
+  isBannerVisible(banner) {
+    return !$(banner).hasClass(Wick.BannerPlacementManager.el.hide);
+  },
+  hideBannerDueLimit(banner) {
+    const bannerMinLimit = Wick.BannerPlacementManager.getBannerLimit(banner) - 1;
+    const $listSlots = Wick.BannerPlacementManager.getListSlots();
+    const listProductsLength = $listSlots.length;
+    Wick.BannerPlacementManager.showBanner(banner);
+
+    if (bannerMinLimit > listProductsLength) {
+      Wick.BannerPlacementManager.hideBanner(banner);
+    }
+  },
+  getBannerPosition(banner) {
+    const isMobile = Wick.BannerPlacementManager.isMobileResolution();
+    const positionAttribute = isMobile
+      ?  Wick.BannerPlacementManager.el.attrPositionMobile
+      : Wick.BannerPlacementManager.el.attrPositionDesktop
+
+    return banner.hasAttribute(positionAttribute)
+      ? Number(banner.getAttribute(positionAttribute))
+      : Number(Wick.BannerPlacementManager.getListLength() + Wick.BannerPlacementManager.getBannersAmount());
+  },
+  getBannerLimit(banner) {
+    const isMobile = Wick.BannerPlacementManager.isMobileResolution();
+
+    const limitAttribute = isMobile
+      ? Wick.BannerPlacementManager.el.attrRequiredAmountMobile
+      : Wick.BannerPlacementManager.el.attrRequiredAmountDesktop;
+
+    return banner.hasAttribute(limitAttribute)
+      ? Number(banner.getAttribute(limitAttribute))
+      : 0;
+  },
+  isMobileResolution() {
+    return Wick.Responsive.getCurrentBreakpoint() !== 'up-lg';
+  },
+  getListLength() {
+    const $listItems = $(Wick.BannerPlacementManager.el.productsWrap).children(Wick.BannerPlacementManager.el.productCard);
+    return $listItems.length;
+  },
+  getBannersAmount() {
+    return $(Wick.BannerPlacementManager.el.allBanners).length;
+  },
+  getProductsAmount() {
+    return Wick.BannerPlacementManager.el.$products.length;
+  },
+  arrangeBannersInRightOrder() {
+    const $allBanners = $(Wick.BannerPlacementManager.el.allBanners);
+
+    const sponsorProducts = $allBanners.filter((i, el) =>
+      $(el).hasClass(Wick.BannerPlacementManager.classes.sponsorProducts)
+    );
+    const sponsorBanners = $allBanners.filter((i, el) =>
+      $(el).hasClass(Wick.BannerPlacementManager.classes.sponsorBanners)
+    );
+
+    const firstSponsorProductPos = sponsorProducts.length > 0
+      ? Math.min(...sponsorProducts.map((i, el) => Wick.BannerPlacementManager.getBannerPosition(el)).get())
+      : Infinity;
+    const firstSponsorBannerPos = sponsorBanners.length > 0
+      ? Math.min(...sponsorBanners.map((i, el) => Wick.BannerPlacementManager.getBannerPosition(el)).get())
+      : Infinity;
+
+    let groupOrder;
+    if (firstSponsorProductPos < firstSponsorBannerPos) {
+      groupOrder = [
+        Wick.BannerPlacementManager.classes.sponsorProducts,
+        Wick.BannerPlacementManager.classes.sponsorBanners,
+        Wick.BannerPlacementManager.classes.productBanners
+      ];
+    } else {
+      groupOrder = [
+        Wick.BannerPlacementManager.classes.sponsorBanners,
+        Wick.BannerPlacementManager.classes.sponsorProducts,
+        Wick.BannerPlacementManager.classes.productBanners
+      ];
+    }
+
+    $allBanners.sort((a, b) => {
+      function getGroupIndex(el) {
+        if ($(el).hasClass(groupOrder[0])) return 0;
+        if ($(el).hasClass(groupOrder[1])) return 1;
+        if ($(el).hasClass(groupOrder[2])) return 2;
+        return 3;
+      }
+
+      const groupA = getGroupIndex(a);
+      const groupB = getGroupIndex(b);
+
+      if (groupA !== groupB) {
+        return groupA - groupB;
+      }
+
+      const positionA = Wick.BannerPlacementManager.getBannerPosition(a);
+      const positionB = Wick.BannerPlacementManager.getBannerPosition(b);
+
+      return positionA - positionB;
+    }).appendTo(Wick.BannerPlacementManager.el.productsWrap);
+  },
+  addInactiveClasses() {
+    $(Wick.BannerPlacementManager.el.allBanners).addClass(Wick.BannerPlacementManager.el.hide);
+  },
+  removeInactiveClass(banner) {
+    $(banner).removeClass(Wick.BannerPlacementManager.classes.bannerInactiveClass)
+  },
+  insertFirstBanner(banner) {
+    const bannerPosition = Wick.BannerPlacementManager.getBannerPosition(banner);
+
+    if (bannerPosition === 1) {
+      Wick.BannerPlacementManager.showBanner(banner);
+      Wick.BannerPlacementManager.removeInactiveClass(banner);
+      $(banner).remove();
+      $(Wick.BannerPlacementManager.el.productsWrap).prepend(banner);
+    }
+  },
+  coverEdgeCases(banner) {
+    Wick.BannerPlacementManager.insertFirstBanner(banner);
+  },
+  getListSlots() {
+    return $(Wick.BannerPlacementManager.el.productsWrap)
+      .children(Wick.BannerPlacementManager.el.allListSlots)
+      .filter(function() {
+        if ($(this).hasClass(Wick.BannerPlacementManager.classes.productBanners)) {
+          const position = Wick.BannerPlacementManager.getBannerPosition(this);
+          const productsCount = Wick.BannerPlacementManager.getListLength();
+          return position <= productsCount;
+        }
+
+        return true;
+      });
+  },
+  getBannerPriority(banner) {
+    if ($(banner).hasClass(Wick.BannerPlacementManager.classes.sponsorProducts)) {
+      return 1;
+    }
+    if ($(banner).hasClass(Wick.BannerPlacementManager.classes.sponsorBanners)) {
+      return 2;
+    }
+    return 3;
+  },
+  dispatchSponsorAdsDisplayedEvent() {
+    return new Promise((resolve, reject) => {
+      const eventDetail = { resolve, reject };
+      const sponsorAdsEvent = createEvent(Wick.BannerPlacementManager.SPONSOR_BANNERS_DISPLAYED_EVENT, { displayed: true }, eventDetail);
+      window.dispatchEvent(sponsorAdsEvent);
+    });
+  },
+  init() {
+    Wick.Responsive.onResize(function () {
+      if(Wick.BannerPlacementManager.currentBreakpoint !== Wick.Responsive.getCurrentBreakpoint()) {
+        Wick.BannerPlacementManager.currentBreakpoint = Wick.Responsive.getCurrentBreakpoint()
+        Wick.BannerPlacementManager.checkProductsInColumn();
+
+        if (
+          !Wick.BannerPlacementManager.isEventSent && $(Wick.BannerPlacementManager.el.sponsoredAdvBanners).length
+        ) {
+          Wick.BannerPlacementManager.dispatchSponsorAdsDisplayedEvent();
+          Wick.BannerPlacementManager.isEventSent = true;
+        }
+
+        $(window).trigger('productBannerPositionChanged');
+      }
+    });
+  }
+};
+
+$(document).ready(function () {
+  if (!Wick.BannerPlacementManager.getBannersAmount() || !Wick.BannerPlacementManager.getProductsAmount()) {
+    return;
+  }
+
+  Wick.BannerPlacementManager.init();
+})

package/src/js/emulation/banner-placement-manager.js

@@ -0,0 +1,53 @@
+// Simulate prompt for input
+function getInputs() {
+  const productBannerPositions = prompt("Enter Product Banner Positions:", "2") || "";
+  const sponsorProductPositions = prompt("Enter Sponsor Product Positions (comma-separated):", "6,7,8") || "";
+  const sponsorBannerPositions = prompt("Enter Sponsor Banner Positions:", "10") || "";
+
+  return {
+    productBannerPositions: productBannerPositions ? productBannerPositions.split(",").map(Number) : [],
+    sponsorProductPositions: sponsorProductPositions ? sponsorProductPositions.split(",").map(Number) : [],
+    sponsorBannerPositions: sponsorBannerPositions ? sponsorBannerPositions.split(",").map(Number) : [],
+  };
+}
+
+function getPositionAttr() {
+  const isMobile = Wick.BannerPlacementManager.isMobileResolution();
+  return isMobile
+    ? 'data-mobile-position'
+    : 'data-desktop-position';
+}
+
+function updatePositions(inputs) {
+  const productBannerElements = document.querySelectorAll(".card-product-banner");
+  productBannerElements.forEach((el, index) => {
+    if (inputs.productBannerPositions[index] !== undefined) {
+      el.setAttribute(getPositionAttr(), inputs.productBannerPositions[index]);
+    }
+  });
+
+  const sponsorProductElements = document.querySelectorAll(".card-sponsor-product");
+  sponsorProductElements.forEach((el, index) => {
+    if (inputs.sponsorProductPositions[index] !== undefined) {
+      el.setAttribute(getPositionAttr(), inputs.sponsorProductPositions[index]);
+    }
+  });
+
+  const sponsorBannerElements = document.querySelectorAll(".card-sponsor-banner");
+  sponsorBannerElements.forEach((el, index) => {
+    if (inputs.sponsorBannerPositions[index] !== undefined) {
+      el.setAttribute(getPositionAttr(), inputs.sponsorBannerPositions[index]);
+    }
+  });
+}
+
+function init() {
+  const inputs = getInputs();
+  updatePositions(inputs);
+}
+
+$(document).ready(function () {
+  if ($('.retail-media .products-list.products-list-v2').length) {
+    setTimeout(() => init(), 100)
+  }
+});

package/src/js/page/components/gift-cards.js

@@ -694,11 +694,11 @@ Wick.GiftCard = {
             self.renderGiftCardsFromList($root, error.giftCards);
           }
 
-          const numberCode = Number(error?.errorCode);
+          const msg = (error.errorCode && PAY_MESSAGE_BY_CODE[error.errorCode]) || DEFAULT_ERROR_MESSAGE;
 
-          if (Number.isFinite(numberCode) && PAY_MESSAGE_BY_CODE[numberCode]) {
+          if (msg) {
             Wick.Notification.show({
-              text: linkifyClickHere(PAY_MESSAGE_BY_CODE[numberCode]),
+              text: linkifyClickHere(msg),
               container: '.globalMessages .container',
               type: 'error',
             });

package/src/js/page/plp-cards-v2.js

@@ -6,7 +6,9 @@ $(document).ready(function () {
     }
 
     function cardsContent(itemsInRow) {
-        let card = $('.content .product-card, .content .card-product-banner');
+        let card = $('.content .product-card, .content .card-product-banner, .content .card-sponsor-banner, .content .card-sponsor-product').filter(function() {
+            return $(this).parents('.product-card, .card-product-banner, .card-sponsor-banner, .card-sponsor-product').length === 0;
+        });
         let priceSelectors = [
             '.including-vat .product-card__price__old-price',
             '.excluding-vat .product-card__price__old-price',
@@ -17,6 +19,7 @@ $(document).ready(function () {
         revealAll(card, ['.product-card__price__old-price',
                                     '.product-card__price-sqm',
                                     '.product-card__price-value',
+                                    '.product-card__sponsored',
                                     '.energy-efficiency',
                                     '.energy-efficiency__link']);
 
@@ -33,6 +36,8 @@ $(document).ready(function () {
                 hideEmptiness(currentRow, '.product-card__price-sqm');
             }
             hideEmptiness(currentRow, '.product-card__price-value');
+            hideEmptiness(currentRow, '.product-card__sponsored');
+            hideEmptiness(currentRow, '.product-card__price__old-price');
             hideEmptiness(currentRow, '.energy-efficiency');
             hideEmptiness(currentRow, '.energy-efficiency__link');
 
@@ -43,11 +48,15 @@ $(document).ready(function () {
     function hideEmptiness(query, className) {
         let currentQuery = query.find(className);
         let rowContent = currentQuery.text();
-
-        if (className === '.energy-efficiency') {
-            let isEnergyQueryEmpty = isClassPresentInQuery(currentQuery, "energy-efficiency--empty");
-
-            if (isEnergyQueryEmpty) {
+        const classEmptyCheckMap = {
+            '.energy-efficiency': 'energy-efficiency--empty',
+            '.product-card__sponsored': 'product-card__sponsored--empty',
+            '.product-card__price__old-price': 'product-card__price_empty'
+        };
+
+        if (classEmptyCheckMap[className]) {
+            let isClassEmpty = isClassPresentInQuery(currentQuery, classEmptyCheckMap[className]);
+            if (isClassEmpty) {
                 currentQuery.hide();
             }
             return;

package/src/js/page/plp-load-more.js

@@ -43,7 +43,7 @@ Wick.PLPLoadMore = {
       .finally(() => {
         hideLoader(Wick.PLPLoadMore.el.loader);
         Wick.PLPLoadMore.el.$loadMoreBtn.blur();
-        Wick.ProductBanner.checkProductsInColumn();
+        Wick.BannerPlacementManager.checkProductsInColumn();
         $(window).trigger('productBannerPositionChanged');
         Wick.EnergyEfficiency.drawEnergyLabels();
         Wick.PLP?.bindEvents();

package/src/js/page/utils/gift-cards-utils.js

@@ -19,12 +19,15 @@ const CURRENCY_KEYS = new Set([
 const GIFT_CARD_ALREADY_ADDED = 'GIFT_CARD_ALREADY_ADDED';
 const PIS_REQUEST_TIMEOUT = 'PIS-REQUEST-TIMEOUT';
 const PIS_INTEGRATION_ERROR = 'PIS-INTEGRATION-ERROR';
+const PIS_INSUFFICIENT_AMOUNT = 'PIS-INSUFFICIENT-AMOUNT';
+const PIS_PROCESSING_ERROR = 'PIS_PROCESSING_ERROR';
 const HYBRIS_REQUEST_TIMEOUT = 'HYBRIS-REQUEST-TIMEOUT';
-const HYBRIS_PIS_INTEGRATION_ERROR = 'HYBRIS-PIS-INTEGRATION-ERROR';
+const HYBRIS_PIS_INTEGRATION_ERROR = 'HYBRIS-PIS_INTEGRATION-ERROR';
+const HYBRIS_PIS_CONNECTION_ERROR = 'HYBRIS-PIS_CONNECTION-ERROR';
 const ZERO_BALANCE = 'ZERO_BALANCE'
 
 export const DEFAULT_ERROR_MESSAGE =
-    'Unable to use Gift Card at this time, please try later or click here for support.';
+    'Unfortunately there was a problem placing your order with Gift Card(s). Please click here for support.';
 
 export const OK_CODE = 0;
 
@@ -39,8 +42,11 @@ export const MESSAGE_BY_CODE = {
   [GIFT_CARD_ALREADY_ADDED]: 'Gift Card already added, please use a different card.',
   [PIS_REQUEST_TIMEOUT]: 'Unable to use Gift Card at this time, please try later or click here for support.',
   [PIS_INTEGRATION_ERROR]: 'Unable to use Gift Card at this time, please try later or click here for support.',
+  [PIS_INSUFFICIENT_AMOUNT]: 'Unfortunately there was a problem placing your order with Gift Card(s). Please click here for support.',
+  [PIS_PROCESSING_ERROR]: 'Unfortunately there was a problem placing your order with Gift Card(s). Please click here for support.',
   [HYBRIS_REQUEST_TIMEOUT]: 'Unable to use Gift Card at this time, please try later or click here for support.',
   [HYBRIS_PIS_INTEGRATION_ERROR]: 'Unable to use Gift Card at this time, please try later or click here for support.',
+  [HYBRIS_PIS_CONNECTION_ERROR]: 'Unable to use Gift Card at this time, please try later or click here for support.',
   [ZERO_BALANCE]: 'Insufficient funds available, please try another Gift Card or alternate payment method.',
   99: 'The entered Gift Card is invalid. For support click here.',
   [-1]: 'Gift Card is unavailable at this time, please try later. For support click here.',
@@ -51,6 +57,13 @@ export const PAY_MESSAGE_BY_CODE = {
   102: 'Unfortunately there was a problem with requesting your card details from the payment provider. Available funds on your Gift Card are unchanged.',
   103: 'Unfortunately there was a problem placing your order with Gift Card(s). Please click here for support.',
   104: 'Unfortunately there was a problem placing your order with Gift Card(s). Please click here for support.',
+  [PIS_REQUEST_TIMEOUT]: 'Unable to use Gift Card at this time, please try later or click here for support.',
+  [PIS_INTEGRATION_ERROR]: 'Unable to use Gift Card at this time, please try later or click here for support.',
+  [PIS_INSUFFICIENT_AMOUNT]: 'Unfortunately there was a problem placing your order with Gift Card(s). Please click here for support.',
+  [PIS_PROCESSING_ERROR]: 'Unfortunately there was a problem placing your order with Gift Card(s). Please click here for support.',
+  [HYBRIS_REQUEST_TIMEOUT]: 'Unable to use Gift Card at this time, please try later or click here for support.',
+  [HYBRIS_PIS_INTEGRATION_ERROR]: 'Unable to use Gift Card at this time, please try later or click here for support.',
+  [HYBRIS_PIS_CONNECTION_ERROR]: 'Unable to use Gift Card at this time, please try later or click here for support.',
 };
 
 export const ADD_GIFT_CARD = 'addGiftCard';

package/src/page_checkout_payment-details_guest-with-checkout-journey.html

@@ -9,7 +9,7 @@
 {{/content}}
 
 {{#content "aside"}}
-{{> order-summary delivery-address-v2.summary no-action=true id=1 basket-id=true}}
+{{> order-summary delivery-address-v2.summary no-action=true id=1 basket-id=true paymentsCheckoutV2=true}}
 {{/content}}
 
 {{#content "main"}}

package/src/page_my-order.html

@@ -61,7 +61,7 @@
     <div class="col-12 col-lg-3">
       <div class="wismo">
         {{> my-account/wismo_order-summary my_order.wismo-order-summary }}
-        {{> wismo-payment payment-billie=true}}
+        {{> wismo-payment payment-klarna=true}}
       </div>
     </div>
   </div>

package/src/page_payment-details-with-clearpay.html

@@ -1,4 +1,4 @@
-{{#extend "checkout" pageClass="page_checkout-delivery-new page_checkout-confirmation-new page_checkout" title="Checkout - Payment details with Clear Pay" isAsideSticky="true" clearPayIcon=true}}
+{{#extend "checkout" pageClass="page_checkout-delivery-new page_checkout-confirmation-new page_checkout" title="Checkout - Payment details with Clear Pay" isAsideSticky="true" clearPayIcon=true checkout=true}}
 
 {{#content "head" mode="append"}}
 <link type="text/css" rel="stylesheet" href="./css/pages/checkout-new.css">
@@ -16,7 +16,7 @@
 {{/content}}
 
 {{#content "aside"}}
-{{> order-summary delivery-address-v2.summary no-action=true id=1 basket-id=true clearPayIcon=clearPayIcon}}
+{{> order-summary delivery-address-v2.summary no-action=true id=1 basket-id=true clearPayIcon=clearPayIcon paymentsCheckoutV2=true checkout=true}}
 {{/content}}
 
 

package/src/page_plp_v2.html

@@ -1,4 +1,4 @@
-{{#extend "base" hybrisClass="hybris-class" pageClass="products-list-page" title="Products list" globalSearchV2="true" pagePlp=true}}
+{{#extend "base" hybrisClass="hybris-class" pageClass="products-list-page retail-media" title="Products list" globalSearchV2="true" pagePlp=true}}
 {{#content "head" mode="append" pagePlp=true}}
 <link type="text/css" rel="stylesheet" href="./css/components/global-search.css">
 {{/content}}
@@ -32,13 +32,23 @@
                         </div>
 
                         <div class="products-list products-list-v2">
-                            {{#each plp_load-more.results}}
-                            {{>card_product_v2}}
+                            {{#each search-result_v2.products}}
+                                {{>card_product_v2}}
                             {{/each}}
                             {{#if search-result_v2.product-banner}}
-                            {{#each search-result_v2.product-banner}}
-                            {{>card_product_banner_v2}}
-                            {{/each}}
+                                {{#each search-result_v2.product-banner}}
+                                    {{>card_product_banner_v2}}
+                                {{/each}}
+                            {{/if}}
+                            {{#if search-result_v2.sponsor-banner}}
+                                {{#each search-result_v2.sponsor-banner}}
+                                    {{>card_sponsor_banner}}
+                                {{/each}}
+                            {{/if}}
+                            {{#if search-result_v2.sponsor-product}}
+                                {{#each search-result_v2.sponsor-product}}
+                                    {{>card_sponsor_product}}
+                                {{/each}}
                             {{/if}}
                         </div>
                         <div class="load-more-wrap">

package/src/page_search-results.html

@@ -42,9 +42,19 @@
         </div>
 
         <div class="products-list products-list-v2">
-          {{#each plp_energy-efficiency.products}}
-            {{> card_product_v2}}
+          {{#each search-result_v2.products}}
+            {{>card_product_v2}}
           {{/each}}
+          {{#if search-result_v2.sponsor-banner}}
+            {{#each search-result_v2.sponsor-banner}}
+              {{>card_sponsor_banner}}
+            {{/each}}
+          {{/if}}
+          {{#if search-result_v2.sponsor-product}}
+            {{#each search-result_v2.sponsor-product}}
+              {{>card_sponsor_product}}
+            {{/each}}
+          {{/if}}
         </div>
 
         <div class="sort-products-list">

package/src/page_shopping-cart-v2.html

@@ -1,4 +1,4 @@
-{{#extend "basket-new" page_shopping-cart pageClass="page_basket basket" title="Basket" billieIcon=true}}
+{{#extend "basket-new" page_shopping-cart pageClass="page_basket basket" title="Basket" billieIcon=false}}
   {{#content "head" mode="append"}}
     <link type="text/css" rel="stylesheet" href="./css/pages/page_shopping-cart-v2.css">
     <link type="text/css" rel="stylesheet" href="./css/pages/checkout-new.css">
@@ -27,7 +27,7 @@
   }}
   {{> checkout-action  mod="mounted"}}
   {{> checkout-action  mod="mounted" view="mobile"}}
-  {{> summary-payment paymentsCheckoutV2=true billieIcon=true}}
+  {{> summary-payment paymentsCheckoutV2=true billieIcon=false}}
 {{/content}}
 {{#content "main"}}
   <input type="hidden" id="SUPPLIER_DELIVERED_7_DAYS" value="<b> Wickes Supplier </b> - Delivery within 7 days">

package/src/scss/components/card-product-banner.scss

@@ -4,7 +4,7 @@
   @include make-col(4);
   margin-bottom: 30px;
 
-  @include media-breakpoint-down(md) { 
+  @include media-breakpoint-down(md) {
     @include make-col(6);
   }
 
@@ -39,7 +39,7 @@
     padding: 0 15px;
 
     @include media-breakpoint-down(sm) {
-      display: inline-block; 
+      display: inline-block;
       padding: 0;
       width: 100%;
     }
@@ -49,4 +49,92 @@
     display: inline-block;
     width: 100%;
   }
-} 
+}
+
+.products-list {
+  .card-sponsor-product,
+  .card-sponsor-banner {
+    @include make-col(4);
+    margin-bottom: 0;
+  }
+
+  .card-sponsor-banner {
+    &__link {
+      display: inline-block;
+      width: 100%;
+      height: 100%;
+      padding: 0 15px;
+    }
+
+    &__image {
+      display: inline-block;
+      width: 100%;
+    }
+  }
+
+  .card-sponsor-product {
+    .product-card {
+      max-width: 100%;
+    }
+  }
+
+  .product-card__sponsored {
+    @include font-size(12);
+    @include line-height(16);
+    color: $squant;
+    font-weight: 400;
+    margin-top: -3px;
+    margin-bottom: 15px;
+    padding: 2px 4px;
+
+    &:not(.product-card__sponsored--empty) {
+      width: max-content;
+      background: $gray-light;
+    }
+  }
+}
+
+@include media-breakpoint-down(md) {
+  .products-list {
+    .card-sponsor-product,
+    .card-sponsor-banner {
+      @include make-col(6);
+
+      .card {
+        max-width: 100%;
+      }
+    }
+  }
+
+  .products-list-v2 {
+    .card-sponsor-product:nth-of-type(n+3) {
+      .card {
+        &:before {
+          content: none;
+        }
+      }
+    }
+  }
+}
+
+@include media-breakpoint-down(sm) {
+  .products-list {
+    .product-card__sponsored {
+      margin-right: auto;
+      margin-left: auto;
+    }
+
+    .card-sponsor-banner {
+      position: relative;
+
+      &::after {
+        content: '';
+        position: absolute;
+        bottom: 20px;
+        left: 5px;
+        width: calc(100% - 10px);
+        border-bottom: 1px solid $gray;
+      }
+    }
+  }
+}

package/src/scss/pages/page_product-details-v2.scss

@@ -143,6 +143,10 @@
       list-style: inherit;
     }
 
+    .share-buttons__list {
+      list-style: none;
+    }
+
     @include media-breakpoint-only(md) {
       padding-top: 35px;
     }