Lazy Loading for Prices #201

htuzel · 2024-10-31T13:06:18Z

Lazy Loading for Prices

Introduces lazy loading of promotional prices from SFCC instead of relying on indexed Algolia prices. This ensures real-time price accuracy and proper handling of promotional campaigns.

Features

New EnablePricingLazyLoad preference in Business Manager
Real-time price fetching from SFCC via new /Algolia-Price endpoint
Client-side price caching to minimize API calls
Dynamic update of promotional prices and messages

Testing

Enable "Pricing Lazy Load" in Business Manager
Create a test promotion in SFCC
Verify promotional prices and messages display correctly

The feature is optional and can be toggled in Business Manager settings.

This commit adds the `promotionalPrices` attribute to the Algolia product configuration in order to support fetching and indexing promotional prices for products.

The code changes in `algoliaLocalizedProduct.js` remove the `startDate` and `endDate` fields in the `promotionalPrices` attribute. These fields are no longer needed for indexing promotional prices for products in Algolia.

…operties Co-authored-by: Sylvain Bellone <[email protected]>

…LocalizedProduct.js Co-authored-by: Sylvain Bellone <[email protected]>

…lgoliasearch-sfcc-b2c into poc/promotional-prices

…a/instantsearch-config.js Co-authored-by: Sylvain Bellone <[email protected]>

This reverts commit b0f9b8a.

This reverts commit 96d9519.

sbellone

Many things can be simplified, but the most important thing that I'm surprised you don't even mention, is that you are deviating from the current behaviour of the cartridge:

We are currently indexing and displaying the sales price by default (the one returned by product.priceModel.price):

With lazy loading, you are displaying the list price, so we have the following:

What's the reason to do that? I think we need to discuss about it.

cartridges/int_algolia_sfra/cartridge/static/default/js/algolia/instantsearch-config.js

sbellone · 2024-10-31T15:37:17Z

test/mocks/dw/object/CustomObjectMgr.js

