@nuskin/product-components 3.18.0-cx24-6773.1 → 3.18.0-td-341.1

package/.releaserc

@@ -1,6 +1,6 @@
 {
     "branches": [
-      "master", {"name":"CX24-6773", "channel":"prerelease", "prerelease":"cx24-6773"}
+      "master", {"name":"TD-341", "channel":"prerelease", "prerelease":"td-341"}
     ],
     "plugins": [
         "@semantic-release/release-notes-generator",

package/components/NsProductList.vue

@@ -46,10 +46,12 @@
 
 <script>
 import { NsExpressiveLink, NsIcon, NsSpinner } from "@nuskin/design-components";
-import { StringService } from "@nuskin/ns-util";
+import { StringService, csStringService } from "@nuskin/ns-util";
 import { fromJsonString } from "@nuskin/ns-common-lib";
+import { getConfiguration } from "@nuskin/configuration-sdk";
 
 import NsProductCard from "./NsProductCard.vue";
+import { isEnabled } from "@nuskin/ns-feature-flags";
 
 /**
  * NsProductList
@@ -190,9 +192,24 @@ export default {
         await this.$nextTick();
 
         try {
-          const commonStrings = await StringService.getStrings(
-            commonStringKeys
-          );
+          const configs = await getConfiguration(["Mysite"]);
+          let useCSResources = false;
+          if (
+            configs &&
+            configs.Mysite &&
+            configs.Mysite.useCSResources &&
+            Array.isArray(configs.Mysite.useCSResources)
+          ) {
+            useCSResources = configs.Mysite.useCSResources.includes(
+              this.runConfig.country
+            );
+          }
+          let commonStrings = {};
+          if (useCSResources && isEnabled("td_341")) {
+            commonStrings = await csStringService.getStrings(commonStringKeys);
+          } else {
+            commonStrings = await StringService.getStrings(commonStringKeys);
+          }
           if (commonStrings && commonStrings.loadMore) {
             this.loadMoreText = commonStrings.loadMore;
           }

package/components/NsProductOffer.vue

@@ -772,7 +772,13 @@ export default {
               : this.products[sku].availableQuantity || 0;
             const selectedQuantity = this.products[sku].availability
               .selectedQuantity;
-
+            if (
+              this.products[sku].invalid ||
+              this.products[sku].data.availableQuantity <= 0 ||
+              !this.products[sku].availability.addToCart
+            ) {
+              return undefined;
+            }
             if (!this.products[sku].invalid && availableQuantity >= 1) {
               selectedQuantityArr[
                 this.products[sku].activeSku
@@ -790,18 +796,27 @@ export default {
         return;
       }
 
+      let options = {
+        add: {
+          item: {
+            qty: this.totalProductQuantity
+          }
+        }
+      };
+
       let checkoutProducts = [];
       const equinoxMarketsConfig = getCachedConfiguration("Equinox_Markets");
       const countryCode = equinoxMarketsConfig.country_code;
 
       if (equinoxMarketsConfig.active) {
+        window.sessionStorage.setItem("nstoast-allowed", "true");
         EquinoxCartService.addBundleToEquinoxCart(
           validSkus,
           this.products,
           selectedQuantityArr
         )
           .then(() => {
-            events.publish(events.shop.ADD_TO_CART);
+            events.publish(events.shop.ADD_TO_CART, options);
           })
           .catch(err => {
             console.error(`Failed to add ${validSkus} with Error: ${err} `);
@@ -906,6 +921,7 @@ export default {
 
         if (
           availability &&
+          availability.addToCart &&
           Object.keys(this.products[sku].data).length >= 1 &&
           availableQuantity >= 1
         ) {

package/docs/CHANGELOG.md

@@ -1 +1 @@
-# [3.18.0-cx24-6773.1](https://code.tls.nuskin.io/ns-am/ux/product-components/compare/v3.17.0...v3.18.0-cx24-6773.1) (2024-06-11)
+# [3.18.0-td-341.1](https://code.tls.nuskin.io/ns-am/ux/product-components/compare/v3.17.15...v3.18.0-td-341.1) (2024-10-22)

package/mixins/NsProductMixin.js

@@ -6,6 +6,7 @@ import {
 import {
   events,
   StringService,
+  csStringService,
   util,
   SitesSessionStorageService,
   ShoppingContext,
@@ -21,12 +22,11 @@ import {
   AdrService,
   FavoritesService,
   ProductStatus,
-  QualificationService as OldQualificationService,
   Product as ShopProduct,
   EquinoxCartService
 } from "@nuskin/ns-shop";
-import { default as NewQualificationService } from "@nuskin/exclusive-offer-sdk";
-import { retrieveTogglesBasedOnEnvironment } from "@nuskin/ns-feature-flags";
+import { isEnabled } from "@nuskin/ns-feature-flags";
+import QualificationService from "@nuskin/exclusive-offer-sdk";
 import webLoyalty from "@nuskin/ns-loyalty-web";
 import { getProp, getFullUrl } from "@nuskin/ns-common-lib";
 import { PriceType } from "@nuskin/ns-product-lib";
@@ -38,31 +38,6 @@ const PENDING_FAVORITE = "pendingFavorite";
 const KEY_BREADCRUMB_BACK = "breadcrumbBack";
 const BUNDLE = "BUNDLE";
 
-let flagsPromise = null;
-let featureFlags = false;
-const checkFlag = async flag => {
-  if (!featureFlags && !flagsPromise) {
-    flagsPromise = retrieveTogglesBasedOnEnvironment().then(
-      flagsFromServer => (featureFlags = flagsFromServer)
-    );
-  }
-
-  if (!featureFlags) {
-    await flagsPromise;
-  }
-
-  return featureFlags.has(flag);
-};
-
-const getQualificationService = async () => {
-  const equinoxMarket = (await getConfiguration(["Equinox_Markets"]))
-    .Equinox_Markets;
-  return equinoxMarket.active ||
-    (await checkFlag("cx15_use_new_exclusive_offer_api"))
-    ? NewQualificationService
-    : OldQualificationService;
-};
-
 /**
  * NsProductMixin
  *
@@ -273,7 +248,11 @@ const NsProductMixin = {
       return this.$NsProductUserService.isPreferredCustomer;
     },
     isWholesale() {
-      return this.$NsProductUserService.isWholesale;
+      if (this.$NsProductUserService.isLoggedIn) {
+        return this.$NsProductUserService.isUserWholesale;
+      } else {
+        return this.$NsProductUserService.isWholesale;
+      }
     },
     loyaltyStatusAndLinks() {
       return this.marketConfig.loyalty || {};
@@ -495,8 +474,44 @@ const NsProductMixin = {
         this.loyaltyStatusAndLinks.productOptedInRedeemNotEarn =
           "Save with Nu Skin Rewards";
 
-        StringService.getApplicationStrings("loyalty").then(content => {
-          this.loyaltyStrings = content;
+        const commonStringKeys = [
+          { key: "productDisplayNotOptedinMessage", dflt: "" },
+          {
+            key: "productDisplayOptedinMessage",
+            dflt: "{earnPercentage} Nu Skin enJoy Rewards Available!"
+          },
+          { key: "productOptedInEarnNotRedeem", dflt: "" },
+          {
+            key: "productOptedInRedeemNotEarn",
+            dflt:
+              "This product does not earn rewards points but is available to be redeemed for rewards points."
+          }
+        ];
+
+        try {
+          const configs = await getConfiguration(["Mysite"]);
+          let useCSResources = false;
+          if (
+            configs &&
+            configs.Mysite &&
+            configs.Mysite.useCSResources &&
+            Array.isArray(configs.Mysite.useCSResources)
+          ) {
+            useCSResources = configs.Mysite.useCSResources.includes(
+              this.runConfig.country
+            );
+          }
+          let loyalityStringsContent = {};
+          if (useCSResources && isEnabled("td_341")) {
+            loyalityStringsContent = await csStringService.getStrings(
+              commonStringKeys
+            );
+          } else {
+            loyalityStringsContent = await StringService.getStrings(
+              commonStringKeys
+            );
+          }
+          this.loyaltyStrings = loyalityStringsContent;
           // Link message to show to non-opted in users
           if (this.loyaltyStrings.productDisplayNotOptedinMessage) {
             this.loyaltyStatusAndLinks.landingPageLinkMessage = this.loyaltyStrings.productDisplayNotOptedinMessage;
@@ -538,12 +553,14 @@ const NsProductMixin = {
             );
             this.userLoyalty = loyaltyData;
           }
-        });
 
-        this.loyaltyStatusAndLinks.landingPage = this.localeReplace(
-          this.loyaltyStatusAndLinks.dashboardPage
-        );
-        this.loyaltyStatusAndLinks.siteUrl = this.siteUrl;
+          this.loyaltyStatusAndLinks.landingPage = this.localeReplace(
+            this.loyaltyStatusAndLinks.dashboardPage
+          );
+          this.loyaltyStatusAndLinks.siteUrl = this.siteUrl;
+        } catch (err) {
+          console.warn("Unable to retrieve loyalty strings translations.", err);
+        }
       }
     },
 
@@ -672,25 +689,31 @@ const NsProductMixin = {
       if (this.product) {
         // WARNING: There's a instanceof check on CartService.getAddToCartQty for the ns-shop Product, previously different
         const shopProduct = new ShopProduct(this.product);
-        // check if a user is qualified to purchase the product
-        CartService.getAddToCartQty(shopProduct)
-          .then(productQuantity => {
-            // WARNING: this.product is volatile here. re-check is using this.product.
-            this.maxQuantity = Math.min(
-              shopProduct.maxQuantity,
-              shopProduct.availableQuantity,
-              productQuantity
-            );
-          })
-          .catch(error => {
-            this.maxQuantity = 0;
-            console.error("Failed to retrieve add to cart quantity.", error);
-          })
-          .finally(() => {
-            this.setStatus();
-            this.checkedQualifications = true;
-            this.emitAvailability();
-          });
+
+        getConfiguration(["Equinox_Markets"]).then(({ Equinox_Markets }) => {
+          const { active } = Equinox_Markets;
+
+          const cartService = active ? EquinoxCartService : CartService;
+          // check if a user is qualified to purchase the product
+          cartService
+            .getAddToCartQty(shopProduct)
+            .then(productQuantity => {
+              // WARNING: this.product is volatile here. re-check is using this.product.
+              this.maxQuantity = Math.min(
+                shopProduct.maxQuantity,
+                productQuantity
+              );
+            })
+            .catch(error => {
+              this.maxQuantity = shopProduct.maxQuantity;
+              console.error("Failed to retrieve add to cart quantity.", error);
+            })
+            .finally(() => {
+              this.setStatus();
+              this.checkedQualifications = true;
+              this.emitAvailability();
+            });
+        });
       }
     },
 
@@ -723,6 +746,24 @@ const NsProductMixin = {
               )
             );
             this.statusMessageKey = "backOrderedWithDate";
+
+            let backOrderDate = new Date(this.product.backOrderDate);
+            let today = new Date();
+            if (backOrderDate < today) {
+              if (this.product.availableQuantity > 0) {
+                this.statusMessage = "";
+                this.statusMessageKey = "releasedForSale";
+                //BRW-4541 -- Only allow to purchase the atpQuantity if backorder date is in the past
+                this.maxQuantity = Math.min(
+                  this.product.maxQuantity,
+                  this.product.availableQuantity
+                );
+              } else {
+                this.statusMessage = this.localTranslations.outOfStock;
+                this.statusMessageKey = "outOfStock";
+                this.disable();
+              }
+            }
           }
         } else {
           this.disable();
@@ -755,9 +796,9 @@ const NsProductMixin = {
       this.exclusiveOfferMessage = "";
       if (this.isExclusive) {
         if (this.isLoggedIn) {
-          const productQualification = await (
-            await getQualificationService()
-          ).getQualification(this.activeSku);
+          const productQualification = await QualificationService.getQualification(
+            this.activeSku
+          );
 
           let cartQuantity = 0;
 
@@ -787,10 +828,10 @@ const NsProductMixin = {
               cartQuantity = (cartItem || {}).qty || 0;
             } else {
               const cartData =
-                (await (
-                  await getQualificationService()
-                ).convertCartDataToBaseSkus(CartService.getItemData(), true)) ||
-                {};
+                (await QualificationService.convertCartDataToBaseSkus(
+                  CartService.getItemData(),
+                  true
+                )) || {};
               const cartItem = cartData[this.baseSku] || {};
               cartQuantity = cartItem.qty || 0;
             }
@@ -835,22 +876,8 @@ const NsProductMixin = {
      * Set product pricing
      */
     setStandardPricing() {
-      const equinoxMarketsConfig = getCachedConfiguration("Equinox_Markets");
-      const isGraphQLActive = equinoxMarketsConfig.MySite_graphql_active;
-
       // set price and points
       this.originalPrice = this.product.getPricing(PriceType.WRTL);
-
-      //graphQL adjustments
-      if (isGraphQLActive) {
-        this.originalPrice =
-          this.product.childSkus &&
-          this.product.childSkus.length &&
-          this.getPriceType() === PriceType.WWHL
-            ? this.product.getPricing(PriceType.WHL)
-            : this.product.getPricing(PriceType.RTL);
-      }
-
       this.priceType = this.getPriceType();
       this.price = this.product.getPricing(this.priceType);
       this.points = this.product.getPvFixed();
@@ -902,33 +929,20 @@ const NsProductMixin = {
         // set sales event pricing and points
         this.originalPriceType = this.product.priceType;
 
-        this.originalPrice =
-          isEquinoxEnabled && !isGraphQLActive
-            ? this.product.getPricing(PriceType.WRTL)
-            : this.product.getOriginalPrice();
-
-        //workaround for graphQL active to show original price
         if (isGraphQLActive) {
-          this.originalPrice =
-            this.product.childSkus &&
-            this.product.childSkus.length &&
-            this.getPriceType() === PriceType.WWHL
-              ? this.product.getPricing(PriceType.WHL)
-              : this.product.getPricing(PriceType.RTL);
+          this.originalPrice = this.product.getPricing(this.originalPriceType);
+          this.product.priceType = `${this.eventName}-${this.originalPriceType}`;
+        } else {
+          this.product.getOriginalPrice();
         }
 
         this.priceType = this.product.priceType;
-
-        this.price = this.product.getPrice();
+        this.price = this.product.getPricing(this.priceType);
 
         //If EQ market, always show the discounted price if product has promotion
         //Hence, we set the price to member(wholesale / PriceType.WADW) if the price type PriceType.WADR (retail)
         //this is inline with the change in business rules to always show the discounted prices
-        if (
-          isEquinoxEnabled &&
-          !isGraphQLActive &&
-          this.getAdrPriceType() == PriceType.WADR
-        ) {
+        if (isGraphQLActive && this.getAdrPriceType() == PriceType.WADR) {
           this.adrPrice = this.product.getPricing(PriceType.WADW);
         }
 
@@ -937,13 +951,9 @@ const NsProductMixin = {
         //for product that has promotion
         //set the price to  WWHL if this.getPriceType() === WRTL
         //promotion price is set in product.js   setPriceAndPvFromType function
-        if (
-          isEquinoxEnabled &&
-          !isGraphQLActive &&
-          this.getPriceType() == PriceType.WRTL
-        ) {
-          this.price = this.product.getPricing(PriceType.WWHL);
-        }
+        // if (isGraphQLActive && this.getPriceType() == PriceType.WRTL) {
+        //   this.price = this.product.getPricing(PriceType.WWHL);
+        // }
 
         if (this.user && this.isDistributor) {
           this.points = this.product.getPvFixed();
@@ -1162,6 +1172,14 @@ const NsProductMixin = {
                   productToAdd.equinoxProductId = productIdentifier;
                   //productToAdd.properties = productData.products[0].properties
                 }
+                if (
+                  productToAdd.backOrderDate &&
+                  new Date(productToAdd.backOrderDate) > new Date()
+                ) {
+                  productToAdd.inventory = "BACKORDER";
+                  productToAdd.properties.isBackOrdered = true;
+                  productToAdd.properties.inventoryStatus = "BACKORDER";
+                }
                 options.product = new ShopProduct(productToAdd);
                 options.add = {
                   item: {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nuskin/product-components",
-  "version": "3.18.0-cx24-6773.1",
+  "version": "3.18.0-td-341.1",
   "description": "Nu Skin Product Components",
   "main": "index.js",
   "scripts": {
@@ -29,8 +29,8 @@
     "@nuskin/ns-core-styles": "2.11.2",
     "@nuskin/ns-icon": "^2.12.0",
     "@nuskin/ns-loyalty-web": "1.5.6",
-    "@nuskin/ns-product-lib": "2.16.0",
-    "@nuskin/ns-shop": "6.11.7",
+    "@nuskin/ns-product-lib": "2.19.0",
+    "@nuskin/ns-shop": "7.0.10",
     "@nuskin/product-recommendation": "2.0.1",
     "axios": "1.6.7",
     "lodash": "4.17.21",

package/services/EQPromotionService.js

@@ -41,6 +41,8 @@ const buildPayload = product => {
     let personalOffer = sessionStorage.getItem("personalOffer");
     if (personalOffer !== null) {
       personalOffer = JSON.parse(personalOffer);
+    } else {
+      personalOffer = { products: [] };
     }
     const matchedProduct = personalOffer.products.filter(
       offerProduct => offerProduct.sku === product.sku
@@ -55,18 +57,45 @@ const buildPayload = product => {
     const skus = [];
     if (product && product.childSkus) {
       product.childSkus.forEach(childSku => {
-        if (childSku.type === "MANDATORY") {
+        if (
+          childSku.type === "MANDATORY" &&
+          !skus.some(sku => sku.productId === childSku.productId)
+        ) {
           skus.push({
-            skuId:
-              selectedVariants !== null && selectedVariants[childSku.productId]
-                ? selectedVariants[childSku.productId]
-                : childSku.skuId,
+            skuId: childSku.skuId,
             productId: childSku.productId,
-            quantity: childSku.skuQuantity,
-            type: "bundle"
+            type: "bundle",
+            quantity: childSku.skuQuantity
           });
         }
       });
+
+      if (selectedVariants !== null) {
+        for (const productId in selectedVariants) {
+          let isOptionalProduct = true;
+          skus.forEach(finalSku => {
+            if (finalSku.productId === productId) {
+              isOptionalProduct = false;
+              finalSku.skuId = selectedVariants[productId];
+            }
+          });
+
+          if (isOptionalProduct) {
+            // this means this is optional product
+            const optionalProduct = product.childSkus.filter(
+              childSku => childSku.productId === productId
+            )[0];
+            if (optionalProduct) {
+              skus.push({
+                skuId: selectedVariants[productId],
+                productId: optionalProduct.productId,
+                type: "bundle",
+                quantity: optionalProduct.skuQuantity
+              });
+            }
+          }
+        }
+      }
     }
 
     payload.skus = skus;

package/services/NsProductAppService.js

@@ -3,8 +3,11 @@ import Vue from "vue";
 import {
   RunConfigService,
   ConfigService,
-  StringService
+  StringService,
+  csStringService
 } from "@nuskin/ns-util";
+import { getConfiguration } from "@nuskin/configuration-sdk";
+import { isEnabled } from "@nuskin/ns-feature-flags";
 
 import { isNullOrEmpty } from "@nuskin/ns-common-lib";
 
@@ -177,10 +180,31 @@ if (!NsProductAppService) {
         ];
 
         try {
-          const commonStrings = await StringService.getStrings(
-            commonStringKeys,
-            this.locale
-          );
+          const configs = await getConfiguration(["Mysite"]);
+          let useCSResources = false;
+          if (
+            configs &&
+            configs.Mysite &&
+            configs.Mysite.useCSResources &&
+            Array.isArray(configs.Mysite.useCSResources)
+          ) {
+            useCSResources = configs.Mysite.useCSResources.includes(
+              this.runConfig.country
+            );
+          }
+
+          let commonStrings = {};
+          if (useCSResources && isEnabled("td_341")) {
+            commonStrings = await csStringService.getStrings(
+              commonStringKeys,
+              this.locale
+            );
+          } else {
+            commonStrings = await StringService.getStrings(
+              commonStringKeys,
+              this.locale
+            );
+          }
 
           this.appendTranslations(commonStrings);
         } catch (err) {

package/services/NsProductDataService.js

@@ -9,7 +9,10 @@ import { isNullOrEmpty } from "@nuskin/ns-common-lib";
 import { ProductDataService } from "@nuskin/ns-product";
 import { Product, PriceType } from "@nuskin/ns-product-lib";
 import { equinoxLocalStorage } from "@nuskin/ns-util";
-import { getConfiguration } from "@nuskin/configuration-sdk";
+import {
+  getConfiguration,
+  getCachedConfiguration
+} from "@nuskin/configuration-sdk";
 
 class ProductDataBatch {
   constructor(id, skus) {
@@ -269,9 +272,7 @@ if (!NsProductDataService) {
           return;
         }
 
-        const equinoxMarketConfig = (
-          await getConfiguration(["Equinox_Markets"])
-        ).Equinox_Markets;
+        const equinoxMarketConfig = getCachedConfiguration("Equinox_Markets");
 
         // product data response has products
         if (productData.count && productData.products.length) {

package/stories/NsProductMixinPreview.vue

@@ -200,40 +200,11 @@
 </template>
 
 <script>
-import {
-  QualificationService as OldQualificationService,
-  CartService
-} from "@nuskin/ns-shop";
-import { getConfiguration } from "@nuskin/configuration-sdk";
-import { default as NewQualificationService } from "@nuskin/exclusive-offer-sdk";
+import { CartService } from "@nuskin/ns-shop";
+import QualificationService from "@nuskin/exclusive-offer-sdk";
 import NsProductMixin from "../mixins/NsProductMixin";
 import "@nuskin/ns-core-styles/src/dist/main.css";
 
-let equinoxMarket = {
-  promise: getConfiguration(["Equinox_Markets"]).then(config => {
-    equinoxMarket = {
-      value:
-        config && config.Equinox_Markets
-          ? !!config.Equinox_Markets.active
-          : false,
-      promise: null,
-      loaded: true
-    };
-  }),
-  loaded: false,
-  value: undefined
-};
-
-const getQualificationService = async () => {
-  if (!equinoxMarket.loaded) {
-    await equinoxMarket.promise;
-  }
-  if (equinoxMarket.value) {
-    return NewQualificationService;
-  }
-  return OldQualificationService;
-};
-
 export default {
   name: "NsProductMixinPreview",
   filters: {
@@ -407,9 +378,9 @@ export default {
   async mounted() {
     if (this.isExclusive) {
       if (this.isLoggedIn) {
-        this.productQualification = await (
-          await getQualificationService()
-        ).getQualification(this.activeSku);
+        this.productQualification = await QualificationService.getQualification(
+          this.activeSku
+        );
 
         this.cartItem = await CartService.getFirstItemBySku(this.activeSku, {
           cartOrderItems: true