@@ -0,0 +1,7 @@
+jest.mock('dw/object/CustomObjectMgr', () => ({


What is this file for? You don't require it anywhere, plus the CustomObjectMgr is already declared in jest.setup.js

sbellone · 2024-10-31T15:40:02Z

cartridges/int_algolia_sfra/cartridge/static/default/js/algolia/instantsearch-config.js

+    if ((product && product.activePromotion && product.activePromotion.price) ||
+        (product && product.price && product.price.list && product.price.list.value)) {
+        return `<span class="strike-through list">
+                    <span class="value"> ${algoliaData.currencySymbol} ${(priceObj && priceObj.list && priceObj.list.value) || (priceObj && priceObj.sales && priceObj.sales.value)} </span>


Those super long conditions are hard to read and error prone.
Can you break them down into variables at the beginning of the function?

sbellone · 2024-10-31T16:07:54Z

cartridges/int_algolia_sfra/cartridge/static/default/js/algolia/instantsearch-config.js

@@ -242,16 +243,18 @@ function enableInstantSearch(config) {
                    showMoreText: algoliaData.strings.moreResults,
                    empty: '',
                    item(hit, { html, components }) {
-                        const hiddenCalloutMsg = !hit.calloutMsg && 'd-none';
+                        const displayCalloutMsg = (isPricingLazyLoad && 'd-none') || (!isPricingLazyLoad && (!hit.calloutMsg && 'd-none'));


This solution can be simplified: (isPricingLazyLoad || !hit.calloutMsg) && 'd-none'

But when there is a calloutMessage, displayCalloutMsg becomes set to false, so the callout message ends up with the following css classes:
class="callout-msg false callout-msg-placeholder-640188017195M"

It works, but it's not clean

sbellone · 2024-10-31T16:30:25Z

cartridges/int_algolia_sfra/cartridge/controllers/Algolia.js

+        for (var j = 0; j < promotions.length; j++) {
+            var promotion = promotions[j]
+            var apiPromotion = PromotionMgr.getPromotion(promotion.id);


Are you sure all this is needed? You are using the ProductFactory, which already sets the best active promotion in the sales price: https://github.com/SalesforceCommerceCloud/storefront-reference-architecture/blob/3a99a7990e70756eb21b775c73e7680a984be0d3/cartridges/app_storefront_base/cartridge/scripts/factories/price.js#L84

I've debugged and I confirm that I see the promotion price.

But in this case, we don't know which promotion is applied for this price. There may be multiple promotions, and we need to know which promotion is causing this price and display call out message.

SFRA systematically uses the first promotion: https://github.com/SalesforceCommerceCloud/storefront-reference-architecture/blob/3a99a7990e70756eb21b775c73e7680a984be0d3/cartridges/app_storefront_base/cartridge/scripts/helpers/pricing.js#L46

So we actually know. But this is an good reason to compute it ourselves, as technically there could be a better price than the one present in the sales price.

Co-authored-by: Sylvain Bellone <[email protected]>

htuzel · 2024-11-04T12:45:55Z

Many things can be simplified, but the most important thing that I'm surprised you don't even mention, is that you are deviating from the current behaviour of the cartridge:

We are currently indexing and displaying the sales price by default (the one returned by product.priceModel.price):

With lazy loading, you are displaying the list price, so we have the following:

What's the reason to do that? I think we need to discuss about it.

As default SFRA behaviour, it is rendering like that. That is the main reason and I keep default logic of SFRA

sbellone

As discussed, we can't display the list price as the strike-out price, because the promotion is calculated from the best pricebook price (i.e. in my screenshot, the 20% promotion is calculated from $299.99 which is the sales price, not from $500).

We suppose that to manage promotions, people either uses pricebooks only or promotions only. Maybe we'll need to offer the choice.

sbellone · 2024-11-04T15:14:42Z

cartridges/int_algolia_sfra/cartridge/controllers/Algolia.js

+        for (var j = 0; j < promotions.length; j++) {
+            var promotion = promotions[j]
+            var apiPromotion = PromotionMgr.getPromotion(promotion.id);


SFRA systematically uses the first promotion: https://github.com/SalesforceCommerceCloud/storefront-reference-architecture/blob/3a99a7990e70756eb21b775c73e7680a984be0d3/cartridges/app_storefront_base/cartridge/scripts/helpers/pricing.js#L46

So we actually know. But this is an good reason to compute it ourselves, as technically there could be a better price than the one present in the sales price.

sbellone

Looks ok, just updating a bit the wording

sbellone · 2024-11-05T15:28:35Z

metadata/algolia/meta/system-objecttype-extensions.xml

@@ -200,6 +200,14 @@ Setting this preference replaces the first two segments, the final index name be
                <default-value>false</default-value>
            </attribute-definition>

+            <attribute-definition attribute-id="Algolia_EnablePricingLazyLoad">
+                <display-name xml:lang="x-default">Enables Pricing Lazy Load</display-name>
+                <description xml:lang="x-default">It fetches prices from SFCC not Algolia</description>


Suggested change

<description xml:lang="x-default">It fetches prices from SFCC not Algolia</description>

<description xml:lang="x-default">Fetch prices from SFCC after the search results are returned from Algolia</description>

sbellone · 2024-11-05T15:55:01Z

metadata/algolia/meta/system-objecttype-extensions.xml

@@ -200,6 +200,14 @@ Setting this preference replaces the first two segments, the final index name be
                <default-value>false</default-value>
            </attribute-definition>

+            <attribute-definition attribute-id="Algolia_EnablePricingLazyLoad">
+                <display-name xml:lang="x-default">Enables Pricing Lazy Load</display-name>


Suggested change

<display-name xml:lang="x-default">Enables Pricing Lazy Load</display-name>

<display-name xml:lang="x-default">Enable prices lazy loading</display-name>

htuzel and others added 30 commits August 12, 2024 13:41

feat: Add promotionalPrices attribute to Algolia product configuration

e4b9a79

This commit adds the `promotionalPrices` attribute to the Algolia product configuration in order to support fetching and indexing promotional prices for products.

Logic changed for indexing promo end date and start date.

6dc76de

Improved logic

91b3440

Lazy load and refactoring for promotional prices

731dfb1

linter errors

f442ad6

unit test mockups

4d7c720

small refactoring for name convention

53ab58e

small refactorings

822fced

promotions

caf44d7

Prevented duplicate price fetching and double update issue

268c995

removed console.log

c69bf86

Some refactorings

6e8c05f

rulebased promotion logic removed

9747efe

Update cartridges/bm_algolia/cartridge/templates/resources/algolia.pr…

ea60034

…operties Co-authored-by: Sylvain Bellone <[email protected]>

Update cartridges/int_algolia/cartridge/scripts/algolia/model/algolia…

e370584

…LocalizedProduct.js Co-authored-by: Sylvain Bellone <[email protected]>

removed unnecessery imports

42b4126

som eimprovements

0e6eef7

linter fix

9919e16

Lazy load logic is improved

869aee8

lazy load reverted

b0f9b8a

lazy load remaining parts & refactoring

96d9519

Update cartridges/int_algolia/cartridge/scripts/algolia/model/algolia…

f97107f

…LocalizedProduct.js Co-authored-by: Sylvain Bellone <[email protected]>

CR fixes

66018c9

Merge branch 'poc/promotional-prices' of https://github.com/algolia/a…

3a6a018

…lgoliasearch-sfcc-b2c into poc/promotional-prices

Update cartridges/int_algolia_sfra/cartridge/static/default/js/algoli…

5cfe908

…a/instantsearch-config.js Co-authored-by: Sylvain Bellone <[email protected]>

Merge branch 'develop' into poc/promotional-prices

79e8745

Fixed linter errors and made some improvements

475bdf8

Updated code according to reviews

aa8b4b0

Revert "lazy load reverted"

7220478

This reverts commit b0f9b8a.

htuzel added 4 commits October 31, 2024 12:49

Revert "lazy load remaining parts & refactoring"

362a97d

This reverts commit 96d9519.

Merge branch 'develop' into poc/promotional-prices

5753b66

Fixed typo for preference name

f49695b

Removed console log

592363a

htuzel changed the title ~~Lay~~ Lazy Loading for Prices Oct 31, 2024

Fixed Constant value

09eae82

htuzel self-assigned this Oct 31, 2024

htuzel requested a review from sbellone October 31, 2024 13:16

Removed unneccesery comment

923799c

sbellone reviewed Oct 31, 2024

View reviewed changes

htuzel and others added 2 commits November 4, 2024 13:13

Apply suggestions from code review

0594fa7

Co-authored-by: Sylvain Bellone <[email protected]>

Refactoring for reviews

6bdb32d

Removed unnecessery file

8ac0263

htuzel requested a review from sbellone November 4, 2024 12:52

sbellone reviewed Nov 4, 2024

View reviewed changes

Improved list price logic according to defaul behaviour of cartridge

1321415

htuzel requested a review from sbellone November 5, 2024 12:12

htuzel added 2 commits November 5, 2024 14:52

Refactoring for getPriceHTML function

6d7f657

fixed linter errors

5bb400a

sbellone reviewed Nov 5, 2024

View reviewed changes

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Lazy Loading for Prices #201

Lazy Loading for Prices #201

htuzel commented Oct 31, 2024 •

edited

Loading

sbellone left a comment

sbellone Oct 31, 2024

sbellone Oct 31, 2024

sbellone Oct 31, 2024

sbellone Oct 31, 2024

htuzel Nov 4, 2024

sbellone Nov 4, 2024

htuzel commented Nov 4, 2024

sbellone left a comment

sbellone Nov 4, 2024

sbellone left a comment

sbellone Nov 5, 2024

sbellone Nov 5, 2024

		@@ -0,0 +1,7 @@
		jest.mock('dw/object/CustomObjectMgr', () => ({

	<description xml:lang="x-default">It fetches prices from SFCC not Algolia</description>
	<description xml:lang="x-default">Fetch prices from SFCC after the search results are returned from Algolia</description>

	<display-name xml:lang="x-default">Enables Pricing Lazy Load</display-name>
	<display-name xml:lang="x-default">Enable prices lazy loading</display-name>

Lazy Loading for Prices #201

Are you sure you want to change the base?

Lazy Loading for Prices #201

Conversation

htuzel commented Oct 31, 2024 • edited Loading

Lazy Loading for Prices

Features

Testing

sbellone left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

htuzel commented Nov 4, 2024

sbellone left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

sbellone left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

htuzel commented Oct 31, 2024 •

edited

Loading