\n
\n {renderProductPlacementImage(\n imageSettings,\n context.request.gridSettings,\n productImageUrl,\n product.primaryImageUrl,\n product.name,\n context\n )}\n
\n
\n
{product.name} \n {renderPrice(\n context,\n typeName,\n id,\n product.basePrice,\n product.price,\n savingsText,\n freePriceText,\n originalPriceText,\n currentPriceText,\n isPriceMinMaxEnabled,\n priceResources\n )}\n {isUnitOfMeasureEnabled && renderProductUnitOfMeasure(product.defaultUnitOfMeasure)}\n {renderDescription(product.description)}\n \n
\n \n {renderProductPlacementImage(\n imageSettings,\n context.request.gridSettings,\n productImageUrl,\n product.primaryImageUrl,\n product.name,\n context\n )}\n
\n \n
{product.name} \n {renderPrice(\n context,\n typeName,\n id,\n product.basePrice,\n product.price,\n savingsText,\n freePriceText,\n originalPriceText,\n currentPriceText\n )}\n {isUnitOfMeasureEnabled && renderProductUnitOfMeasure(product.defaultUnitOfMeasure)}\n \n \n )}\n {renderProductDimensions(product.attributeValues)}\n {!context.app.config.hideRating &&\n renderRating(context, typeName, id, product.averageRating, product.totalRatings, ratingAriaLabel, ratingCountAriaLabel)}\n {renderProductAvailability(inventoryLabel)}\n {quickViewButton && renderQuickView(quickViewButton, product.recordId)}\n {productComparisonButton && renderProductComparisonButton(productComparisonButton, product, getCatalogId(context.request))}\n \n );\n};\n\nfunction renderLabel(\n name?: string,\n price?: string,\n rating?: number,\n ratingAriaLabelText?: string,\n reviewCount?: number,\n ratingCountAriaLabelText?: string\n): string {\n const reviewCountArialableText = getReviewAriaLabel(reviewCount, ratingCountAriaLabelText ?? '');\n return `${name ?? ''} ${price ?? ''} ${getRatingAriaLabel(rating, ratingAriaLabelText)}${\n reviewCountArialableText ? ` ${reviewCountArialableText}` : ''\n }`;\n}\n\nfunction renderDescription(description?: string): JSX.Element | null {\n return {description}
;\n}\n\nfunction getRatingAriaLabel(rating?: number, ratingAriaLabel?: string): string {\n if (rating && ratingAriaLabel) {\n const roundedRating = rating.toFixed(2);\n return format(ratingAriaLabel || '', roundedRating, '5');\n }\n return '';\n}\n\nfunction getReviewAriaLabel(reviewCount?: number, ratingCountAriaLabelText?: string): string {\n if (reviewCount && ratingCountAriaLabelText) {\n return format(ratingCountAriaLabelText || '', reviewCount);\n }\n return '';\n}\n\nfunction renderRating(\n coreContext: ICoreContext,\n moduleTypeName: string,\n moduleId: string,\n avgRating?: number,\n totalRatings?: number,\n ariaLabel?: string,\n ratingCountAriaLabel?: string\n): JSX.Element | null {\n if (!avgRating) {\n return null;\n }\n\n const numberRatings = totalRatings?.toString() || undefined;\n const ratingAriaLabelText = getRatingAriaLabel(avgRating, ariaLabel);\n const ratingCountAriaLabelText = getReviewAriaLabel(Number(numberRatings), ratingCountAriaLabel);\n\n return (\n >\n): JSX.Element | null {\n if (!imageUrl || !gridSettings || !imageSettings) {\n return null;\n }\n // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access, @typescript-eslint/no-unsafe-assignment -- Site level config can be of any type.\n const contextConfig = context?.app.config?.placeholderImageName;\n const emptyPlaceHolderImage = contextConfig as string;\n let fallbackImageSource = fallbackImageUrl;\n if (emptyPlaceHolderImage && fallbackImageUrl) {\n fallbackImageSource = `${fallbackImageUrl},${emptyPlaceHolderImage}`;\n }\n const img: IImageData = {\n src: imageUrl,\n altText: altText ? altText : '',\n fallBackSrc: fallbackImageSource\n };\n const imageProps = {\n gridSettings,\n imageSettings\n };\n imageProps.imageSettings.cropFocalRegion = true;\n return (\n = msdyn365Commerce.createComponentOverride<\n IProductComponentV2\n>('ProductV2', { component: ProductCardV2, ...PriceComponentActions });\n\nexport default ProductComponentV2;\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport { IProductsDimensionsAvailabilities } from '@msdyn365-commerce/commerce-entities';\nimport {\n IPriceComponentResources,\n ISwatchItem,\n PriceComponent,\n ProductComponentSwatchComponent,\n RatingComponent\n} from '@msdyn365-commerce/components';\nimport {\n getCatalogId,\n IAny,\n IComponent,\n IComponentProps,\n ICoreContext,\n IGeneric,\n IGridSettings,\n IImageData,\n IImageSettings,\n Image,\n msdyn365Commerce\n} from '@msdyn365-commerce/core';\nimport { AttributeSwatch, AttributeValue, ProductDimension, ProductPrice, ProductSearchResult } from '@msdyn365-commerce/retail-proxy';\nimport {\n ArrayExtensions,\n convertDimensionTypeToProductDimensionType,\n Dictionary,\n DimensionTypes,\n generateImageUrl,\n getProductPageUrlSync,\n IDimensionsApp,\n StringExtensions,\n validateCatalogId\n} from '@msdyn365-commerce-modules/retail-actions';\nimport {\n format,\n getPayloadObject,\n getTelemetryAttributes,\n ITelemetryContent,\n onTelemetryClick\n} from '@msdyn365-commerce-modules/utilities';\nimport React, { useState } from 'react';\n\nexport interface IProductComponentProps extends IComponentProps<{ product?: ProductSearchResult }> {\n className?: string;\n imageSettings?: IImageSettings;\n savingsText?: string;\n freePriceText?: string;\n originalPriceText?: string;\n currentPriceText?: string;\n ratingAriaLabel?: string;\n ratingCountAriaLabel?: string;\n allowBack?: boolean;\n telemetryContent?: ITelemetryContent;\n quickViewButton?: React.ReactNode;\n productComparisonButton?: React.ReactNode;\n isEnabledProductDescription?: boolean;\n isPriceMinMaxEnabled?: boolean;\n priceResources?: IPriceComponentResources;\n inventoryLabel?: string;\n dimensionAvailabilities?: IProductsDimensionsAvailabilities[];\n swatchItemAriaLabel?: string;\n}\n\nexport interface IProductComponent extends IComponent {}\n\nconst PriceComponentActions = {};\n\n/**\n * Gets the product page url from the default swatch selected.\n * @param productData - Product card to be rendered.\n * @returns The default color swatch selected if any.\n */\nfunction getDefaultSwatchSelected(coreContext: ICoreContext, productData?: ProductSearchResult): AttributeSwatch | null {\n if (!productData || !productData.AttributeValues) {\n return null;\n }\n\n const siteContext = coreContext as ICoreContext;\n const dimensionToPreSelectInProductCard = siteContext.app.config.dimensionToPreSelectInProductCard;\n\n const attributeSwatches = productData.AttributeValues.find(\n attributeValue => attributeValue.KeyName?.toLocaleLowerCase() === dimensionToPreSelectInProductCard\n )?.Swatches;\n\n if (!ArrayExtensions.hasElements(attributeSwatches)) {\n return null;\n }\n\n const defaultSwatch = attributeSwatches.find(item => item.IsDefault === true) ?? attributeSwatches[0];\n return defaultSwatch;\n}\n\n/**\n * Gets the product image from the default swatch selected.\n * @param coreContext - Context of the module using the component.\n * @param productData - Product card to be rendered.\n * @returns The product card image url.\n */\nfunction getProductImageUrlFromDefaultSwatch(coreContext: ICoreContext, productData?: ProductSearchResult): string | undefined {\n const defaultSwatch = getDefaultSwatchSelected(coreContext, productData);\n const swatchProductImageUrls = defaultSwatch?.ProductImageUrls;\n if (!ArrayExtensions.hasElements(swatchProductImageUrls)) {\n return productData?.PrimaryImageUrl;\n }\n\n return generateImageUrl(swatchProductImageUrls[0], coreContext.request.apiSettings);\n}\n\n/**\n * Updates the product url link to product details page.\n * @param productDetailsPageUrl - Product page url.\n * @param coreContext - Context of the module using the component.\n * @param queryString - Querystring to be added to the URL.\n * @returns The update product page url.\n */\nfunction updateProductUrl(productDetailsPageUrl: string, coreContext: ICoreContext, queryString: string): string {\n const sourceUrl = new URL(productDetailsPageUrl, coreContext.request.apiSettings.baseUrl);\n if (sourceUrl.search) {\n sourceUrl.search += `&${queryString}`;\n } else {\n sourceUrl.search += queryString;\n }\n\n const updatedUrl = new URL(sourceUrl.href);\n return updatedUrl.pathname + sourceUrl.search;\n}\n\n/**\n * Gets the react node for product unit of measure display.\n * @param unitOfMeasure - DefaultUnitOfMeasure property from product.\n * @returns The node representing markup for unit of measure component.\n */\nfunction renderProductUnitOfMeasure(unitOfMeasure?: string): JSX.Element | null {\n if (!unitOfMeasure) {\n return null;\n }\n return (\n \n {unitOfMeasure} \n
\n );\n}\n\n/**\n * Gets the react node for product availability.\n * @param inventoryAvailabilityLabel - The product information.\n * @returns The node representing markup for product availability.\n */\nfunction renderProductAvailability(inventoryAvailabilityLabel: string | undefined): JSX.Element | null {\n if (!inventoryAvailabilityLabel || inventoryAvailabilityLabel === '') {\n return null;\n }\n\n return (\n \n {inventoryAvailabilityLabel} \n
\n );\n}\n\n/**\n * Renders product comparison button similar to the quick view button.\n * @param productComparisonButton - React element of the button.\n * @param product - Current product info.\n * @param catalogId - Current catalog.\n * @returns React element for the specific product.\n */\nfunction renderProductComparisonButton(\n productComparisonButton: React.ReactNode,\n product: ProductSearchResult,\n catalogId: number\n): JSX.Element | undefined {\n validateCatalogId(catalogId);\n return React.cloneElement(productComparisonButton as React.ReactElement, { product, catalogId });\n}\n\n/**\n * Gets the product page url from the default swatch selected.\n * @param coreContext - Context of the module using the component.\n * @param productUrl - Product page url for the product card.\n * @param productData - Product card to be rendered.\n * @returns The product card image url.\n */\nfunction getProductPageUrlFromDefaultSwatch(\n coreContext: ICoreContext,\n productUrl: string,\n productData?: ProductSearchResult\n): string | undefined {\n const defaultSwatch = getDefaultSwatchSelected(coreContext, productData);\n if (!defaultSwatch?.SwatchValue) {\n return productUrl;\n }\n\n const siteContext = coreContext as ICoreContext;\n const dimensionToPreSelectInProductCard = siteContext.app.config.dimensionToPreSelectInProductCard;\n\n const queryStringEncoded = encodeURIComponent(defaultSwatch.SwatchValue);\n const queryString = `${dimensionToPreSelectInProductCard}=${queryStringEncoded}`;\n return updateProductUrl(productUrl, coreContext, queryString);\n}\n\nconst ProductCard: React.FC = ({\n data,\n context,\n imageSettings,\n savingsText,\n freePriceText,\n originalPriceText,\n currentPriceText,\n ratingAriaLabel,\n ratingCountAriaLabel,\n allowBack,\n typeName,\n id,\n telemetryContent,\n quickViewButton,\n productComparisonButton,\n isEnabledProductDescription,\n isPriceMinMaxEnabled,\n priceResources,\n inventoryLabel,\n dimensionAvailabilities,\n swatchItemAriaLabel\n}) => {\n const product = data.product;\n\n let productUrl = getProductPageUrlSync(product?.Name ?? '', product?.RecordId ?? Number.MIN_VALUE, context.actionContext, undefined);\n if (allowBack) {\n productUrl = updateProductUrl(productUrl, context, 'back=true');\n }\n const productImageUrlFromSwatch = getProductImageUrlFromDefaultSwatch(context, product) ?? product?.PrimaryImageUrl;\n const productPageUrlFromSwatch = getProductPageUrlFromDefaultSwatch(context, productUrl, product) ?? productUrl;\n const [productPageUrl, setProductPageUrl] = useState(productPageUrlFromSwatch);\n const [productImageUrl, setProductImageUrl] = useState(productImageUrlFromSwatch);\n React.useEffect(() => {\n setProductPageUrl(productPageUrlFromSwatch);\n setProductImageUrl(productImageUrlFromSwatch);\n }, [productUrl, productPageUrlFromSwatch, productImageUrlFromSwatch]);\n const [selectedSwatchItems] = useState(new Dictionary());\n // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment,@typescript-eslint/no-unsafe-member-access -- app context is generic\n const enableStockCheck = context.app.config.enableStockCheck;\n\n const siteContext = context as ICoreContext;\n const dimensionToPreSelectInProductCard = siteContext.app.config.dimensionToPreSelectInProductCard;\n\n /**\n * Updates the product page and Image url based on swatch selected.\n * @param coreContext - Context of the caller.\n * @param swatchItem - Dimension swatch selected.\n */\n const updatePageAndImageUrl = React.useCallback(\n (coreContext: ICoreContext, swatchItem: ISwatchItem) => {\n const dimensionType = swatchItem.dimensionType;\n selectedSwatchItems.setValue(dimensionType, swatchItem);\n if (StringExtensions.isNullOrWhitespace(swatchItem.value)) {\n return;\n }\n const queryString = `${dimensionType}=${swatchItem.value}`;\n let productPageUrlWithSwatch = '';\n if (productPageUrl.includes(dimensionType)) {\n const newUrl = new URL(productPageUrl, coreContext.request.apiSettings.baseUrl);\n newUrl.searchParams.delete(dimensionType);\n productPageUrlWithSwatch = updateProductUrl(newUrl.toString(), context, queryString);\n } else {\n productPageUrlWithSwatch = updateProductUrl(productPageUrl, context, queryString);\n }\n setProductPageUrl(productPageUrlWithSwatch);\n if (dimensionType === dimensionToPreSelectInProductCard) {\n const swatchProductImageUrl = ArrayExtensions.hasElements(swatchItem.productImageUrls)\n ? swatchItem.productImageUrls[0]\n : undefined;\n const newImageUrl = generateImageUrl(swatchProductImageUrl, coreContext.request.apiSettings);\n setProductImageUrl(newImageUrl);\n }\n },\n [selectedSwatchItems, context, productPageUrl]\n );\n\n if (!product) {\n return null;\n }\n\n /**\n * Checks if rendering the particular dimensions is allowed for product card.\n * @param dimensionType - Dimension to be displayed.\n * @returns Updates the state with new product page url.\n */\n function shouldDisplayDimension(dimensionType: string): boolean {\n const dimensionsContext = context as ICoreContext;\n const dimensionsToDisplayOnProductCard = dimensionsContext.app.config.dimensionsInProductCard;\n return (\n ArrayExtensions.hasElements(dimensionsToDisplayOnProductCard) &&\n !dimensionsToDisplayOnProductCard.includes(DimensionTypes.none) &&\n dimensionsToDisplayOnProductCard.includes(dimensionType.toLocaleLowerCase() as DimensionTypes)\n );\n }\n\n /**\n * Gets the react node for product dimension as swatch.\n * @param attributeValues - Attribute value property from product.\n * @returns The node representing markup for unit of measure component.\n */\n function renderProductDimensions(attributeValues?: AttributeValue[]): JSX.Element | null {\n if (!attributeValues) {\n return null;\n }\n\n return (\n \n {attributeValues.map((item: AttributeValue) => {\n const dimensionTypeValue = item.KeyName?.toLocaleLowerCase() ?? '';\n if (!shouldDisplayDimension(dimensionTypeValue)) {\n return null;\n }\n\n const siteContext = context as ICoreContext
;\n const dimensionToPreSelectInProductCard = siteContext.app.config.dimensionToPreSelectInProductCard;\n const dimensionType = dimensionTypeValue as DimensionTypes;\n const swatches =\n item.Swatches?.map(swatchItem => {\n return {\n itemId: `${item.RecordId ?? ''}-${dimensionTypeValue}-${swatchItem.SwatchValue ?? ''}`,\n value: swatchItem.SwatchValue ?? '',\n dimensionType,\n colorHexCode: swatchItem.SwatchColorHexCode,\n imageUrl: swatchItem.SwatchImageUrl,\n productImageUrls: swatchItem.ProductImageUrls,\n isDefault: swatchItem.IsDefault,\n swatchItemAriaLabel: swatchItemAriaLabel ? format(swatchItemAriaLabel, dimensionType) : '',\n isDisabled:\n enableStockCheck &&\n dimensionAvailabilities?.find(\n dimensionAvailability => dimensionAvailability.value === (swatchItem.SwatchValue ?? '')\n )?.isDisabled\n };\n }) ?? [];\n if (\n dimensionType === dimensionToPreSelectInProductCard &&\n ArrayExtensions.hasElements(swatches) &&\n !swatches.some(swatch => swatch.isDefault)\n ) {\n swatches[0].isDefault = true;\n }\n return (\n (swatches => {\n return {\n DimensionTypeValue: convertDimensionTypeToProductDimensionType(swatches.dimensionType),\n DimensionValue: {\n RecordId: 0,\n Value: swatches.value\n }\n };\n });\n return React.cloneElement(quickview as React.ReactElement, { selectedProductId: item, selectedDimensions });\n }\n\n // Construct telemetry attribute to render\n const payLoad = getPayloadObject('click', telemetryContent!, '', product.RecordId.toString());\n\n const attribute = getTelemetryAttributes(telemetryContent!, payLoad);\n\n // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access -- -- Do not need type check for appsettings\n const isUnitOfMeasureEnabled = context.app.config && context.app.config.unitOfMeasureDisplayType === 'buyboxAndBrowse';\n\n return (\n <>\n {isEnabledProductDescription ? (\n \n \n
\n {renderProductPlacementImage(\n imageSettings,\n context.request.gridSettings,\n productImageUrl,\n product.PrimaryImageUrl,\n product.Name,\n context\n )}\n
\n
\n
{product.Name} \n {renderPrice(\n context,\n typeName,\n id,\n product.BasePrice,\n product.Price,\n savingsText,\n freePriceText,\n originalPriceText,\n currentPriceText,\n isPriceMinMaxEnabled,\n priceResources\n )}\n {isUnitOfMeasureEnabled && renderProductUnitOfMeasure(product.DefaultUnitOfMeasure)}\n {renderDescription(product.Description)}\n \n
\n \n {renderProductPlacementImage(\n imageSettings,\n context.request.gridSettings,\n productImageUrl,\n product.PrimaryImageUrl,\n product.Name,\n context\n )}\n
\n \n
{product.Name} \n {renderPrice(\n context,\n typeName,\n id,\n product.BasePrice,\n product.Price,\n savingsText,\n freePriceText,\n originalPriceText,\n currentPriceText\n )}\n {isUnitOfMeasureEnabled && renderProductUnitOfMeasure(product.DefaultUnitOfMeasure)}\n \n \n )}\n {renderProductDimensions(product.AttributeValues)}\n {!context.app.config.hideRating &&\n renderRating(context, typeName, id, product.AverageRating, product.TotalRatings, ratingAriaLabel, ratingCountAriaLabel)}\n {renderProductAvailability(inventoryLabel)}\n {quickViewButton && renderQuickView(quickViewButton, product.RecordId)}\n {productComparisonButton && renderProductComparisonButton(productComparisonButton, product, getCatalogId(context.request))}\n \n );\n};\n\nfunction renderLabel(\n name?: string,\n price?: string,\n rating?: number,\n ratingAriaLabelText?: string,\n reviewCount?: number,\n ratingCountAriaLabelText?: string\n): string {\n const reviewCountArialableText = getReviewAriaLabel(reviewCount, ratingCountAriaLabelText ?? '');\n return `${name ?? ''} ${price ?? ''} ${getRatingAriaLabel(rating, ratingAriaLabelText)}${\n reviewCountArialableText ? ` ${reviewCountArialableText}` : ''\n }`;\n}\n\nfunction renderDescription(description?: string): JSX.Element | null {\n return {description}
;\n}\n\nfunction getRatingAriaLabel(rating?: number, ratingAriaLabel?: string): string {\n if (rating && ratingAriaLabel) {\n const roundedRating = rating.toFixed(2);\n return format(ratingAriaLabel || '', roundedRating, '5');\n }\n return '';\n}\n\nfunction getReviewAriaLabel(reviewCount?: number, ratingCountAriaLabelText?: string): string {\n if (reviewCount && ratingCountAriaLabelText) {\n return format(ratingCountAriaLabelText || '', reviewCount);\n }\n return '';\n}\n\nfunction renderRating(\n coreContext: ICoreContext,\n moduleTypeName: string,\n moduleId: string,\n avgRating?: number,\n totalRatings?: number,\n ariaLabel?: string,\n ratingCountAriaLabel?: string\n): JSX.Element | null {\n if (!avgRating) {\n return null;\n }\n\n const numberRatings = totalRatings?.toString() || undefined;\n const ratingAriaLabelText = getRatingAriaLabel(avgRating, ariaLabel);\n const ratingCountAriaLabelText = getReviewAriaLabel(Number(numberRatings), ratingCountAriaLabel);\n\n return (\n >\n): JSX.Element | null {\n if (!imageUrl || !gridSettings || !imageSettings) {\n return null;\n }\n // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access, @typescript-eslint/no-unsafe-assignment -- Site level config can be of any type.\n const contextConfig = context?.app.config?.placeholderImageName;\n const emptyPlaceHolderImage = contextConfig as string;\n let fallbackImageSource = fallbackImageUrl;\n if (emptyPlaceHolderImage && fallbackImageUrl) {\n fallbackImageSource = `${fallbackImageUrl},${emptyPlaceHolderImage}`;\n }\n const img: IImageData = {\n src: imageUrl,\n altText: altText ? altText : '',\n fallBackSrc: fallbackImageSource\n };\n const imageProps = {\n gridSettings,\n imageSettings\n };\n imageProps.imageSettings.cropFocalRegion = true;\n return (\n = msdyn365Commerce.createComponentOverride<\n IProductComponent\n>('Product', { component: ProductCard, ...PriceComponentActions });\n\nexport default ProductComponent;\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport { IComponent, IComponentProps } from '@msdyn365-commerce/core';\nimport { ICartState } from '@msdyn365-commerce/global-state';\nimport { Coupon } from '@msdyn365-commerce/retail-proxy/dist/Entities/CommerceTypes.g';\nimport { ArrayExtensions } from '@msdyn365-commerce-modules/retail-actions';\nimport {\n Button,\n format,\n getPayloadObject,\n getTelemetryAttributes,\n IPayLoad,\n ITelemetryContent,\n TelemetryConstant\n} from '@msdyn365-commerce-modules/utilities';\nimport * as React from 'react';\n\n/**\n * IPromoCodeProps: Interface for promo code component.\n */\nexport interface IPromoCodeProps extends IComponentProps<{}> {\n cart: ICartState | undefined;\n promoCodeHeadingText: string;\n appliedPromoCodeHeadingText: string;\n removePromoAriaLabelFormat: string;\n promoPlaceholderText: string;\n promoCodeApplyButtonText: string;\n collapseTimeOut: number;\n removePromoText: string;\n invalidPromoCodeErrorText: string;\n failedToAddPromoCodeErrorText: string;\n duplicatePromoCodeErrorText: string;\n failedToRemovePromoCodeErrorText: string;\n\n /**\n * The telemetry content.\n */\n telemetryContent?: ITelemetryContent;\n promoCodeApplyCallback?(): void;\n}\n\n/**\n * IPromoCodeProps: Interface for promo code component.\n */\nexport interface IPromoCodeComponent extends IComponent {}\n\n/**\n * IPromoCodeProps: Interface for promo code state.\n */\ninterface IPromoCodeState {\n promoCodeInputValue: string;\n error: string;\n canApply: boolean;\n}\n\n/**\n *\n * The PromoCode component renders the promocode section.\n * @extends {React.PureComponent}\n */\nclass PromoCode extends React.PureComponent {\n private readonly payLoad: IPayLoad;\n\n public constructor(props: IPromoCodeProps) {\n super(props);\n this.payLoad = getPayloadObject('click', this.props.telemetryContent!, TelemetryConstant.ApplyPromoCode);\n this.state = {\n promoCodeInputValue: '',\n error: '',\n canApply: false\n };\n }\n\n public render(): JSX.Element {\n return (\n \n
{this.props.promoCodeHeadingText}
\n {this._renderForm(this.props.promoPlaceholderText, this.props.promoCodeApplyButtonText, this.props.cart)}\n
\n {this.state.error}\n
\n {this._renderAppliedPromoCode(this.props)}\n
) => {\n const error = event.target.value === '' ? '' : this.state.error;\n this.setState({\n promoCodeInputValue: event.target.value.trim(),\n error,\n canApply: !!event.target.value\n });\n };\n\n /**\n * Apply promo code method.\n * @param cartState - Cart state interface.\n */\n private readonly _applyPromotion = (cartState: ICartState | undefined) => {\n if (!cartState) {\n return;\n }\n const appliedPromo = this.state.promoCodeInputValue;\n\n cartState\n .addPromoCode({ promoCode: appliedPromo })\n .then(result => {\n if (result.status === 'SUCCESS') {\n // Show success text\n this.setState({ promoCodeInputValue: '', error: '', canApply: false });\n } else if (result.substatus === 'ALREADYADDED') {\n this.setState({ error: this.props.duplicatePromoCodeErrorText });\n } else {\n this.setState({ error: this.props.invalidPromoCodeErrorText });\n }\n })\n .catch(() => {\n this.setState({ error: this.props.failedToAddPromoCodeErrorText });\n });\n };\n\n /**\n * On submit action.\n * @param cartState - Cart state.\n * @returns Apply promotion.\n */\n private readonly _onSubmitHandler = (cartState: ICartState | undefined) => (event: React.FormEvent) => {\n event.preventDefault();\n this._applyPromotion(cartState);\n };\n\n /**\n * On apply promotion.\n * @param cartState - Cart state.\n * @returns Apply promotion.\n */\n private readonly applyPromotionHandler = (cartState: ICartState | undefined) => () => {\n this._applyPromotion(cartState);\n };\n\n /**\n * Renders promo code form.\n * @param promoPlaceholderText - Promo code input box placeholder string.\n * @param promoCodeApplyButtonText - Promo code button text string.\n * @param cartState - Cart state interface.\n * @returns Promo code form.\n */\n private readonly _renderForm = (promoPlaceholderText: string, promoCodeApplyButtonText: string, cartState: ICartState | undefined) => {\n const attributes = getTelemetryAttributes(this.props.telemetryContent!, this.payLoad);\n\n return (\n \n );\n };\n\n /**\n * Remove promo code method.\n * @param cartState - Cart state interface.\n * @param event - Mouse event.\n */\n private readonly _removePromotion = (cartState: ICartState | undefined, event: React.MouseEvent) => {\n if (!cartState) {\n return;\n }\n const code = event.currentTarget.getAttribute('data-value') ?? '';\n cartState\n .removePromoCodes({\n promoCodes: [code]\n })\n .then(result => {\n if (result.status === 'SUCCESS') {\n this.setState({ error: '' });\n }\n })\n .catch(() => {\n this.setState({ error: this.props.failedToRemovePromoCodeErrorText });\n });\n };\n\n /**\n * Renders applied promo code form.\n * @param props - Promo code component props.\n * @returns Applied promo code.\n */\n private readonly _renderAppliedPromoCode = (props: IPromoCodeProps) => {\n if (!props.cart || !props.cart.cart.Coupons || !ArrayExtensions.hasElements(props.cart.cart.Coupons)) {\n return;\n }\n\n /**\n * On remove promotion action.\n * @param event - Mouse event.\n */\n const removePromotionHandler = (event: React.MouseEvent) => {\n this._removePromotion(props.cart, event);\n };\n\n return (\n <>\n {props.cart.cart.Coupons.map((coupon: Coupon) => {\n const ariaLabel = props.removePromoAriaLabelFormat\n ? format(props.removePromoAriaLabelFormat, props.removePromoText, coupon.Code)\n : '';\n\n return (\n \n
\n {'Code '}\n {coupon.Code} \n {'Applied '}\n
\n
\n
{\n // threshold for removal, 5mins\n public readonly removalThresholdInMs: number;\n\n // frequency of cleaning, 2mins -- this is the period it'll look for keys older than removalThresholdInMs\n public readonly intervalForRemovalInMs: number;\n\n // internal cache\n private _cache: Map;\n\n constructor(options?: ITTLCacheOptions) {\n this.removalThresholdInMs = (options && options.removalThresholdInMs) || 300000;\n this.intervalForRemovalInMs = (options && options.intervalForRemovalInMs) || 120000;\n this._cache = new Map();\n\n if (process.env.CURRENT_ENVIRONMENT === 'node') {\n // interval trigger to clear the map -- only on server\n setInterval(() => this._cleanCache(), this.intervalForRemovalInMs);\n }\n }\n\n /**\n * Gets a value from cache\n *\n * @param {string} key the key\n * @returns {(TValue | undefined)} the value, if it exists\n */\n public get(key: string): TValue | undefined {\n const value = this._cache.get(key);\n if (value) {\n return value[0];\n }\n }\n\n /**\n * Set a value\n *\n * @param {string} key the key\n * @param {TValue} value the value\n */\n public set(key: string, value: TValue, onRemoveCallback?: TOnRemoveCallback): void {\n const now = Date.now();\n this._cache.set(key, [value, now, onRemoveCallback]);\n }\n\n public clear(): void {\n this._cache.clear();\n }\n\n // cleans up the map implementation\n private _cleanCache(): void {\n const now = Date.now();\n const keys = this._cache.keys();\n for (const key of keys) {\n const value = this._cache.get(key);\n if (value && value.length > 1 && now - value[1] > this.removalThresholdInMs) {\n this._cache.delete(key);\n if (typeof value[2] === 'function') {\n value[2](key);\n }\n }\n }\n }\n}\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport { TTLCache } from './ttl-cache';\n\nexport interface IRequestVectorizerOptions {\n removalThresholdInMs?: number;\n intervalForRemovalInMs?: number;\n}\n\n/**\n * Class which handles vectorizing requests\n */\nclass RequestVectorizer {\n // differentiate vectors generated client/server side\n public static SEP: string = process.env.CURRENT_ENVIRONMENT === 'node' ? '.' : '/';\n private _cache: TTLCache;\n\n constructor(options?: IRequestVectorizerOptions) {\n this._cache = new TTLCache(options);\n // binds\n this.next = this.next.bind(this);\n }\n\n /**\n * The next request in the sequence\n *\n * @param {string} requestId\n * @returns {string} the next vectorized request\n */\n public next(requestId: string): string {\n const value = this._cache.get(requestId);\n const nextValue = value === undefined ? 0 : value + 1;\n this._cache.set(requestId, nextValue);\n return `${requestId}${RequestVectorizer.SEP}${nextValue}`;\n }\n}\nconst RequestVectorizerInstance = new RequestVectorizer();\nexport { RequestVectorizerInstance, RequestVectorizer };\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport { IEventRetailServerRequestProperties, StaticTelemetry } from '@msdyn365-commerce/telemetry-internal';\nimport { AxiosError, AxiosRequestConfig, AxiosResponse } from 'axios';\nimport { isEmpty as _isEmpty } from 'lodash';\nimport url from 'url';\nimport { TelemetryClient } from 'applicationinsights';\nimport { RequestVectorizerInstance } from './request-vectorizer';\nimport { TTLCache } from './ttl-cache';\n\n/**\n * Regular expression to match content inside round braces\n */\nconst regexGetRoundBraces = /\\(.+?\\)/gm;\n\n/**\n * Default client error\n */\nconst DEFAULT_ERROR_STATUS_CODE = 418;\n\n/**\n * Formats commerce URL parts used in retail server calls with odata formatting\n *\n * @param inputString The input string to replace\n * @param replaceString The replacement value, default of `(~)`.\n */\nexport const replaceIdentifiers = (inputString: string | undefined, replaceString?: string) => {\n return (inputString || '').replace(regexGetRoundBraces, replaceString || `(~)`);\n};\n\n/**\n * Helper mapping lowercase keys to real keys in an object. Note this returns the keys only, mapping\n * lower case key to the actual cased key name in the dictionary\n *\n * e.g.\n *\n * HelloWorld will be returned as 'helloworld' allowing you to look up 'helloworld' to get HelloWorld to index into the real dictionary\n * @param objectDictionary the object dictionary\n */\nexport const toLowerCaseDict = (objectDictionary): { [lowerCaseKeyName: string]: string } => {\n return Object.keys(objectDictionary || {}).reduce(\n (prevValue, current) => ({ ...prevValue, [current.toLocaleLowerCase()]: current }),\n {}\n );\n};\n\nconst ttlRequestCache = new TTLCache();\n\n/**\n * Error retail se interceptor for axios\n *\n * @param config The request cofiguration\n * @param status The response status code\n * @param requestCache The optional request cache to use (mostly for testing)\n */\n\nexport const RSErrorResponseHandler = (\n config: AxiosRequestConfig,\n status: number,\n requestCache?: TTLCache\n) => {\n if (!requestCache) {\n requestCache = ttlRequestCache;\n }\n const headers = config && config.headers;\n let requestId;\n let activityId;\n if (headers) {\n const lowercaseHeaders = toLowerCaseDict(headers);\n requestId = lowercaseHeaders.requestid && headers[lowercaseHeaders.requestid];\n activityId = lowercaseHeaders.activityid && headers[lowercaseHeaders.activityid];\n }\n const statusCode = status ? status : DEFAULT_ERROR_STATUS_CODE;\n const properties = requestCache.get(requestId);\n if (properties) {\n const elapsedTime = StaticTelemetry.stopTimer(requestId);\n const parsedUrl = url.parse((config && (config.url || config.baseURL)) || '');\n StaticTelemetry.trackDependency({\n duration: elapsedTime,\n method: (properties.m || 'unknown').toUpperCase(),\n name: properties.e,\n resultCode: statusCode,\n success: status < 400,\n url: parsedUrl,\n target: parsedUrl.hostname,\n properties: {\n requestId,\n activityId,\n empty: false\n },\n dependencyName: 'RetailServer'\n });\n }\n};\n\n/**\n * Response interceptor for axios\n *\n * @param response The resposne\n * @param requestCache The optional request cache to use (mostly for testing)\n */\nexport const RSResponseInterceptor = (response: AxiosResponse, requestCache?: TTLCache) => {\n if (!requestCache) {\n requestCache = ttlRequestCache;\n }\n // try get properties from request based on requestid header\n let requestId;\n let activityId;\n if (process.env.CURRENT_ENVIRONMENT !== 'node') {\n // on web we need to check config\n const headers = response && response.config && response.config.headers;\n if (headers) {\n const lowercaseHeaders = toLowerCaseDict(headers);\n requestId = lowercaseHeaders.requestid && headers[lowercaseHeaders.requestid];\n activityId = lowercaseHeaders.activityid && headers[lowercaseHeaders.activityid];\n }\n } else {\n requestId = response && response.headers && response.headers.requestid;\n activityId = response && response.headers && response.headers.activityid;\n }\n const properties = requestCache.get(requestId);\n if (properties) {\n const elapsedTime = StaticTelemetry.stopTimer(requestId);\n const { config, status, request } = response;\n const parsedUrl = url.parse((config && (config.url || config.baseURL)) || '');\n StaticTelemetry.trackDependency({\n duration: elapsedTime,\n method: (properties.m || (request && request.method) || 'unknown').toUpperCase(),\n name: properties.e,\n resultCode: status,\n success: status < 400,\n url: parsedUrl,\n target: parsedUrl.hostname,\n properties: {\n requestId,\n activityId,\n empty: _isEmpty(response.data),\n ...(properties.ahs && { authTokenSize: properties.ahs })\n },\n dependencyName: 'RetailServer'\n });\n }\n\n return response;\n};\n\n/**\n * Captures outgoing calls to retail server\n */\nexport const RSRequestInterceptor = (request: AxiosRequestConfig) => {\n if (!request || !request.headers) {\n return request;\n }\n const requestHeaders = request.headers;\n const caseInsensitiveHeaderMap = toLowerCaseDict(requestHeaders);\n\n // check if it's an outgoing request to retail server\n\n if (caseInsensitiveHeaderMap.oun && request.url) {\n // get the API endpoint\n const parsedUrl = url.parse(request.url, false);\n const apiEndPoint = replaceIdentifiers(parsedUrl.pathname);\n\n // associate with the request-id vector\n const requestIdVector = requestHeaders[caseInsensitiveHeaderMap['request-id']] || '';\n\n const authorizationHeader: string = (requestHeaders[caseInsensitiveHeaderMap['authorization']] || '').toString();\n let authorizationHeaderLength = 0;\n\n if (authorizationHeader && authorizationHeader.toLowerCase().indexOf('bearer') > -1) {\n const authArray = authorizationHeader.split(' ');\n if (authArray.length > 1) {\n authorizationHeaderLength = authArray[1].length;\n }\n }\n\n // associate with the requestid (non-vectored)\n const caseInsensitiveRequestIdHeaderName = caseInsensitiveHeaderMap.requestid || 'requestid';\n const currentRequestId = requestHeaders[caseInsensitiveRequestIdHeaderName] || 'undefined';\n const requestId = RequestVectorizerInstance.next(currentRequestId.toString());\n\n StaticTelemetry.startTimer(requestId);\n\n const properties: IEventRetailServerRequestProperties = {\n // method\n m: request.method!,\n // endpoint\n e: apiEndPoint,\n // request vector\n rv: requestIdVector.toString(),\n // request id\n r: requestId\n };\n\n if (authorizationHeader) {\n // Authorization header size\n properties.ahs = authorizationHeaderLength.toString();\n }\n\n // add to cache\n ttlRequestCache.set(requestId, properties, () => {\n StaticTelemetry.stopTimer(requestId);\n });\n\n request.headers[caseInsensitiveRequestIdHeaderName] = requestId;\n }\n\n return request;\n};\n\nexport const RSRequestInterceptorErrorHandler = (error: AxiosError) => {\n if (error.request) {\n RSRequestInterceptor(error.request);\n }\n\n throw error;\n};\n\nexport const RSResponseInterceptorErrorHandler = (error: AxiosError) => {\n if (error.response) {\n RSResponseInterceptor(error.response);\n } else if (error.config) {\n RSErrorResponseHandler(error.config, DEFAULT_ERROR_STATUS_CODE);\n }\n\n throw error;\n};\nexport const DataBaseType = {\n RequestData: 'RequestData',\n RemoteDependencyData: 'RemoteDependencyData',\n ExceptionData: 'ExceptionData'\n};\n\nexport const copyEventsToSecondaryInstance = (secondaryTelemetryInstance: TelemetryClient) => (envelope, context) => {\n const { data } = envelope;\n if (data.baseType === DataBaseType.RequestData) {\n secondaryTelemetryInstance.trackRequest({\n name: data.baseData.name,\n url: data.baseData.url,\n source: data.baseData.source,\n duration: data.baseData.duration,\n resultCode: data.baseData.duration,\n success: data.baseData.success\n });\n }\n if (data.baseType === DataBaseType.RemoteDependencyData) {\n secondaryTelemetryInstance.trackDependency({\n dependencyTypeName: data.baseData.dependencyTypeName,\n target: data.baseData.target,\n name: data.baseData.name,\n data: data.baseData.data,\n duration: data.baseData.duration,\n resultCode: data.baseData.resultCode,\n success: data.baseData.success\n });\n }\n if (data.baseType === DataBaseType.ExceptionData) {\n secondaryTelemetryInstance.trackException({\n exception: JSON.parse(JSON.stringify(data.baseData)).exceptions[0]\n });\n }\n return true;\n};\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport { createObservableDataAction } from '@msdyn365-commerce/action-internal';\nimport msdyn365Commerce, {\n getFriendlyName,\n getParameterizeFeatureFlagsWithRequestContext,\n IAction,\n IActionContext,\n IParameterizeFeatureFlags,\n parameterize,\n checkVersionForFeature,\n getCatalogIdForSdk\n} from '@msdyn365-commerce/core-internal';\nimport { getCategoriesAsync } from '@msdyn365-commerce/retail-proxy/dist/DataActions/CategoriesDataActions.g';\nimport { getByIdAsync } from '@msdyn365-commerce/retail-proxy/dist/DataActions/ProductsDataActions.g';\nimport { Category, SimpleProduct } from '@msdyn365-commerce/retail-proxy/dist/Entities/CommerceTypes.g';\nimport { CategoryLinkInput, IPageTypeContext, ProductLinkInput } from '../hydrator-action-inputs';\n\ntype CategoryWithNeutralizedName = Category & { NeutralizedName?: string };\n/**\n * Computes a root category's SLUG\n *\n * @param rootCategory The category for which you want to determine the slug\n * @param ctx Action context\n */\nexport const getCategorySlug = (\n rootCategory: CategoryWithNeutralizedName,\n categories: CategoryWithNeutralizedName[],\n parameterizeFeatureFlags?: IParameterizeFeatureFlags,\n context?: IActionContext\n): string => {\n let slug: string = parameterize(rootCategory.Name, undefined, parameterizeFeatureFlags, rootCategory.NeutralizedName);\n let currentCategory: Category = rootCategory;\n while (currentCategory.ParentCategory) {\n const parentId = currentCategory.ParentCategory;\n const parentCategory: CategoryWithNeutralizedName | undefined = categories.find((category: Category) => {\n if (category.RecordId) {\n return category.RecordId === parentId;\n }\n return false;\n });\n if (!parentCategory) {\n break;\n }\n\n let parentCategoryWithLocalizedName = parentCategory;\n if (context && isUrlLocalizationEnabled(parameterizeFeatureFlags)) {\n const localName = getFriendlyName(context.requestContext.locale, parentCategory.NameTranslations);\n parentCategoryWithLocalizedName = { ...parentCategory };\n parentCategoryWithLocalizedName.NeutralizedName = parentCategory.Name;\n parentCategoryWithLocalizedName.Name = localName || parentCategoryWithLocalizedName.NeutralizedName;\n }\n\n slug = `${parameterize(\n parentCategoryWithLocalizedName.Name,\n undefined,\n parameterizeFeatureFlags,\n parentCategoryWithLocalizedName.NeutralizedName\n )}/${slug}`;\n currentCategory = parentCategoryWithLocalizedName;\n }\n return slug.length > 0 ? `/${slug}` : '';\n};\n\nconst isUrlLocalizationEnabled = (parameterizeFeatureFlags?: IParameterizeFeatureFlags) => {\n return (\n (msdyn365Commerce.platformSettings && msdyn365Commerce.platformSettings.enableUrlLocalization) ||\n (parameterizeFeatureFlags && parameterizeFeatureFlags.enableUrlLocalization)\n );\n};\n\n/**\n * Returns an object containing information used to by the URL builder to build\n * the formatted product or category URL\n * =\n * @param input Action input\n * @param context Action context\n */\nconst getPageTypeContextById = async (input: ProductLinkInput | CategoryLinkInput, context: IActionContext): Promise => {\n // If product ID exits get the product details for that product\n const pageTypeContext: IPageTypeContext = {};\n if (input instanceof ProductLinkInput && input.productId) {\n try {\n const product: SimpleProduct = await getByIdAsync({ callerContext: context }, input.productId, input.channelId);\n if (!(product && product.Name)) {\n throw new Error(`Unable to retrieve product details for product id: ${input.productId}`);\n }\n pageTypeContext.product = { Name: product.Name || '', RecordId: product.RecordId };\n } catch (err) {\n context.telemetry.error(err);\n throw new Error(`Unable run getById action. Error: ${err}`);\n }\n }\n const catalogFeature = checkVersionForFeature('catalogFeature');\n const catalogid = (catalogFeature && getCatalogIdForSdk(context.requestContext, 0)) || undefined;\n\n // Get the category details for the passed category id\n // @ts-ignore old retail proxy contract does not have catalogid.\n return getCategoriesAsync({ callerContext: context }, input.channelId, catalogid)\n .then((categories: Category[]) => {\n // Find the category by id from the list of returned categories\n const rootCategory: Category | undefined = categories.find((category: Category) => {\n if (category.RecordId) {\n return category.RecordId === input.categoryId;\n }\n return false;\n });\n if (!rootCategory) {\n throw new Error(`Unable to retrieve category details for category id: ${input.categoryId}`);\n }\n const localName = getFriendlyName(context.requestContext.locale, rootCategory.NameTranslations);\n const rootCategoryWithNeutralizedName = { ...rootCategory };\n rootCategoryWithNeutralizedName.NeutralizedName = rootCategory.Name;\n rootCategoryWithNeutralizedName.Name = localName || rootCategoryWithNeutralizedName.NeutralizedName;\n // Compute the found category's slug\n const parameterizeFeatureFlags: IParameterizeFeatureFlags = getParameterizeFeatureFlagsWithRequestContext(\n context.requestContext\n );\n const slug = getCategorySlug(rootCategoryWithNeutralizedName, categories, parameterizeFeatureFlags, context);\n pageTypeContext.category = { Slug: slug, RecordId: rootCategoryWithNeutralizedName.RecordId };\n return Promise.resolve(pageTypeContext);\n })\n .catch(err => {\n // In the event of an error return just the category id\n context.telemetry.error(err);\n throw new Error(`Unable to run getCategories action. Error: ${err}`);\n });\n};\n\nexport const getPageTypeContextByIdAction = createObservableDataAction({\n action: >getPageTypeContextById\n});\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport { IActionContext, IModuleContract } from '@msdyn365-commerce/core-internal';\nimport { PROCESS_TYPE } from '../consts';\nimport { IProductListMetaData, IServerLink } from './hydrator-action-inputs';\nimport { hydrateLink } from './link-hydrator';\nimport { hydrateProductList } from './product-list-hydrator';\n\nconst TYPE_KEY = 'type';\nconst LIST_TYPE_KEY = 'listType';\n\n/**\n * Recusrively traverses a module's config properties to find link/list types to transform\n *\n * @param obj The current object\n * @param context The current action context\n */\nconst searchForComplexType = (\n obj: unknown,\n context: IActionContext,\n moduleId?: string,\n propertyToMapInConfig?: string\n): Promise[] => {\n const promisesArray: Promise[] = [];\n if (!obj) {\n return promisesArray;\n }\n if (Array.isArray(obj)) {\n for (let i = 0; i < obj.length; i++) {\n promisesArray.push(...searchForComplexType(obj[i], context, moduleId, propertyToMapInConfig));\n }\n } else if (typeof obj === 'object' && obj) {\n const children = Object.keys(obj);\n\n // Link scenario ('type' is defined)\n if (obj[TYPE_KEY]) {\n promisesArray.push(hydrateLink(obj, context));\n // ProductList scenario ('list_type') is defined\n } else if (obj[LIST_TYPE_KEY]) {\n promisesArray.push(hydrateProductList(obj, context, moduleId, propertyToMapInConfig));\n } else if (children.length > 0) {\n for (let i = 0; i < children.length; i++) {\n promisesArray.push(...searchForComplexType(obj[children[i]], context, moduleId, children[i]));\n }\n }\n }\n\n return promisesArray;\n};\n\n/**\n * Entry point, processes a page response and looks for link and list types\n * to transform\n *\n * @param pageResponse The inital page response\n * @param context The current action context\n */\nexport const processComplexDataTypes = async (\n lazyloadAllDataActions: boolean,\n processType: string,\n pageSlots: IModuleContract[],\n context: IActionContext\n) => {\n const promisesArray = processComplexDataTypesAsync(lazyloadAllDataActions, processType, pageSlots, context);\n if (promisesArray) {\n await Promise.all(promisesArray);\n }\n};\n\nexport const processComplexDataTypesAsync = (\n lazyLoadAllDataActions: boolean,\n processType: string,\n pageSlots: IModuleContract[],\n context: IActionContext\n) => {\n if (pageSlots && pageSlots.length) {\n const promisesArray: Promise[] = [];\n let lazyLoadAllModuleQueryString; // Query string switch to lazyLoad all modules\n const requestContext = context.requestContext;\n const requestContextFeatures = requestContext.features;\n const clientRenderModules = 'clientRender_modules';\n const clientRenderAllModuleQueryString = 'client_render_all_modules';\n\n // Feature switch for lazyLoading render and data action currenlty for product collection module\n let lazyLoadModuleFeature = requestContextFeatures[clientRenderModules];\n\n // Query param to lazyLoad all modules\n if (requestContext.query && requestContext.query.clientRenderAllModuleQueryString) {\n lazyLoadAllModuleQueryString = requestContext.query[clientRenderAllModuleQueryString];\n }\n\n // If request is coming from the editor then, turn off all lazyloading feature\n if (requestContext.params && requestContext.params.isEditor && requestContext.params.isEditor === true) {\n lazyLoadModuleFeature = false;\n lazyLoadAllModuleQueryString = 'false';\n lazyLoadAllDataActions = false;\n }\n\n for (let i = 0; i < pageSlots.length; i++) {\n const currModule = pageSlots[i];\n const currModuleConfig = currModule.config;\n let clientRenderConfigSwitch; // Module config switch for lazyLoading render and data action for product collection module\n\n if (typeof currModuleConfig === 'object' && currModuleConfig) {\n lazyLoadAllModuleQueryString === 'true' ? (currModuleConfig[`clientRender`] = true) : clientRenderConfigSwitch;\n if (currModuleConfig.hasOwnProperty('clientRender')) {\n // When the lazyLoading feature switch is false, turn the lazyloading config switch to false\n if (lazyLoadModuleFeature === false) {\n currModuleConfig[`clientRender`] = false;\n }\n clientRenderConfigSwitch = currModuleConfig[`clientRender`];\n }\n }\n\n if ((lazyLoadAllDataActions || clientRenderConfigSwitch) && processType === PROCESS_TYPE.client) {\n // When lazyLoad_all feature switch is true or lazyload Module config switch is true and processComplexDataType call is from client, do hydration\n promisesArray.push(...searchForComplexType(currModuleConfig, context, currModule.id));\n } else if (!lazyLoadAllDataActions && !clientRenderConfigSwitch && processType === PROCESS_TYPE.server) {\n // When lazyLoad_all feature switch is OFF, lazyload Module config switch is OFF and processComplexDataType call is from server, do hydration\n promisesArray.push(...searchForComplexType(currModuleConfig, context, currModule.id));\n }\n }\n // eslint-disable-next-line @typescript-eslint/no-floating-promises\n context.runAllActionsInQueue();\n return promisesArray;\n }\n};\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport { appendQueryParams, getCatalogIdForSdk, getUrlSync, IActionContext } from '@msdyn365-commerce/core-internal';\nimport { EXCEPTION_LINK_ACTION } from '@msdyn365-commerce/telemetry-internal';\nimport { CategoryLinkInput, IPageTypeContext, IServerLink, ProductLinkInput } from './hydrator-action-inputs';\nimport { getPageTypeContextByIdAction } from './link-actions/page-type-context-by-id';\n\n/**\n * Takes a Link object from the Page Response and uses URL Builder to construct a destination url and transform the\n * existing link structure to expose two porperties type and destinationUrl\n *\n * @param linkObject The current link object being modified\n * @param context The current action context\n */\nexport const hydrateLink = async (linkObject: IServerLink, context: IActionContext) => {\n let destinationUrl: string | undefined;\n let hostname: string | undefined = context?.requestContext?.url?.requestUrl?.hostname;\n const locale = !context.requestContext.features.disable_hydrator_link_locale ? context.requestContext.locale : '';\n // In each switch case if the required information is not present to construct the URL\n // The object will be return unmodified\n switch (linkObject.type) {\n // In the case of internal and external links, no transform is needed\n // If destination url is present set the destination url and break\n case 'internalLink':\n case 'externalLink':\n if (linkObject.destinationUrl) {\n // Append the pass through query parameters\n const queryParams = (context.requestContext && context.requestContext.query) || {};\n const featureContext = context?.requestContext?.features;\n // If add_external_link_domain switch is set to true, we pass hostname as empty string which will add domain qsp to all external and internal link\n hostname = featureContext?.add_external_link_domain ? '' : hostname;\n if (featureContext?.skip_external_link_catalogid) {\n destinationUrl = appendQueryParams(linkObject.destinationUrl, queryParams, hostname, true);\n } else {\n destinationUrl = appendQueryParams(linkObject.destinationUrl, queryParams, hostname);\n }\n\n break;\n }\n return;\n case 'productLink':\n // To build the url for a productLink we need the product and category ids\n if (linkObject.productId && linkObject.categoryId) {\n // Grab the route context using the action\n let routeContext: IPageTypeContext;\n try {\n const catalogId = getCatalogIdForSdk(context.requestContext, 0);\n routeContext = await getPageTypeContextByIdAction(\n new ProductLinkInput(\n context.requestContext.apiSettings,\n linkObject.categoryId,\n linkObject.productId,\n catalogId,\n locale\n ),\n context\n );\n // Create the URL and break\n destinationUrl = getUrlSync('product', context, routeContext);\n } catch (err) {\n context.telemetry.error(EXCEPTION_LINK_ACTION);\n context.telemetry.exception(err);\n linkObject.destinationUrl = '';\n linkObject.error = EXCEPTION_LINK_ACTION;\n return;\n }\n break;\n }\n return;\n case 'categoryLink':\n // To build the url for the categoryLink we need the category id\n if (linkObject.categoryId) {\n // Grab the route context using the action\n let routeContext: IPageTypeContext;\n try {\n routeContext = await getPageTypeContextByIdAction(\n new CategoryLinkInput(context.requestContext.apiSettings, linkObject.categoryId, null, locale),\n context\n );\n // Create the URL and break\n destinationUrl = getUrlSync('category', context, routeContext);\n } catch (err) {\n context.telemetry.error(EXCEPTION_LINK_ACTION);\n context.telemetry.exception(err);\n linkObject.destinationUrl = '';\n linkObject.error = EXCEPTION_LINK_ACTION;\n return;\n }\n break;\n }\n return;\n default:\n // If it is not one of these types or does not contain the information required for the link\n // building do not modify the data\n return;\n }\n\n // Set the computed destinationUrl and delete the other properties\n linkObject.destinationUrl = destinationUrl;\n delete linkObject.categoryId;\n delete linkObject.productId;\n};\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport { ICache } from '@msdyn365-commerce/cache-internal';\nimport msdyn365Commerce, {\n IDictionary,\n IFeatureVersions,\n IModule,\n IModuleContract,\n IPageResponse,\n IPlatformSettings,\n IRequestContext,\n IResourceManager,\n isAuthoringEditEnabled,\n isEmptyOrNullObject\n} from '@msdyn365-commerce/core-internal';\nimport { AsyncResult, isAsyncResult } from '@msdyn365-commerce/retail-proxy';\nimport { EXCEPTION_BADPAGECONTEXT, EXCEPTION_INITIALDATAFAIL, ITelemetry } from '@msdyn365-commerce/telemetry-internal';\nimport { isObservableArray, toJS, transaction } from 'mobx';\nimport { IModuleBinder } from '../app-initialization/models';\nimport {\n CACHE_SETTING,\n MODULE_ACTION_KEY,\n MODULE_CACHE_KEY,\n MODULE_CONFIG_ERRORS_KEY,\n MODULE_CONFIG_KEY,\n MODULE_DATA_KEY,\n MODULE_DEFERRED_KEY,\n MODULE_RESOURCES_KEY,\n MSDYN365_WYSIWYG_CANADDMODULE,\n MSDYN365_WYSIWYG_DISABLED_PROPS\n} from '../consts';\nimport { getParentModuleName, isModuleEntryPointsEnabled } from '../utils/helpers';\nimport { getWrappedProxyObject } from './authoring-edit-helper';\n\n/**\n * Interface containing module metadata that pageContext holds\n *\n * Any change to this interface should result an accompanying change to the moduleList\n * Fast JSON stringify constructor in base-page-utils.ts\n */\ninterface IModuleMetaData {\n id: string;\n typeName: string;\n dataActions: unknown;\n}\n\ninterface IActionMetaData {\n name: string;\n entity: string;\n inputs: string[];\n}\n\n/**\n * Class to hold the page view model, areas and regions\n */\nexport class PageContext {\n public requestContext: IRequestContext;\n public pageRoot: IModuleContract & { theme: string };\n public requestCache: ICache;\n private _moduleList: IModuleMetaData[] = [];\n private _themeModulesList: string[] = [];\n private _clientPlatformSetting: IPlatformSettings = {};\n private _environmentVariable: IDictionary = {};\n private _versionDependentFeatureInfo: IFeatureVersions = {};\n\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n constructor(pageData: IPageResponse | any, requestContext: IRequestContext, requestCache: ICache, resourceManager?: IResourceManager) {\n if (isEmptyOrNullObject(pageData)) {\n throw new Error(EXCEPTION_BADPAGECONTEXT);\n }\n this.requestContext = requestContext;\n // set c1AccessToken to null so that its not sent down to client\n this.requestContext.user.c1AccessToken = undefined;\n this.requestCache = requestCache;\n this.pageRoot = pageData.pageRoot;\n this._versionDependentFeatureInfo = msdyn365Commerce.getVersionDependentFeatureInfo;\n\n if (typeof window === 'undefined') {\n this._putRequestedModulesInCacheOnServer(pageData, resourceManager);\n }\n\n this._initThemeModulesList();\n this.setEnvironmentVariableForCLient();\n }\n\n public moduleList(): IModule[][] {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const result = this._moduleList.reduce((resultArray: any[], item, index) => {\n const chunkIndex = Math.floor(index / Number(5));\n if (!resultArray[chunkIndex]) {\n resultArray[chunkIndex] = []; // start a new chunk\n }\n resultArray[chunkIndex].push(item);\n\n return resultArray;\n }, []);\n return result;\n }\n\n /**\n * Returns callback function that returns module rendering metadata for a given module asynchronously\n */\n get modules(): (name: string) => IModule {\n return (name: string) => {\n return this._constructModuleMetaData(name);\n };\n }\n\n /**\n * Get all the modules listed in the PageContext from the cache\n */\n\n public async allModules(requestContext: IRequestContext, moduleList: IModule[]): Promise {\n if (requestContext?.features?.loadData_optimization) {\n return moduleList.map(moduleMetaData => {\n return this.modules(moduleMetaData.id);\n });\n } else {\n return this._moduleList.map(moduleMetaData => {\n return this.modules(moduleMetaData.id);\n });\n }\n }\n\n public setAppCacheEntries(appCacheEntries: string[]): void {\n this.requestCache.put({ typeName: CACHE_SETTING, key: 'APP_CACHE_ENTRIES' }, { item: appCacheEntries });\n }\n\n public setPlatformSettingsForClient(platformSettings: IPlatformSettings): void {\n this._clientPlatformSetting.clientSideDataActionTimeoutInMs = platformSettings?.clientSideDataActionTimeoutInMs || undefined;\n this._clientPlatformSetting.shouldUseInstanceCache = !!platformSettings?.clientSideDataActionTimeoutInMs;\n this._clientPlatformSetting.disableActionRegOptimization = true;\n this._clientPlatformSetting.imageFallbackOptimize = platformSettings?.imageFallbackOptimize || false;\n this._clientPlatformSetting.enableModuleEntryPoints = isModuleEntryPointsEnabled(platformSettings);\n this._clientPlatformSetting.enableImageOptimizeEvents = !!platformSettings?.enableImageOptimizeEvents;\n this._clientPlatformSetting.enableModuleCssOptimization = platformSettings?.enableModuleCssOptimization || false;\n this._clientPlatformSetting.clientTimeoutMapInMs = platformSettings?.clientTimeoutMapInMs || {};\n this._clientPlatformSetting.secondaryInstrumentationKey = platformSettings?.secondaryInstrumentationKey;\n /* if (platformSettings?.disableActionRegOptimization === true) {\n this._clientPlatformSetting.disableActionRegOptimization = true;\n }*/\n }\n\n public setEnvironmentVariableForCLient = () => {\n const environment = msdyn365Commerce.getAllEnvironmentVariable();\n this._environmentVariable = environment;\n };\n\n public getPlatformSettingsForClient(): IPlatformSettings {\n return this._clientPlatformSetting;\n }\n\n public getVersionDependentFeatureInfo(): IFeatureVersions {\n return this._versionDependentFeatureInfo;\n }\n\n /**\n * Checkis if the given module is deferred module\n * @param name name of the module\n */\n public deferred(name: string): Boolean {\n return !!this.requestCache.getValue({ typeName: MODULE_DEFERRED_KEY, key: name });\n }\n\n public getResourceTextForPlaceholderPreview(): string {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const resourceItem = this.requestCache.get({ typeName: MODULE_RESOURCES_KEY, key: 'PLACE-HOLDER-FOR-CONTAINER-PREVIEW' });\n if (resourceItem && resourceItem.item && resourceItem.item.clickToConfigure) {\n return resourceItem.item.clickToConfigure;\n } else {\n return 'Click here to configure';\n }\n }\n\n /**\n * Marks module as deferred\n * @param name name of the module\n */\n public markModuleAsDeferred(name: string): void {\n this.requestCache.put(\n { typeName: MODULE_DEFERRED_KEY, key: name },\n {\n item: true\n }\n );\n }\n\n /**\n * Inserts requested modules into cache on client side\n * @param pageData page data object\n * @param telemetry telemetry object\n */\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n public async putRequestedModulesInCacheOnClient(pageData: any, telemetry: ITelemetry): Promise {\n if (isEmptyOrNullObject(pageData.requestCache) || isEmptyOrNullObject(pageData.requestCache.internalCache)) {\n throw new Error(EXCEPTION_INITIALDATAFAIL);\n }\n\n for (const cacheType of Object.keys(pageData.requestCache.internalCache)) {\n const cacheBasedOnType = pageData.requestCache.internalCache[cacheType];\n if (!isEmptyOrNullObject(cacheBasedOnType)) {\n for (const cachekey of Object.keys(cacheBasedOnType)) {\n const cacheItem = cacheBasedOnType[cachekey];\n\n if (pageData?.requestContext?.features?.loadData_optimization) {\n setTimeout(() => {\n this._rehydrateAsyncResults(cacheItem, cacheType, cachekey);\n }, 0);\n } else {\n this._rehydrateAsyncResults(cacheItem, cacheType, cachekey);\n }\n\n // Awaiting a rejected promise will throw, so we need to catch those errors.\n try {\n await cacheItem.item;\n } catch (e) {\n telemetry.debug(`Error while hyrdating cache item, Type: ${cacheBasedOnType}, Key: ${cachekey}`);\n }\n\n if (cacheType === MODULE_CACHE_KEY) {\n const moduleItem = cacheItem.item;\n this._moduleList.push({\n id: moduleItem.id,\n typeName: moduleItem.typeName,\n dataActions: moduleItem.dataActions || []\n });\n }\n }\n }\n }\n }\n\n /**\n * Populates data actions results from cache\n * @param cacheObjectType entity type\n * @param cacheKey cache key\n */\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n private _populateDataActionResultFromCache(cacheObjectType: string, cacheKey: string): any {\n const cachedValueBasedOnInput = this.requestCache.getValue({ typeName: cacheObjectType, key: cacheKey });\n if (!cachedValueBasedOnInput) {\n return;\n }\n\n // Ref resolution for promises needs to be delayed until the value is available\n if (isAsyncResult(cachedValueBasedOnInput)) {\n return transaction(() => {\n // eslint-disable-next-line @typescript-eslint/no-floating-promises\n cachedValueBasedOnInput.then(promiseResult => {\n // Directly set the result because we want a synchronous change\n cachedValueBasedOnInput.result = this._resolveCacheRef(cacheObjectType, promiseResult);\n });\n return cachedValueBasedOnInput;\n });\n }\n\n return this._resolveCacheRef(cacheObjectType, cachedValueBasedOnInput);\n }\n\n /**\n * Resolves cache reference for the given entity type\n * @param cacheObjectType entity type that is cached\n * @param cacheRefInfo cache ref key\n */\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n private _resolveCacheRef(cacheObjectType: string, cacheRefInfo: object): any {\n if (typeof cacheRefInfo !== 'object' || cacheRefInfo['$ref'] !== true) {\n return cacheRefInfo;\n }\n const result = cacheRefInfo['key']\n .map(key => {\n const value = this.requestCache.getValue({ typeName: cacheObjectType, key });\n if (value) {\n return value;\n }\n })\n .filter(Boolean);\n return result && result.length > 0 ? (cacheRefInfo['isCollection'] ? result : result[0]) : null;\n }\n\n /**\n * Inserts requested modules in cache to prepare the initialData that will be sent to client\n * @param pageData pageData object with list of modules\n * @param resourceManager resourceManager that contains the localized strings\n */\n private _putRequestedModulesInCacheOnServer(pageData: IPageResponse, resourceManager?: IResourceManager): void {\n const isEditor = (this.requestContext.params && this.requestContext.params.isEditor) || false;\n const themeName = this.requestContext.params?.theme;\n for (let i = 0; i < pageData.slots.length; ++i) {\n const moduleInstance = pageData.slots[i];\n const moduleId = moduleInstance.id;\n this._moduleList.push({\n id: moduleInstance.id,\n typeName: moduleInstance.typeName,\n dataActions: moduleInstance.dataActions\n });\n\n this.requestCache.put(\n { typeName: MODULE_CACHE_KEY, key: moduleId },\n {\n item: { id: moduleInstance.id, typeName: moduleInstance.typeName }\n }\n );\n this.requestCache.put({ typeName: MODULE_CONFIG_KEY, key: moduleId }, { item: moduleInstance.config });\n this.requestCache.put({ typeName: MODULE_CONFIG_ERRORS_KEY, key: moduleId }, { item: moduleInstance.configErrors });\n this.requestCache.put({ typeName: MODULE_DATA_KEY, key: moduleId }, { item: moduleInstance.data });\n this.requestCache.put({ typeName: MODULE_ACTION_KEY, key: moduleId }, { item: moduleInstance.dataActions });\n this.requestCache.put({ typeName: MSDYN365_WYSIWYG_DISABLED_PROPS, key: moduleId }, { item: [] });\n this.requestCache.put({ typeName: MSDYN365_WYSIWYG_CANADDMODULE, key: moduleId }, { item: [] });\n\n if (resourceManager && !isEditor) {\n this.requestCache.put(\n { typeName: MODULE_RESOURCES_KEY, key: moduleInstance.typeName },\n { item: resourceManager.getModuleResources(moduleInstance.typeName, themeName, this.requestContext.locale) }\n );\n }\n }\n // In editor mode, put the resources for all modules for the current locale into the cache\n if (isEditor && resourceManager && this.requestContext.features.enableAuthoringRemoveAndAddModule) {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const bindings = (msdyn365Commerce).getAllModuleBinder();\n bindings.forEach((moduleBinder: IModuleBinder) => {\n this.requestCache.put(\n { typeName: MODULE_RESOURCES_KEY, key: moduleBinder.name },\n { item: resourceManager.getModuleResources(moduleBinder.name, themeName, this.requestContext.locale) }\n );\n });\n }\n }\n\n /**\n * Initializes theme modules list that need to be loaded on the client\n */\n private _initThemeModulesList(): void {\n this._themeModulesList = [];\n\n if (this.requestContext.params.theme) {\n this._themeModulesList.push(this.requestContext.params.theme);\n this._themeModulesList.push(getParentModuleName(this.requestContext.params.theme));\n }\n }\n\n /**\n * Function which rehydrate Async Results.\n */\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n private _rehydrateAsyncResults(cacheItem: any, cacheType: string, cachekey: string): void {\n // AsyncResults sent from server to client get serialized into basic JS objects,\n // They need to be \"rehydrated\" into actual AsyncResults to enable full functionality\n if (cacheItem.item && cacheItem.item._type && cacheItem.item._type === 'AsyncResult') {\n const metadata = cacheItem.item.metadata || {};\n if (cacheItem.item.status && cacheItem.item.status === 'SUCCESS') {\n cacheItem.item = AsyncResult.resolve(cacheItem.item.result);\n } else {\n cacheItem.item = AsyncResult.reject(cacheItem.item.error || 'Unable to parse data action');\n }\n cacheItem.item.metadata = metadata;\n }\n\n this.requestCache.put({ typeName: cacheType, key: cachekey }, { item: cacheItem.item });\n }\n\n /**\n * Construct module MetaData\n * @param name moduleName\n * @returns\n */\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n private _constructModuleMetaData(name: string): any {\n const cacheItem = this.requestCache.getValue({ typeName: MODULE_CACHE_KEY, key: name });\n if (!cacheItem) {\n throw new Error(`requested module id [${name}] is not found in module dictionary of pageconfig`);\n }\n\n const data = { ...(this.requestCache.getValue({ typeName: MODULE_DATA_KEY, key: name }) || {}) };\n const actions = this.requestCache.getValue({ typeName: MODULE_ACTION_KEY, key: name });\n const resources = this.requestCache.getValue>({ typeName: MODULE_RESOURCES_KEY, key: cacheItem.typeName });\n\n // toJS method\n if (actions) {\n // ToJS converts observable object to JS object.\n const actionMetaDataList = toJS(actions);\n if (actionMetaDataList) {\n for (const action of actionMetaDataList) {\n if (action.entity && action.inputs) {\n data[action.name] =\n Array.isArray(action.inputs) || isObservableArray(action.inputs)\n ? action.inputs.map((cacheKey: string) => this._populateDataActionResultFromCache(action.entity, cacheKey))\n : this._populateDataActionResultFromCache(action.entity, action.inputs);\n } else {\n data[action.name] = AsyncResult.reject('Action Input Creation Failure');\n }\n }\n }\n }\n\n const config = this.requestCache.getValue>({ typeName: MODULE_CONFIG_KEY, key: name }) || {};\n return {\n ...cacheItem,\n data: data,\n config:\n !(typeof window === 'undefined') && isAuthoringEditEnabled(this.requestContext)\n ? getWrappedProxyObject(config, name, cacheItem.typeName)\n : config,\n configErrors: this.requestCache.getValue({ typeName: MODULE_CONFIG_ERRORS_KEY, key: name }),\n resources: resources || {},\n disabledProperties: this.requestCache.getValue({ typeName: MSDYN365_WYSIWYG_DISABLED_PROPS, key: name }) || [],\n slotsForAddModule: this.requestCache.getValue({ typeName: MSDYN365_WYSIWYG_CANADDMODULE, key: name }) || []\n };\n }\n}\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport msdyn365Commerce, { ISessionStorageContext, ISessionStorageValue } from '@msdyn365-commerce/core-internal';\nimport { CookieContext } from './cookie-utils';\n\n/**\n * Context for session storage handling\n *\n * @export\n * @class CookieContext\n */\nexport class SessionStorageContext implements ISessionStorageContext {\n private _cookieContext: CookieContext;\n\n constructor(_cookieContext: CookieContext) {\n this._cookieContext = _cookieContext;\n }\n\n /**\n * Gets the value stored in the session storage.\n * Returns an empty object if no such value exists.\n *\n * @param {string} key - The key string.\n */\n public getDataFromStorage = (key: string): object => {\n if (key) {\n return this.get(key).value || {};\n }\n return {};\n };\n\n /**\n * Sets a new key pair value in the session storage.\n *\n * @param {string} key - The key string.\n * @param {object} value - The data object.\n */\n public setDataInStorage = (key: string, value: object): void => {\n if (key && value) {\n this.set(key, value);\n }\n };\n\n /**\n * Gets the checkout cart stored in the session storage.\n * Returns an empty object if no such value exists.\n *\n * @param {string} key - The key string.\n */\n public getCheckoutCartData = (key: string): object => {\n if (key) {\n return key ? this.getDataFromStorage(this.getCheckoutCartKey(key)) : {};\n }\n return {};\n };\n\n /**\n * Sets checkout cart value in the session storage.\n *\n * @param {string} key - The key string.\n * @param {object} value - The cart data object.\n */\n public setCheckoutCartData = (key: string, value: object): void => {\n if (key && value) {\n this.setDataInStorage(this.getCheckoutCartKey(key), value);\n }\n };\n\n /**\n * Remove session storage by giving key\n *\n * @param {string} key - The key string.\n */\n public removeDataFromStorage = (key: string): void => {\n if (key) {\n this.remove(key);\n }\n };\n\n /**\n * Remove checkout cart data from the session storage by giving key\n *\n * @param {string} key - The key string. If key is not provided clear all data from session storage that contais the checkout cart key prefix.\n */\n public removeCheckoutCartData = (key?: string): void => {\n if (key) {\n this.removeDataFromStorage(this.getCheckoutCartKey(key));\n } else {\n const keyList = Object.keys(sessionStorage);\n keyList.map(k => {\n if (k.startsWith(`${msdyn365Commerce.checkoutCartKeyPrefix}-`)) {\n this.removeDataFromStorage(k);\n }\n });\n }\n };\n\n /**\n * Get session storage value.\n * If server side, no-op.\n *\n * @param {string} key - The key string\n * @return {ISessionStorageValue} value with status\n */\n private get = (key: string): ISessionStorageValue => {\n if (key && msdyn365Commerce.isBrowser) {\n const objString = sessionStorage.getItem(key);\n if (objString) {\n const obj = JSON.parse(objString);\n return { name: key, value: obj, status: obj ? 'FOUND' : 'NOT_FOUND' };\n }\n }\n return { name: key, value: undefined, status: 'NOT_FOUND' };\n };\n\n /**\n * Set session storage data.\n * If server side, no-op.\n *\n * @param {string} key - The key string\n * @param {T} value - The session storage value\n */\n private set = (key: string, value: T): void => {\n if (key && msdyn365Commerce.isBrowser) {\n sessionStorage.setItem(key, JSON.stringify(value));\n }\n };\n\n /**\n * Remove session storage data by giving key\n * If server side, no-op.\n *\n * @param {string} key - The key string\n */\n private remove = (key: string): void => {\n if (key && msdyn365Commerce.isBrowser) {\n sessionStorage.removeItem(key);\n }\n };\n\n /**\n * Build the checkout cart key for the session storage\n */\n private getCheckoutCartKey = (key: string): string => {\n const checkoutCartCookie = this._cookieContext.getCheckoutCartCookie();\n if (checkoutCartCookie) {\n return `${msdyn365Commerce.checkoutCartKeyPrefix}-${checkoutCartCookie}-${key}`;\n }\n return '';\n };\n}\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport axios from 'axios';\nimport { IRequestContext, msdyn365Commerce, IRequestContextForSegment } from '@msdyn365-commerce/core-internal';\nimport { IInternalTelemetry, LogLevel } from '@msdyn365-commerce/telemetry-internal';\n\ninterface ISegmentProvider {\n providerId: string;\n segmentIds: string[];\n}\n\nconst REQUEST_CONTEXT_PROPERTIES_FOR_SEG = ['clientIPAddress', 'cookieString', 'cookie', 'query', 'params', 'apiSettings', 'features'];\n\nexport const resolveMissingSegmentsOnClient = (requestContext: IRequestContext, userId: string, telemetry: IInternalTelemetry) => {\n if (!requestContext || !requestContext.missingSegments || requestContext.missingSegments.length) {\n return;\n }\n let domain = requestContext.canonicalDomain || '';\n if (msdyn365Commerce.isBrowser) {\n domain = window.location.hostname;\n }\n const missingSegments: ISegmentProvider[] = [];\n const neededMissingSegments = requestContext.missingSegments;\n Object.keys(neededMissingSegments).forEach((providerId: string) => {\n const segmentProvider: ISegmentProvider = {\n providerId: providerId,\n segmentIds: neededMissingSegments[providerId]\n };\n missingSegments.push(segmentProvider);\n });\n // if there is no misisng segments. return.\n if (missingSegments.length === 0) {\n return;\n }\n // add cookie string. So we are able to re-construct cookie obj when oneRf call Node to resolve segments.\n requestContext.cookieString = (document && document.cookie) || '';\n const segmentRequestId = requestContext.segmentRequestId;\n const missingSegmentResolvingUrl = `https://${domain}/_msdyn365/getsegment`;\n\n // only maintain selected properties of requestContext.\n const segRequestContext: IRequestContextForSegment = {};\n REQUEST_CONTEXT_PROPERTIES_FOR_SEG.forEach((property: string) => {\n if (property in requestContext && !!requestContext[property]) {\n segRequestContext[property] = requestContext[property];\n }\n });\n\n const requestContextObject = requestContext?.features?.disable_segment_requestContext ? requestContext : segRequestContext;\n\n axios({\n method: 'post',\n url: missingSegmentResolvingUrl,\n data: {\n segmentProviderList: missingSegments,\n userId: userId,\n requestContext: requestContextObject,\n ...(segmentRequestId && { segmentRequestId: segmentRequestId })\n }\n })\n // after post request, oneRf will process the request. Node will not receive any response.\n .then()\n .catch(err => telemetry.log(LogLevel.Error, `Error in resolving segments from AJAX call for ${domain}`, { exception: err }));\n};\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport { ActionContext, CLIENT_HYDRATE_KEY, CLIENT_HYDRATE_TYPE } from '@msdyn365-commerce/action-internal';\nimport { RequestCache, ICacheKey, ICache } from '@msdyn365-commerce/cache-internal';\nimport {\n CoreContext,\n CultureInfoFormatter,\n IActionContext,\n IAny,\n ICoreContext,\n IDictionary,\n IGeneric,\n IModule,\n IModuleContract,\n IMSDyn365Window,\n IPartnerThemeSettings,\n IRequestContext,\n IRequestContextUrl,\n IVariants,\n msdyn365Commerce\n} from '@msdyn365-commerce/core-internal';\nimport {\n ClientAppInsightsJSLogger,\n LoggerType,\n EVENT_CLIENT_RENDER_START,\n EVENT_CLIENT_RENDER_STOP,\n CONTENT_SECURITY_POLICY_ERROR,\n EVENT_WEB_VITALS_CLS,\n EVENT_WEB_VITALS_FCP,\n EVENT_WEB_VITALS_FID,\n EVENT_WEB_VITALS_LCP,\n EVENT_WEB_VITALS_TTFB,\n EXCEPTION_CLIENT_CACHE_HYDRATE,\n EXCEPTION_LOAD_DATA_EXCEPTION,\n EXCEPTION_PRODUCT_LIST_CLIENTSIDE_HYDRATION,\n expAttributeRenderer,\n GenericConsoleLogger,\n IEventClientRenderMetrics,\n IEventClientRenderProperties,\n IEventClientWebVitalsCLSMetrics,\n IEventId,\n IEventTime,\n ITelemetry,\n LogLevel,\n MESSAGE_CLIENT_RENDER_ERROR,\n StaticTelemetry,\n Telemetry,\n TelemetryEvent,\n InternalTelemetry,\n TSuccessNumber\n} from '@msdyn365-commerce/telemetry-internal';\nimport axios from 'axios';\nimport 'lazysizes';\nimport 'lazysizes/plugins/attrchange/ls.attrchange';\n// eslint-disable-next-line import/no-unassigned-import\nimport 'lazysizes/plugins/bgset/ls.bgset';\nimport { partition as _partition } from 'lodash';\nimport * as React from 'react';\nimport * as ReactDOM from 'react-dom';\nimport { getCLS, getFCP, getFID, getLCP, getTTFB } from 'web-vitals';\nimport {\n RSRequestInterceptor,\n RSRequestInterceptorErrorHandler,\n RSResponseInterceptor,\n RSResponseInterceptorErrorHandler\n} from '../_server/inteceptors/rs-logging-interceptor';\nimport SafeRenderModule from '../components/safe-render-module';\nimport {\n CLIENT_RENDER_COMPLETE_EVENT,\n CLIENT_RENDER_START_EVENT,\n DEPRECATED_CLIENT_RENDER_COMPLETE_EVENT,\n LAYOUT_MOUNT_POINT,\n PROCESS_TYPE,\n MODULE_CONFIG_KEY,\n CLIENT_ENTRY_POINTS_TYPE\n} from '../consts';\nimport { loadData } from '../data/load-data';\nimport { processComplexDataTypes } from '../hydrators/process-page-response';\nimport { IDisabledProperties } from '../store/authoring-edit-helper';\nimport { PageContext } from '../store/page-context';\nimport {\n getCurrencyCodeFromContext,\n isLazyRenderModuleEnabled,\n optimizedGetAllModules,\n shouldOptimizeHydrate,\n timeSliceLongJSTask\n} from '../utils/helpers';\nimport { SessionStorageContext } from '../utils/session-storage-utils';\nimport { CookieContext } from './../utils/cookie-utils';\nimport { resolveMissingSegmentsOnClient } from './../utils/resolve-segments-utils';\n\ntype windowinitialData = IGeneric;\n\ndeclare global {\n // eslint-disable-next-line @typescript-eslint/naming-convention\n interface ClientWindow extends IMSDyn365Window {\n ___initialData___: windowinitialData;\n cache: RequestCache;\n }\n}\n\ndeclare let window: ClientWindow;\n\naxios.interceptors.request.use(RSRequestInterceptor, RSRequestInterceptorErrorHandler);\naxios.interceptors.response.use(RSResponseInterceptor, RSResponseInterceptorErrorHandler);\n\nconst CLIENT_HYDRATE_CACHE_KEY: ICacheKey = {\n key: CLIENT_HYDRATE_KEY,\n typeName: CLIENT_HYDRATE_TYPE\n};\n\nexport const getRequestContext = (storeData: windowinitialData): IRequestContext => {\n const requestContext: IRequestContext = storeData.requestContext;\n\n // See if cookie compliance is disabled at the site level\n const disableCookieCompliance =\n (requestContext.app && requestContext.app.platform && requestContext.app.platform.disableCookieCompliance) || false;\n const cartSessionExpiration =\n (requestContext.app && requestContext.app.platform && requestContext.app.platform.cartSessionExpiration) || 0;\n const cookies = new CookieContext({\n isConsentRequired: !disableCookieCompliance,\n cartExpirationInDays: cartSessionExpiration,\n sameSiteRequired: requestContext.sameSiteRequired\n });\n\n try {\n // merge the query params from url back to request context in case if the page response is cached\n const urlSearchParams = new URLSearchParams(window.location.search);\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const entries = Object.fromEntries((urlSearchParams as any).entries());\n Object.keys(entries || {}).map(param => {\n if (requestContext.query && !requestContext.query[param]) {\n requestContext.query[param] = entries[param] || '';\n }\n });\n } catch (e) {\n console.error('merging query parameters from url failed');\n }\n\n if (requestContext.telemetrySettings && storeData['_clientPlatformSetting']) {\n requestContext.telemetrySettings.operationalInsightsInstrumentationKey =\n storeData['_clientPlatformSetting'].secondaryInstrumentationKey;\n }\n requestContext.cookies = cookies;\n requestContext.sessionStorage = new SessionStorageContext(cookies);\n requestContext.headers = Object.freeze({});\n requestContext.url.requestUrl =\n typeof requestContext.url.requestUrl === 'string' ? new URL(requestContext.url.requestUrl) : requestContext.url.requestUrl;\n return requestContext;\n};\n\nconst setClientHydrateContext = (requestCache: ICache) => {\n requestCache.put(CLIENT_HYDRATE_CACHE_KEY, { item: true });\n};\n\nconst resetClientHydrateContext = (requestCache: ICache) => {\n requestCache.del(CLIENT_HYDRATE_CACHE_KEY);\n};\n\nconst getPathName = (requestContextUrl: IRequestContextUrl): string => {\n if (requestContextUrl && requestContextUrl.requestUrl && requestContextUrl.requestUrl.pathname) {\n return requestContextUrl.requestUrl.pathname;\n }\n return '';\n};\n\nconst isPaymentVerification = (requestContext: IRequestContext): boolean => {\n return requestContext.query?.pv === '1';\n};\n\nconst isCheckoutRoute = (requestContext: IRequestContext): boolean => {\n return (\n requestContext.app &&\n requestContext.app.routes &&\n requestContext.app.routes.checkout &&\n requestContext.app.routes.checkout.destinationUrl &&\n getPathName(requestContext.url) === requestContext.app.routes.checkout.destinationUrl\n );\n};\n\nconst activateExperiments = (requestContext: IRequestContext): void => {\n // Activate experiment if an experimentation connector has been registered and active experiments are provided\n // In a preview scenario, OneRF will not send a user ID and which we will not active the experiment\n if (\n msdyn365Commerce.experimentationConnector &&\n requestContext.features.experimentation &&\n requestContext.experiments &&\n requestContext.experiments.userId &&\n requestContext.experiments.activeExperiments &&\n requestContext.experiments.activeExperiments.length > 0\n ) {\n const experimentInfo = requestContext.experiments;\n // Split the experiment list into two lists, one whose experiments are coupled with a module and one whose experiments are not\n const [experimentsWithoutModuleId, experimentsWithModuleId] = _partition(experimentInfo.activeExperiments, (value: IVariants) => {\n return !value.moduleId;\n });\n // Activate experiments not tied to a module id\n msdyn365Commerce.experimentationConnector.provider.activateExperiment(experimentInfo.userId, experimentsWithoutModuleId, {\n Type: requestContext.device.Type\n });\n\n // Activate experiments once 30% of the module is visible\n const options: IntersectionObserverInit = {\n threshold: 0.3\n };\n const experimentMap: IDictionary = {};\n const experimentObserver = new IntersectionObserver((entries: IntersectionObserverEntry[], observer: IntersectionObserver) => {\n entries.forEach((entry: IntersectionObserverEntry) => {\n if (entry.isIntersecting && entry.intersectionRatio >= 0.3) {\n const activatedExpId = entry.target.getAttribute(`data-exp`);\n if (activatedExpId) {\n // Find the experiment/variant combo associated with the experiment to activate\n msdyn365Commerce.experimentationConnector?.provider.activateExperiment(\n experimentInfo.userId,\n [experimentMap[activatedExpId]],\n {\n Type: requestContext.device.Type\n }\n );\n }\n // Once we the element has come into the view for the first time, we can stop observing it\n observer.unobserve(entry.target);\n }\n });\n }, options);\n for (let i = 0; i < experimentsWithModuleId.length; i++) {\n const currentExperiment = experimentsWithModuleId[i];\n const target = document.querySelector(`[data-exp=\"id:${currentExperiment.experimentId}\"]`);\n if (target) {\n experimentMap[`id:${currentExperiment.experimentId}`] = currentExperiment;\n experimentObserver.observe(target);\n }\n }\n }\n};\n\n/**\n * Method to hydrate the markup returned by server on the client.\n * @param requestContext request context object\n * @param pageContext page context object\n * @param coreContext core context object\n */\nconst hydrateClient = (requestContext: IRequestContext, pageContext: PageContext, coreContext: ICoreContext) => {\n const pageRoot = pageContext.pageRoot;\n const body = pageRoot.modules && pageRoot.modules.body;\n const props = body && body.length > 0 ? body[0] : pageRoot;\n const defaultPageConfig =\n (!!!requestContext?.features?.disable_moduleConfig_optimize &&\n pageContext.requestCache.getValue({ typeName: MODULE_CONFIG_KEY, key: props.id })) ||\n props.config;\n try {\n ReactDOM.hydrate(\n \n ,\n document.getElementById(LAYOUT_MOUNT_POINT)\n );\n } catch (err) {\n // If in dev mode or debug mode, throw the error so it's visible on the page.\n if ((process.env.NODE_ENV === 'development' || requestContext.params.isDebug) && !requestContext.params.isEditor) {\n throw err;\n // In editor mode, catch the error but don't throw so that the page doesn't freeze up\n } else if (requestContext.params.isEditor) {\n console.log(`Error running editor (client) render: ${err}`);\n }\n }\n};\n\n/**\n * Method to initialize authoring helper and register event to receive list of disabled properties when rendered in the context of site builder\n * @param requestContext request context object\n * @param pageContext page context object\n * @param coreContext core context object\n * @param actionContext action context object\n * @param moduleTelemetry module telemetry object\n */\nconst initAuthoringHelper = (\n requestContext: IRequestContext,\n pageContext: PageContext,\n coreContext: ICoreContext,\n actionContext: IActionContext,\n moduleTelemetry\n) => {\n const themeSettings: IPartnerThemeSettings = window.___initialData___.themeSettings ? window.___initialData___.themeSettings : {};\n\n return import('../utils/authoring-tools-helper').then(m => {\n const AuthoringToolsHelper = m.AuthoringToolsHelper;\n const authoringHelper = new AuthoringToolsHelper(actionContext, themeSettings, coreContext, pageContext, moduleTelemetry);\n window._msdyn365.authoringHelper = authoringHelper;\n\n const _msdyn365Data = window._msdyn365;\n _msdyn365Data.authoringHelper = authoringHelper;\n\n if (requestContext.params.isEditor) {\n // @ts-ignore\n document.addEventListener('_msdyn365_client_disabled_properties', (dpEvent: { detail: IDisabledProperties }) => {\n if (dpEvent && dpEvent.detail && dpEvent.detail) {\n Object.keys(dpEvent.detail.modules).map(key => {\n authoringHelper.updateDisabledProperties(key, dpEvent.detail.modules[key]);\n });\n }\n });\n }\n });\n};\n\nexport function clientRender(): void {\n const storeData = window.___initialData___;\n if (!storeData || typeof storeData !== 'object') {\n console.error(MESSAGE_CLIENT_RENDER_ERROR);\n return;\n }\n const removePlaceholderModules = (modulesDictionary: { [slot: string]: IModuleContract[] }) => {\n Object.keys(modulesDictionary || {}).forEach(slot => {\n modulesDictionary[slot] = modulesDictionary[slot].filter(a => a.typeName !== 'place-holder-for-container-preview');\n modulesDictionary[slot].forEach(module => module.modules && removePlaceholderModules(module.modules));\n });\n };\n const requestContext = getRequestContext(storeData);\n if (requestContext.params.isEditor) {\n removePlaceholderModules(storeData.pageRoot.modules);\n }\n\n // if request is not POST or is not a checkout route or is not a payment verification, clear all checkout session storage data.\n // TODO: Explore a way to move this logic to SSK\n if (!requestContext.requestFormData || !isCheckoutRoute(requestContext) || !isPaymentVerification(requestContext)) {\n requestContext.sessionStorage.removeCheckoutCartData();\n }\n\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const appCache = (msdyn365Commerce as any).getAppCache(requestContext);\n const pageContext = new PageContext(storeData, requestContext, appCache);\n\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n (window as any).__msdyn365__ = {};\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n (window as any).__msdyn365__.pageContext = pageContext;\n\n // Get the 1DS instance from the browser client. Initialized as part of base-page\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const oneDSWeb: any = window['oneDSWeb'];\n\n // Get the registered experiment listener\n const expListener = msdyn365Commerce.experimentationConnector?.listener;\n\n // Get application insights instrumentation key\n const appInsightsInstrumentationKey = requestContext.telemetrySettings.instrumentationKey || '';\n let msftClientAppInsightsJSLogger;\n if (appInsightsInstrumentationKey !== '') {\n msftClientAppInsightsJSLogger = new ClientAppInsightsJSLogger(\n LoggerType.MSFTApplicationInsightsLogger,\n appInsightsInstrumentationKey\n );\n }\n\n // Get operational insights instrumentation key\n const operationalInsightsInstrumentationKey = requestContext.telemetrySettings.operationalInsightsInstrumentationKey || '';\n let operationalClientAppInsightsJSLogger;\n if (operationalInsightsInstrumentationKey !== '') {\n operationalClientAppInsightsJSLogger = new ClientAppInsightsJSLogger(\n LoggerType.OperationalApplicationInsightsLogger,\n operationalInsightsInstrumentationKey\n );\n }\n\n // Set up internal SDK telemetry\n const internalTelemetry = StaticTelemetry;\n internalTelemetry.enableDataAnalytics(requestContext.features.enableDataAnalytics);\n internalTelemetry.registerWebAnalyticsPlugin(oneDSWeb);\n internalTelemetry.registerAttributeRenderer(expAttributeRenderer);\n if (appInsightsInstrumentationKey !== '') {\n internalTelemetry.registerTraceLogger({\n traceLogger: msftClientAppInsightsJSLogger\n });\n }\n\n internalTelemetry.setTelemetryRequestContext({\n siteId: '[[Placeholder]]',\n channelId: requestContext.channel?.RecordId ? requestContext.channel.RecordId.toString() : 'Unavailable',\n pageType: requestContext.urlTokens.pageType,\n pageId: pageContext.pageRoot.id\n });\n\n const correlationId = Telemetry.generateGuid();\n logWebVitals(internalTelemetry, correlationId);\n\n const targetId = requestContext?.tuid;\n if (targetId) {\n resolveMissingSegmentsOnClient(requestContext, targetId, internalTelemetry);\n }\n\n // Set up external module telemetry\n const moduleTelemetry = new Telemetry();\n moduleTelemetry.enableDataAnalytics(requestContext.features.enableDataAnalytics);\n moduleTelemetry.registerWebAnalyticsPlugin(oneDSWeb);\n moduleTelemetry.registerAttributeRenderer(expAttributeRenderer);\n if (operationalInsightsInstrumentationKey) {\n moduleTelemetry.registerTraceLogger({\n traceLogger: operationalClientAppInsightsJSLogger\n });\n }\n\n // If experimentaiton listener set up, add to event logging framework\n if (expListener && requestContext.features.experimentation) {\n internalTelemetry.registerExpLogger(expListener);\n\n moduleTelemetry.registerExpLogger(expListener);\n }\n\n // If in debug mode, add console loggers\n if (requestContext.params.isDebug) {\n internalTelemetry.registerTraceLogger({ traceLogger: GenericConsoleLogger, options: { isDebug: requestContext.params.isDebug } });\n moduleTelemetry.registerTraceLogger({ traceLogger: GenericConsoleLogger, options: { isDebug: requestContext.params.isDebug } });\n }\n\n const contentSecurityPolicy = requestContext.app && requestContext.app?.contentSecurityPolicy;\n\n // Logging CSP error only when CSP is enabled and enableReportOnlyMode is false\n if (contentSecurityPolicy && !contentSecurityPolicy?.disableContentSecurityPolicy && !contentSecurityPolicy?.enableReportOnlyMode) {\n const randomNumberGenerator = Math.floor(Math.random() * 100);\n\n document.addEventListener('securitypolicyviolation', e => {\n const cspReport = JSON.stringify({\n 'blocked-uri': e.blockedURI,\n 'document-uri': e.documentURI,\n 'original-policy': e.originalPolicy,\n 'violated-directive': e.violatedDirective\n });\n\n // Only logging all CSP errors for 25% of page request\n if (randomNumberGenerator < 25) {\n internalTelemetry.log(LogLevel.Error, CONTENT_SECURITY_POLICY_ERROR, { customTags: [cspReport] });\n }\n });\n }\n\n pageContext\n .putRequestedModulesInCacheOnClient(storeData, moduleTelemetry)\n .catch(error => {\n internalTelemetry.log(LogLevel.Error, EXCEPTION_CLIENT_CACHE_HYDRATE, { exception: error });\n })\n .finally(async () => {\n await timeSliceLongJSTask(requestContext);\n\n window._msdyn365 = {\n requestContext: requestContext,\n telemetry: internalTelemetry\n };\n\n const actionContext = new ActionContext({\n id: 'Client Action Context',\n requestContext: requestContext,\n requestCache: pageContext.requestCache,\n telemetry: moduleTelemetry,\n appCache: null,\n spawnChildOnExecute: true\n });\n\n if (requestContext.params.isDebug) {\n window._msdyn365.cache = pageContext.requestCache;\n }\n const coreContext: ICoreContext = {\n actionContext: actionContext,\n app: requestContext.app,\n // @ts-ignore -- we don't actually have this prop defined on the interface\n internalTelemetry: internalTelemetry,\n telemetry: moduleTelemetry,\n request: requestContext,\n cultureFormatter: new CultureInfoFormatter(\n requestContext.locale,\n getCurrencyCodeFromContext(requestContext),\n requestContext.query\n )\n };\n let allModules: IModule[] = [];\n await timeSliceLongJSTask(requestContext);\n if (requestContext?.features?.loadData_optimization) {\n allModules = await optimizedGetAllModules(pageContext, requestContext);\n } else {\n allModules = await pageContext.allModules(requestContext, []);\n }\n\n const allowDispatchEvent = requestContext?.params?.isEditor || requestContext?.features?.enable_verbose_logs ? true : false;\n if (shouldOptimizeHydrate(requestContext)) {\n await optimizeClientHydrate(\n requestContext,\n pageContext,\n coreContext,\n actionContext,\n allModules,\n moduleTelemetry,\n internalTelemetry,\n correlationId\n );\n } else {\n if (requestContext.params.isEditor) {\n await initAuthoringHelper(requestContext, pageContext, coreContext, actionContext, moduleTelemetry);\n }\n\n // Fire event to let tooling know render starts. Tools on receiving this event, calls\n // initialziation and passes the rendering helper class instance that can be used by SDK to\n // get any information/context w.r.t tools\n if (allowDispatchEvent) {\n const event = new Event(CLIENT_RENDER_START_EVENT);\n document.dispatchEvent(event);\n }\n\n if (allowDispatchEvent) {\n internalTelemetry.trackEvent(EVENT_CLIENT_RENDER_START, {\n id: correlationId\n });\n internalTelemetry.startTimer(correlationId);\n }\n\n let initialPromise: Promise = Promise.resolve();\n const LAZYLOAD_ALL_SWITCH: boolean = requestContext.features.lazyload_all;\n\n initialPromise = initialPromise.then(async () => {\n try {\n return processComplexDataTypes(LAZYLOAD_ALL_SWITCH, PROCESS_TYPE.client, allModules, actionContext);\n } catch (error) {\n internalTelemetry.log(LogLevel.Error, EXCEPTION_PRODUCT_LIST_CLIENTSIDE_HYDRATION, { exception: error });\n }\n });\n\n initialPromise.finally(() => {\n // put client hydrate flag into request cache.\n setupClientHydrateFlag(pageContext.requestCache);\n loadData(allModules, requestContext, internalTelemetry, moduleTelemetry, pageContext.requestCache, null)\n .then(() => {\n if (allowDispatchEvent) {\n internalTelemetry.trackEvent(\n EVENT_CLIENT_RENDER_STOP,\n {\n id: correlationId\n },\n {\n success: 1,\n time: internalTelemetry.stopTimer(correlationId)\n }\n );\n }\n })\n .catch(error => {\n if (allowDispatchEvent) {\n internalTelemetry.trackEvent(\n EVENT_CLIENT_RENDER_STOP,\n {\n id: correlationId\n },\n {\n success: 0,\n time: internalTelemetry.stopTimer(correlationId)\n }\n );\n }\n internalTelemetry.log(LogLevel.Error, EXCEPTION_LOAD_DATA_EXCEPTION, { exception: error });\n })\n .finally(() => {\n // remove client hydrate flag from request cache.\n resetClientHydrateContext(pageContext.requestCache);\n // Gets a reference to the same Telemetry, so that we can route existing log calls to new back-end without changing front-end API\n\n if (!shouldOptimizeHydrate(requestContext)) {\n hydrateClient(requestContext, pageContext, coreContext);\n }\n msdyn365Commerce.setClientHydrate(false);\n // Add the page view exp event id to the page level div\n const pageName = requestContext.telemetryPageName || requestContext.url.requestUrl.pathname;\n document.getElementById(LAYOUT_MOUNT_POINT)?.setAttribute('data-exp-event-id', `${pageName}.PageView`);\n // Activate any active experiments on the page\n activateExperiments(requestContext);\n\n // TODO (matt, 6/15/20): Manually firing page view event, undo once 1DS forwarding to framework implemented\n internalTelemetry.logEvent(TelemetryEvent.PageView, {\n title: requestContext.telemetryPageName || requestContext.url.requestUrl.pathname\n });\n\n if (allowDispatchEvent) {\n // Fire event to let tooling know render is complete\n const deprecatedEvent = new Event(DEPRECATED_CLIENT_RENDER_COMPLETE_EVENT);\n document.dispatchEvent(deprecatedEvent);\n\n document.dispatchEvent(new Event(CLIENT_RENDER_COMPLETE_EVENT));\n }\n });\n });\n }\n });\n\n // TODO (matt, 6/15/20): Manually firing page view event, undo once 1DS forwarding to framework implemented\n internalTelemetry.logEvent(TelemetryEvent.PageView, {\n title: requestContext.telemetryPageName || requestContext.url.requestUrl.pathname\n });\n}\n\nconst setupClientHydrateFlag = (requestCache: ICache) => {\n setClientHydrateContext(requestCache);\n msdyn365Commerce.setClientHydrate(true);\n};\n\nconst optimizeClientHydrate = async (\n requestContext: IRequestContext,\n pageContext: PageContext,\n coreContext: ICoreContext,\n actionContext: ActionContext,\n allModules: IModule[],\n moduleTelemetry: ITelemetry,\n internalTelemetry: InternalTelemetry,\n correlationId: string\n) => {\n try {\n // Await on instance data actions, other data actions are run asynchronously\n setupClientHydrateFlag(pageContext.requestCache);\n\n let modulesRenderedOnServer = allModules;\n if (isLazyRenderModuleEnabled(requestContext)) {\n modulesRenderedOnServer = allModules.filter(m => {\n const cacheItem = pageContext.requestCache.get({ typeName: CLIENT_ENTRY_POINTS_TYPE, key: m.typeName })?.item;\n return !cacheItem;\n });\n }\n await timeSliceLongJSTask(requestContext);\n\n await loadData(modulesRenderedOnServer, requestContext, internalTelemetry, moduleTelemetry, pageContext.requestCache, null);\n resetClientHydrateContext(pageContext.requestCache);\n const allowDispatchEvent = requestContext?.params?.isEditor || requestContext?.features?.enable_verbose_logs ? true : false;\n\n // Fire event to let tooling know render starts. Tools on receiving this event, calls\n // initialziation and passes the rendering helper class instance that can be used by SDK to\n // get any information/context w.r.t tools\n if (allowDispatchEvent) {\n const event = new Event(CLIENT_RENDER_START_EVENT);\n document.dispatchEvent(event);\n }\n\n if (requestContext?.features?.enable_verbose_logs) {\n internalTelemetry.trackEvent(EVENT_CLIENT_RENDER_START, {\n id: correlationId\n });\n internalTelemetry.startTimer(correlationId);\n }\n\n // hydrate client without waiting on all the data actions to complete\n hydrateClient(requestContext, pageContext, coreContext);\n msdyn365Commerce.setClientHydrate(false);\n\n if (allowDispatchEvent) {\n trackEvent(internalTelemetry, correlationId, EVENT_CLIENT_RENDER_STOP, 1);\n }\n\n if (requestContext.params.isEditor) {\n await initAuthoringHelper(requestContext, pageContext, coreContext, actionContext, moduleTelemetry);\n }\n\n const LAZYLOAD_ALL_SWITCH: boolean = requestContext.features.lazyload_all;\n\n try {\n await processComplexDataTypes(LAZYLOAD_ALL_SWITCH, PROCESS_TYPE.client, allModules, actionContext);\n } catch (error) {\n internalTelemetry.log(LogLevel.Error, EXCEPTION_PRODUCT_LIST_CLIENTSIDE_HYDRATION, { exception: error });\n }\n\n // Add the page view exp event id to the page level div\n const pageName = requestContext.telemetryPageName || requestContext.url.requestUrl.pathname;\n document.getElementById(LAYOUT_MOUNT_POINT)?.setAttribute('data-exp-event-id', `${pageName}.PageView`);\n // Activate any active experiments on the page\n activateExperiments(requestContext);\n\n if (allowDispatchEvent) {\n // Fire event to let tooling know render is complete\n const deprecatedEvent = new Event(DEPRECATED_CLIENT_RENDER_COMPLETE_EVENT);\n document.dispatchEvent(deprecatedEvent);\n document.dispatchEvent(new Event(CLIENT_RENDER_COMPLETE_EVENT));\n }\n } catch (error) {\n if (requestContext.features.enable_verbose_logs) {\n trackEvent(internalTelemetry, correlationId, EVENT_CLIENT_RENDER_STOP, 0);\n }\n internalTelemetry.log(LogLevel.Error, EXCEPTION_LOAD_DATA_EXCEPTION, { exception: error });\n }\n};\n\nconst trackEvent = (internalTelemetry: InternalTelemetry, correlationId: string, eventName: string, success: TSuccessNumber) => {\n internalTelemetry.trackEvent(\n eventName,\n {\n id: correlationId\n },\n {\n success,\n time: internalTelemetry.stopTimer(correlationId)\n }\n );\n};\n\nconst logWebVitals = (internalTelemetry: InternalTelemetry, correlationId: string) => {\n getCLS(metric => {\n internalTelemetry.trackEvent(\n EVENT_WEB_VITALS_CLS,\n { id: correlationId },\n { value: metric.value }\n );\n });\n getFCP(metric => {\n internalTelemetry.trackEvent(EVENT_WEB_VITALS_FCP, { id: correlationId }, { time: metric.value });\n });\n getFID(metric => {\n internalTelemetry.trackEvent(EVENT_WEB_VITALS_FID, { id: correlationId }, { time: metric.value });\n });\n getLCP(metric => {\n internalTelemetry.trackEvent(EVENT_WEB_VITALS_LCP, { id: correlationId }, { time: metric.value });\n });\n getTTFB(metric => {\n internalTelemetry.trackEvent(EVENT_WEB_VITALS_TTFB, { id: correlationId }, { time: metric.value });\n });\n};\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport { IAny, IGeneric, MSDyn365Commerce, msdyn365Commerce } from '@msdyn365-commerce/core-internal';\nimport * as React from 'react';\nimport { IBinding, IModuleBinder, IMSDyn365CommerceWithPrototype } from './models';\n\nexport const initializeApp = (bindings: IBinding) => {\n /**\n * Why we are using 'Prototype'. MSDyn365Commerce is defined in core packages and used in modules and C1 development.\n * whereas all registration, build information, commerce details etc available in runtime-internal package.\n * prototype help us declaring properties in core package and implementation in runtime-internal package.\n *\n * Following properties are not accessible by module or c1 developer.\n */\n (MSDyn365Commerce).prototype.bindings = bindings;\n\n (MSDyn365Commerce).prototype.moduleBinder = function(name: string): IModuleBinder {\n return this.bindings && this.bindings.modules && this.bindings.modules[name && name.toLowerCase()];\n };\n\n (MSDyn365Commerce).prototype.viewBinder = function(name: string): React.FC {\n return this.bindings && this.bindings.views && this.bindings.views[name];\n };\n\n (MSDyn365Commerce).prototype.componentBinder = function(name: string): React.FC {\n return this.bindings && this.bindings.components && this.bindings.components[name];\n };\n\n (MSDyn365Commerce).prototype.getPartnerOverrideAction = function(id: string): Function {\n return this.bindings && this.bindings.partnerDataActions && this.bindings.partnerDataActions[id];\n };\n\n (MSDyn365Commerce).prototype.dataAction = function(name: string): Function {\n return (\n (this.bindings && this.bindings.partnerDataActions && this.bindings.partnerDataActions[name]) ||\n (this.bindings && this.bindings.dataActions && this.bindings.dataActions[name])\n );\n };\n\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n (MSDyn365Commerce).prototype.getConnector = function(name: string): any {\n return this.bindings && this.bindings.connectors && this.bindings.connectors[name];\n };\n\n (MSDyn365Commerce).prototype.getAllModuleBinder = function(): IModuleBinder[] {\n return this.bindings && this.bindings.modules && Object.values(this.bindings.modules);\n };\n\n // eslint-disable-next-line @typescript-eslint/no-explicit-any -- Returns an npm package source.\n (MSDyn365Commerce).prototype.perfAnalysisBinder = function(): any {\n return this.bindings?.perfAnalysisLibBinding;\n };\n\n (MSDyn365Commerce).prototype.updatePrivateVariable = function(): void {\n // @ts-ignore -- accessing a private class variable which is a valid JS\n this._env = process.env.NODE_ENV;\n };\n\n (>msdyn365Commerce).updatePrivateVariable();\n};\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\n/* eslint-disable @typescript-eslint/no-explicit-any */\nimport { ICache, ICacheKey } from '@msdyn365-commerce/cache-internal';\nimport { IComponent, IComponentProps, ICoreContext, IModule, msdyn365Commerce } from '@msdyn365-commerce/core-internal';\nimport { asSystemMetadata, EXCEPTION_NOMODULEBINDER, LogLevel } from '@msdyn365-commerce/telemetry-internal';\nimport React from 'react';\nimport * as path from 'path';\nimport { IMSDyn365CommerceExtension } from '../app-initialization/models';\nimport { getModuleName, getPageInsightsCacheKey, isPageInsightsEnabled } from '../utils/helpers';\nimport { PAGE_INSIGHTS_COMPONENTS_KEY } from '../consts';\n\nexport interface IModuleWithView extends IModule {\n View: React.FunctionComponent;\n}\n\nconst getModuleBinder = (typeName: string) => ((msdyn365Commerce as unknown) as IMSDyn365CommerceExtension).moduleBinder(typeName);\n\nconst getBinder = (lookupKey: string, moduleName: string, requestCache: ICache, pageInsightsEnabled: boolean) => {\n const view = ((msdyn365Commerce as unknown) as IMSDyn365CommerceExtension).componentBinder(lookupKey);\n if (view) {\n if (pageInsightsEnabled) {\n const componentInsightsKey = getPageInsightsCacheKey(PAGE_INSIGHTS_COMPONENTS_KEY);\n const componentInsights = requestCache.get<{}>(componentInsightsKey)?.item || {};\n componentInsights[`${moduleName}`] = `${lookupKey.replace(/\\|/g, '/')}.component.tsx`;\n requestCache.put(componentInsightsKey, { item: componentInsights });\n }\n\n return { key: lookupKey, view };\n }\n return undefined;\n};\n\n/* component will be read in following hierarchy\n 1) __local__/__local__|views/theme1/BuyBox/Components/PriceComponent\n 2) __local__/__local__|views/theme1/Components/PriceComponent\n 3) @msdyn-365-commerce-modules/theme1/views/BuyBox/Components/PriceComponent\n 4) @msdyn-365-commerce-modules/theme1/views/Components/PriceComponent\n */\nconst lookupFunc = (moduleBinder, themeBinder, name, requestCache: ICache, pageInsightsEnabled: boolean) => {\n name = name.toLowerCase();\n return (\n (themeBinder &&\n (getBinder(\n `__local__|__local__|themes|${themeBinder.name}|views|${moduleBinder.name}|components|${name}`,\n moduleBinder.name,\n requestCache,\n pageInsightsEnabled\n ) ||\n getBinder(\n `__local__|__local__|themes|${themeBinder.name}|views|components|${name}`,\n moduleBinder.name,\n requestCache,\n pageInsightsEnabled\n ) ||\n getBinder(\n `__local__|__local__|themes|${themeBinder.name}|views|components|${moduleBinder.name}|${name}`,\n moduleBinder.name,\n requestCache,\n pageInsightsEnabled\n ) ||\n getBinder(\n `${themeBinder.moduleNamespace}|${themeBinder.packageName}|modules|${themeBinder.name}|views|components|${moduleBinder.name}|${name}`,\n moduleBinder.name,\n requestCache,\n pageInsightsEnabled\n ) ||\n getBinder(\n `${themeBinder.moduleNamespace}|${themeBinder.packageName}|modules|${themeBinder.name}|views|components|${name}`,\n moduleBinder.name,\n requestCache,\n pageInsightsEnabled\n ))) ||\n getBinder(\n `${moduleBinder.moduleNamespace}|${moduleBinder.packageName}|views|${moduleBinder.name}|components|${name}`,\n moduleBinder.name,\n requestCache,\n pageInsightsEnabled\n )\n );\n};\n\n/**\n * Component will be read from the module\n * @msdyn-365-commerce-modules/BuyBox/views/BuyBox/Components/PriceComponent\n */\nconst defaultComponentLookupFunc = (moduleBinder, name: string, requestCache: ICache, pageInsightsEnabled: boolean) => {\n const parentModuleBinder = getModuleBinder(getModuleName(moduleBinder.parentDefinitionPath));\n\n return (\n getBinder(\n `${moduleBinder.moduleNamespace}|${moduleBinder.packageName}|views|${moduleBinder.name}|components|${name}`,\n moduleBinder.name,\n requestCache,\n pageInsightsEnabled\n ) ||\n (parentModuleBinder &&\n getBinder(\n `${parentModuleBinder.moduleNamespace}|${parentModuleBinder.packageName}|views|${parentModuleBinder.name}|components|${name}`,\n moduleBinder.name,\n requestCache,\n pageInsightsEnabled\n ))\n );\n};\n\nconst getComponent = (name, moduleBinder, themeBinder, context: ICoreContext) => {\n if (!moduleBinder) {\n return { view: null };\n }\n\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const cache: ICache = (msdyn365Commerce as any).getAppCache(context.actionContext.requestContext);\n const pageInsightsEnabled = isPageInsightsEnabled(context.request.params);\n const cacheKey: ICacheKey = {\n key: `${name}|${moduleBinder.name}|${themeBinder ? themeBinder.name : 'no-theme'}`,\n typeName: '__ComponentCacheKey__'\n };\n const lookupKey = cache.getValue(cacheKey);\n const actionContextData: any = context.actionContext;\n const requestCache: ICache = actionContextData.requestCache;\n\n if (lookupKey) {\n context.telemetry.log(LogLevel.Debug, `lookup key for component [${cacheKey.key}] found at - [${lookupKey}]`);\n !msdyn365Commerce.isBrowser && actionContextData.requestCache.put(cacheKey, { item: lookupKey });\n return getBinder(lookupKey, moduleBinder.name, requestCache, pageInsightsEnabled) || { view: null };\n }\n\n let component = lookupFunc(moduleBinder, themeBinder, name, requestCache, pageInsightsEnabled);\n\n // If no component found in the theme, search in parent theme (in case of inherited theme)\n if (!component && themeBinder) {\n const parentThemeName = getModuleName(themeBinder.parentDefinitionPath);\n const parentThemeBinder = getModuleBinder(parentThemeName);\n component = lookupFunc(moduleBinder, parentThemeBinder, name, requestCache, pageInsightsEnabled);\n }\n\n // If no component file found, fall back to module's default component\n if (!component) {\n component = defaultComponentLookupFunc(moduleBinder, name, requestCache, pageInsightsEnabled);\n }\n\n if (component) {\n context.telemetry.log(LogLevel.Debug, `lookup key for component [${cacheKey.key}] found at - [${component.key}]`);\n cache.put(cacheKey, { item: component.key });\n actionContextData.requestCache.put(cacheKey, { item: component.key });\n return component;\n }\n\n return { view: null };\n};\n\nexport const createComponent = >(name: string, componentObj: T) => (props: IComponentProps) => {\n props.context.telemetry.log(LogLevel.Debug, `rendering component-'${name}' within module-'${props.id}-${props.typeName}'`);\n const moduleBinder = getModuleBinder(props.typeName);\n if (!moduleBinder) {\n props.context.telemetry.log(LogLevel.Error, EXCEPTION_NOMODULEBINDER, { values: [asSystemMetadata(props.typeName)] });\n return null;\n }\n let componentName = path.basename(__filename);\n if (componentName) {\n componentName = componentName.replace('.component.tsx', '');\n componentName = componentName.replace('.component.js', '');\n }\n\n const themeBinder = getModuleBinder(props.context.actionContext.requestContext.params.theme);\n let componentView = getComponent(componentName, moduleBinder, themeBinder, props.context);\n if (!componentView.view) {\n componentView = getComponent(name, moduleBinder, themeBinder, props.context);\n }\n const { view } = componentView;\n const mergedComponent = view ? { ...((componentObj as unknown) as object), ...view } : componentObj;\n const Component = mergedComponent.component;\n const propsDictionary = props as any;\n if (propsDictionary.addChunk && view) {\n propsDictionary.addChunk(view.cn);\n }\n\n return MSDyn365Commerce).prototype.updatePrivateVariable = function(): void {\n // @ts-ignore -- accessing a private class variable which is a valid JS\n this.createComponent = createComponent;\n };\n (>msdyn365Commerce).updatePrivateVariable();\n};\n\nexport const initializeClientApp = async (bindings: IBinding, connectors: IConnectors) => {\n skipConsoleWarn();\n addCreateComponentHook();\n initializeApp(bindings);\n const clientPlatformSettings = (window).___initialData___ && (window).___initialData___._clientPlatformSetting;\n await initBindings(bindings, clientPlatformSettings && clientPlatformSettings.enableModuleEntryPoints);\n\n (MSDyn365Commerce).prototype.updatePrivateVariable = function(): void {\n const appDatabv = (window).___appData___ && (window).___appData___.bv;\n\n // @ts-ignore -- accessing a private class variable which is a valid JS\n this._buildVersion = appDatabv;\n\n // @ts-ignore -- accessing a private class variable which is a valid JS\n this._experimentationConnector = connectors?.experimentation;\n\n // @ts-ignore -- accessing a private class variable which is a valid JS\n this._platformSettings = clientPlatformSettings;\n\n // @ts-ignore -- accessing a private class variable which is a valid JS\n this._versionDependentFeatureInfo = (window).___initialData___ && (window).___initialData___._versionDependentFeatureInfo;\n\n // @ts-ignore -- accessing a private class variable which is a valid JS\n this._environmentVariable = (window).___initialData___ && (window).___initialData___._environmentVariable;\n };\n (>msdyn365Commerce).updatePrivateVariable();\n\n (MSDyn365Commerce).prototype.getAppCache = (requestContext: IRequestContext) => requestCache;\n};\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport path from 'path';\nimport { IBinding, IModuleBinder, IModuleBinderPartial } from './models';\n\n/* eslint-disable @typescript-eslint/no-explicit-any */\n\nexport const initBindings = async (bindings: IBinding, isModuleEntryPointsEnabled: boolean) => {\n await Promise.all(\n Object.keys(bindings.modules).map(async moduleKey => {\n const originalBinder: IModuleBinderPartial = (bindings.modules[moduleKey]);\n try {\n const binder: IModuleBinder = {};\n let fetchComponent;\n if (!isModuleEntryPointsEnabled) {\n fetchComponent = await originalBinder.c();\n }\n binder.component = isModuleEntryPointsEnabled\n ? function load() {\n return originalBinder.c();\n }\n : fetchComponent.default;\n binder.moduleDirectory = originalBinder.md;\n binder.dataActions = originalBinder.da;\n binder.packageName = originalBinder.p;\n binder.name = originalBinder.n;\n binder.definitionPath = path.join(originalBinder.md, `${originalBinder.n}.definition.json`);\n binder.parentDefinitionPath = originalBinder.pdp;\n binder.isNodeModule = originalBinder.iNM;\n binder.moduleNamespace = originalBinder.ns;\n binder.chunkName = `${originalBinder.ns}-${originalBinder.p}-${originalBinder.n}`;\n bindings.modules[moduleKey] = binder;\n } catch (e) {\n console.error(`failed to load module chunk :: ${moduleKey}`, e);\n }\n })\n );\n\n await Promise.all(\n Object.keys(bindings.views).map(async viewKey => {\n const viewComponent: any = bindings.views[viewKey];\n try {\n let fetchViewComponent;\n if (!isModuleEntryPointsEnabled) {\n fetchViewComponent = isModuleEntryPointsEnabled ? viewComponent.c() : await viewComponent.c();\n }\n (bindings.views[viewKey]).component = isModuleEntryPointsEnabled\n ? function load() {\n return viewComponent.c();\n }\n : fetchViewComponent.default;\n } catch (e) {\n console.error(`failed to load view chunk :: ${viewKey}`, e);\n }\n })\n );\n\n await Promise.all(\n Object.keys(bindings.components).map(async componentKey => {\n const ecommerceComponent: any = bindings.components[componentKey];\n try {\n const fetchEComComponent = await ecommerceComponent.c();\n (bindings.components[componentKey]).component = fetchEComComponent.default;\n } catch (e) {\n console.error(`failed to load component chunk :: ${componentKey}`, e);\n }\n })\n );\n};\n","/*******************************************************************************\n* Copyright (c) Microsoft Corporation.\n* All rights reserved. See LICENSE in the project root for license information.\n*******************************************************************************/\n\n\nimport 'custom-event-polyfill';\n\nimport { initializeClientApp, clientRender } from '@msdyn365-commerce/runtime-internal/dist/lib/client';\nconst { getUniqueRequestedAssets } = require('../common');\n\n// Fetches the registration object from a given file and dictionary name\n// If the module is not found or dictionary does not exist an empty object is returned\nconst fetchRegistrationObject = (registration, dictionaryName) => {\n return registration ? registration[dictionaryName] : {};\n};\n\n// Registers all the local and installed modules need to render the page client-side\nconst registerModules = () => {\n const bindings = window.__bindings__;\n // installed modules registration\n if (bindings) {\n return {\n modules: {\n ...bindings.modules\n },\n dataActions: {\n // load data actions in the order of the action overrides (installed and local)\n ...bindings.dataActions\n },\n partnerDataActions: {\n ...bindings.packageDataActions['__local__']\n },\n views: {\n ...bindings.viewDictionary\n }\n };\n }\n\n return {\n modules: {},\n dataActions: {},\n partnerDataActions: {},\n views: {}\n };\n};\n\nconst initializeConnectors = (connectorInformation = {}, connectorsRegistration, requestContext) => {\n let experimentationConnector;\n if (connectorsRegistration && connectorInformation) {\n const expConnectorName = connectorInformation.expConnector;\n if (expConnectorName && connectorsRegistration[expConnectorName]) {\n // Grab the stored config from the window object\n const config = window.___initialData___.experimentationConfig;\n // Grab the experimentation user ID\n const expUserId = requestContext && requestContext.experiments && requestContext.experiments.userId;\n // Initialize the provider and listener for client\n const experimentationProvider = connectorsRegistration[expConnectorName].provider;\n const experimentationListener = connectorsRegistration[expConnectorName].listener;\n\n if (!experimentationProvider || !experimentationListener) {\n return { experimentation: undefined };\n }\n\n experimentationProvider.initializeClientSide(config);\n experimentationListener.initializeClientSide(config, expUserId);\n experimentationConnector = { name: expConnectorName, provider: experimentationProvider, listener: experimentationListener };\n }\n }\n return { experimentation: experimentationConnector };\n};\n\nconst initializePerformanceUtils = async bindings => {\n return import(/* webpackChunkName: \"msdyn365-performance-chunk\" */ '@msdyn365-commerce/commerce-performance-analyzer').then(lib => {\n bindings.perfAnalysisLibBinding = lib;\n });\n};\n\nconst initializeClient = async () => {\n const requestedAssets = window.___initialData___ && getUniqueRequestedAssets(window.___initialData___);\n let bindings = { modules: {}, dataActions: {} };\n const requestContext = window.___initialData___ && window.___initialData___.requestContext;\n\n bindings = window.___initialData___ && registerModules(requestContext, requestedAssets);\n\n // component extensions registration\n try {\n bindings.components = fetchRegistrationObject(require('lib/component-registration'), 'componentDictionary');\n } catch (e) {\n if (e.code === 'MODULE_NOT_FOUND') {\n process.env.NODE_ENV === 'development' && console.log(`component registration files not found.`);\n }\n }\n\n // connectors registration\n try {\n bindings.connectors = fetchRegistrationObject(require('lib/connector-registration'), 'connectorDictionary');\n } catch (e) {\n if (e.code === 'MODULE_NOT_FOUND') {\n process.env.NODE_ENV === 'development' && console.log(`connector registration files not found.`);\n }\n }\n\n const connectorInformation = requestContext.connectors;\n const connectors = initializeConnectors(connectorInformation, bindings.connectors, requestContext);\n\n // eslint-disable-next-line camelcase\n const shouldRunPerformanceAnalysis = requestContext.features?.enable_performance_analysis && requestContext.params.isPerfAnalysis;\n if (shouldRunPerformanceAnalysis) {\n await initializePerformanceUtils(bindings);\n }\n\n await initializeClientApp(bindings, connectors);\n clientRender();\n};\n\nPromise.resolve().then(async () => {\n const initializeClientWithRetry = async retry => {\n if (retry > 3) {\n console.warn(`client initialization retry limit reached, Retry count: ${retry}`);\n // all retries failed but we should still render the page with the modules that are registered\n // safe render module will wrap the missing modules\n await initializeClient();\n return;\n }\n\n // Ideally, all the modules should be loaded by this time\n // However, loading does not guarantee execution of the script\n // in which case we should retry after a time window\n const bindings = window.__bindings__;\n if (!bindings) {\n setTimeout(() => initializeClientWithRetry(retry + 1), 500);\n return;\n }\n\n const lazyLoadedModules = window.___initialData___.requestCache.internalCache.__CEP__ || {};\n const modulesList = window.___initialData___._moduleList;\n const themesList = window.___initialData___._themeModulesList;\n const clientModulesList = new Set();\n modulesList.map(m => {\n if (m.typeName !== 'core-root' && !lazyLoadedModules[m.typeName.toUpperCase()]) {\n clientModulesList.add(m.typeName);\n }\n });\n themesList.map(m => m !== '' && clientModulesList.add(m));\n\n // make sure all the module chunks are loaded and executed before initializing the client\n let scriptsExecuted = true;\n Array.from(clientModulesList).map(m => {\n if (!bindings || !bindings.modules[m]) {\n scriptsExecuted = false;\n }\n });\n\n if (!bindings.packageDataActions?.['__local__']) {\n scriptsExecuted = false;\n }\n\n if (!scriptsExecuted) {\n setTimeout(() => initializeClientWithRetry(retry + 1), 500);\n return;\n }\n\n if (scriptsExecuted) {\n await initializeClient();\n } else {\n console.error(`client initialization failed, module scripts execution not complete. Retry count: ${retry}`);\n throw new Error(`client initialization failed, module scripts execution not complete. Retry count: ${retry}`);\n }\n };\n\n await initializeClientWithRetry(0);\n});\n","// This file is included in production builds as the first entry point in the bundle.\n// It must run before the rest of the bundle even executes, since it sets a variable that webpack uses\n// to resolve dynamic imports.\n\n// This variable is not global, it is a 'free' variable that is scoped to this bundle.\n__webpack_public_path__ = window.___publicPath___; // eslint-disable-line\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport React from 'react';\nimport { getRenderingHelper } from '../utils/helpers';\n\nexport type IAddModuleProps = {\n moduleId: string;\n slotId: string;\n enabled: boolean;\n mode: AddControlMode;\n index?: number;\n slotName?: string;\n parentId?: string;\n};\n\nexport enum AddControlMode {\n EmptySlot,\n Sibling\n}\nexport interface IAddModuleState {\n moduleId: string;\n}\n\n/**\n * Editable field component, containing all the logic for inline editable properties in editorial preview\n * Current support: text, image\n */\nexport class AddModuleControl extends React.Component {\n public constructor(props: IAddModuleProps) {\n super(props);\n this.state = {\n moduleId: props.moduleId\n };\n }\n public render(): JSX.Element | null {\n if (!this.props.enabled) {\n return null;\n }\n const localizedStrings = {\n insertModule:\n this.getLocalizedStringsfromTools('insertModule') !== ''\n ? this.getLocalizedStringsfromTools('insertModule')\n : 'Insert module',\n insertFragment:\n this.getLocalizedStringsfromTools('insertFragment') !== ''\n ? this.getLocalizedStringsfromTools('insertFragment')\n : 'Insert fragment',\n moveNotAllowed:\n this.getLocalizedStringsfromTools('moveNotAllowed') !== ''\n ? this.getLocalizedStringsfromTools('moveNotAllowed')\n : 'Move not allowed'\n };\n\n const button = (tooltip: string) => {\n return (\n \n \n \n \n );\n };\n if (this.props.mode === AddControlMode.Sibling) {\n return (\n \n
\n
{button(`Add a module to ${this.props.slotName || this.props.slotId}`)}
\n
\n
\n
\n
{button(`Configure ${this.props.slotName || this.props.slotId}`)}
\n
\n
\n
{localizedStrings.insertModule} \n
{localizedStrings.insertFragment} \n
{localizedStrings.moveNotAllowed} \n
\n
\n
& {\n typeName: string;\n requestCache: RequestCache;\n renderModuleAttributes: (props: IGeneric) => IDictionary;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n componentRef: React.RefObject>;\n renderView: React.FC;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n mappedProps: any;\n lazyLoadHandler: () => void;\n scriptInitCompleted: boolean;\n};\n\n/**\n *\n */\nexport class AsyncClientRenderComponent extends React.Component {\n constructor(props) {\n super(props);\n }\n\n public loadScriptAsync = async (moduleChunk: string): Promise => {\n return new Promise((resolve, reject) => {\n const script = document.createElement('script');\n document.body.appendChild(script);\n script.type = 'text/javascript';\n script.onload = () => {\n resolve();\n };\n script.onerror = e => {\n console.error(`failed to load module chunk :: ${moduleChunk}`, e);\n };\n script.src = `${moduleChunk}`;\n script.async = false;\n script.defer = false;\n });\n };\n\n public waitAndInitializeModule = async (retryCount: number): Promise => {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const bindings = (window as any).__bindings__;\n const registeredModules = bindings.modules;\n\n // lets make sure the script execution is complete before attemtping to render the module\n if (!registeredModules[this.props.mappedProps.typeName] && retryCount < 5) {\n setTimeout(() => this.waitAndInitializeModule(++retryCount), 500);\n return;\n }\n\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const pageContext = (window as any).__msdyn365__.pageContext;\n let allModules: IModule[] = [];\n if (pageContext?.requestContext?.features?.loadData_optimization) {\n allModules = await optimizedGetAllModules(pageContext, pageContext.requestContext);\n } else {\n allModules = await pageContext.allModules(pageContext.requestContext, []);\n }\n const currentModuleArray = allModules.filter(m => m.typeName === this.props.mappedProps.typeName);\n const currentModule = currentModuleArray && currentModuleArray.length > 0 ? currentModuleArray[0] : undefined;\n\n if (!currentModule) {\n return;\n }\n\n // reassign the data actions from window bindings to reflect new data actions from client module\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n (msdyn365Commerce as any).bindings.dataActions = bindings.dataActions;\n await loadData(\n [currentModule],\n this.props.mappedProps.context.request,\n this.props.mappedProps.internalTelemetry,\n this.props.mappedProps.internalTelemetry,\n this.props.requestCache,\n null,\n []\n );\n this.props.lazyLoadHandler();\n };\n\n public componentDidMount = async (): Promise => {\n if (msdyn365Commerce.isBrowser) {\n if (this.props.scriptInitCompleted) {\n return this.waitAndInitializeModule(0);\n }\n\n const clientModuleChunks = this.props.requestCache.get({\n typeName: CLIENT_ENTRY_POINTS_TYPE,\n key: this.props.typeName\n })\n ? this.props.requestCache.get({ typeName: CLIENT_ENTRY_POINTS_TYPE, key: this.props.typeName })?.item\n : [];\n\n if (!clientModuleChunks || clientModuleChunks.length === 0) {\n return this.waitAndInitializeModule(0);\n } else {\n const chunksToBeAdded: string[] = [];\n clientModuleChunks?.map(chunk => {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const scriptElements = document.getElementsByTagName('script') as any;\n let chunkExistsOnPage = false;\n\n for (const scriptEl of scriptElements) {\n if (scriptEl.src.includes(chunk)) {\n chunkExistsOnPage = true;\n }\n }\n\n if (!chunkExistsOnPage) {\n chunksToBeAdded.push(chunk);\n }\n });\n\n if (chunksToBeAdded.length === 0) {\n // if chunk exists on page, we can render the module with wait time for script execution to avoid race condition(in case if the script exeuction is incomplete)\n return this.waitAndInitializeModule(0);\n }\n\n // add the chunks to the page and render module after script load event\n await Promise.all(\n (chunksToBeAdded || []).map(async moduleChunk => {\n return this.loadScriptAsync(moduleChunk);\n })\n );\n\n return this.waitAndInitializeModule(0);\n }\n }\n };\n\n public render = (): React.ReactNode | null => {\n if (!this.props.scriptInitCompleted) {\n return
;\n }\n\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const registrationBindings = (window as any).__bindings__;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const registeredModules = (msdyn365Commerce as any).bindings.modules;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const platformSettings = (msdyn365Commerce as any).platformSettings;\n const isModuleEntryPointsEnabled = platformSettings && platformSettings.enableModuleEntryPoints;\n if (!registrationBindings.modules[this.props.typeName]) {\n return
;\n }\n\n Object.keys(registrationBindings.modules || []).map(moduleTypeName => {\n if (!registeredModules[moduleTypeName]) {\n const rawModuleRegistrationObj: IModuleBinderPartial = registrationBindings.modules[moduleTypeName];\n const newModuleRegistrationObj: IModuleBinder = {} as IModuleBinder;\n newModuleRegistrationObj.component = isModuleEntryPointsEnabled\n ? function load() {\n return rawModuleRegistrationObj.c();\n } // eslint-disable-next-line @typescript-eslint/no-explicit-any\n : (rawModuleRegistrationObj.c() as any).default;\n newModuleRegistrationObj.moduleDirectory = rawModuleRegistrationObj.md;\n newModuleRegistrationObj.dataActions = rawModuleRegistrationObj.da;\n newModuleRegistrationObj.packageName = rawModuleRegistrationObj.p;\n newModuleRegistrationObj.name = rawModuleRegistrationObj.n;\n newModuleRegistrationObj.definitionPath = path.join(\n rawModuleRegistrationObj.md,\n `${rawModuleRegistrationObj.n}.definition.json`\n );\n newModuleRegistrationObj.parentDefinitionPath = rawModuleRegistrationObj.pdp;\n newModuleRegistrationObj.isNodeModule = rawModuleRegistrationObj.iNM;\n newModuleRegistrationObj.moduleNamespace = rawModuleRegistrationObj.ns;\n newModuleRegistrationObj.chunkName = `${rawModuleRegistrationObj.ns}-${rawModuleRegistrationObj.p}-${rawModuleRegistrationObj.n}`;\n registeredModules[moduleTypeName] = newModuleRegistrationObj;\n }\n });\n\n const moduleBinder = registeredModules[this.props.typeName];\n const Component = isModuleEntryPointsEnabled ? moduleBinder?.component()?.default : moduleBinder.component;\n\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const registeredViews = (msdyn365Commerce as any).bindings.views;\n Object.keys(registrationBindings.viewDictionary || []).map(viewRegistrationKey => {\n if (!registeredViews[viewRegistrationKey]) {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const rawViewRegistrationObj: any = registrationBindings.viewDictionary[viewRegistrationKey];\n const newViewComponent = isModuleEntryPointsEnabled\n ? function load() {\n return rawViewRegistrationObj.c();\n } // eslint-disable-next-line @typescript-eslint/no-explicit-any\n : rawViewRegistrationObj.c().default;\n registeredViews[viewRegistrationKey] = {};\n registeredViews[viewRegistrationKey].component = newViewComponent;\n }\n });\n\n return (\n ;\n addModuleProps: IAddModuleProps;\n};\n/**\n * Add module wrapper component: Wraps the safe render component and add module control component inside a div tag to properly render modules with its respective add sibling box on site builder.\n */\nexport class AddModuleWrapper extends React.Component {\n public constructor(props: IAddModuleWrapperProps) {\n super(props);\n }\n public render(): JSX.Element {\n const { safeRenderProps, addModuleProps, ...props } = this.props;\n return (\n \n );\n }\n}\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\n/* eslint-disable @typescript-eslint/no-explicit-any */\nimport { ICache, ICacheKey } from '@msdyn365-commerce/cache-internal';\nimport { getPerformanceUtils, ICoreContext, IModule, msdyn365Commerce } from '@msdyn365-commerce/core-internal';\nimport { asSystemMetadata, EXCEPTION_NOMODULEBINDER, LogLevel } from '@msdyn365-commerce/telemetry-internal';\nimport React from 'react';\n\nimport { IMSDyn365CommerceExtension } from '../app-initialization/models';\nimport { PAGE_INSIGHTS_VIEWS_KEY } from '../consts';\nimport { getModuleBinder, getModuleName, getPageInsightsCacheKey, isPageInsightsEnabled } from '../utils/helpers';\n\nexport interface IModuleWithView extends IModule {\n View: React.FunctionComponent;\n}\n\nconst getViewBinder = (moduleName: string, viewLookupKey: string, requestCache: ICache, pageInsightsEnabled: boolean) => {\n const view = ((msdyn365Commerce as unknown) as IMSDyn365CommerceExtension).viewBinder(viewLookupKey);\n if (view) {\n if (pageInsightsEnabled) {\n const viewCacheKey = getPageInsightsCacheKey(PAGE_INSIGHTS_VIEWS_KEY);\n const viewInsights = requestCache.get<{}>(viewCacheKey)?.item || {};\n viewInsights[`${moduleName}`] = `${viewLookupKey.replace(/\\|/g, '/')}.view.tsx`;\n requestCache.put(viewCacheKey, { item: viewInsights });\n }\n\n return { key: viewLookupKey, view };\n }\n return undefined;\n};\n\n/**\n * View will be read in following hierarchy\n * 1) __local__|__local__|themes|theme1|views|product-tile OR @msdyn-365-commerce-modules|theme1|modules|theme1|views|product-tile\n * 2) __local__|__local__|modules|product-tile|product-tile OR @msdyn-365-commerce-modules|product-tile|modules|product-tile|product-tile\n */\nconst viewLookupFunc = (moduleBinder, themeBinder, requestCache: ICache, pageInsightsEnabled: boolean) =>\n themeBinder &&\n (getViewBinder(\n moduleBinder.name,\n `__local__|__local__|themes|${themeBinder.name}|views|${moduleBinder.name}`,\n requestCache,\n pageInsightsEnabled\n ) ||\n getViewBinder(\n moduleBinder.name,\n `${themeBinder.moduleNamespace}|${themeBinder.packageName}|modules|${themeBinder.name}|views|${moduleBinder.name}`,\n requestCache,\n pageInsightsEnabled\n ));\n\n/**\n * View will be read from the module\n * __local__|__local__|modules|product-tile|product-tile OR @msdyn-365-commerce-modules|product-tile|modules|product-tile|product-tile\n */\nconst defaultViewLookupFunc = (moduleBinder, requestCache: ICache, pageInsightsEnabled: boolean) => {\n const parentModuleBinder = getModuleBinder(getModuleName(moduleBinder.parentDefinitionPath));\n\n return (\n getViewBinder(\n moduleBinder.name,\n `${moduleBinder.moduleNamespace}|${moduleBinder.packageName}|modules|${moduleBinder.name}|${moduleBinder.name}`,\n requestCache,\n pageInsightsEnabled\n ) ||\n (parentModuleBinder &&\n getViewBinder(\n moduleBinder.name,\n `${parentModuleBinder.moduleNamespace}|${parentModuleBinder.packageName}|modules|${parentModuleBinder.name}|${parentModuleBinder.name}`,\n requestCache,\n pageInsightsEnabled\n ))\n );\n};\n\nconst getView = (moduleBinder, themeBinder, context: ICoreContext) => {\n if (!moduleBinder) {\n return { view: null };\n }\n\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const cache: ICache = (msdyn365Commerce as any).getAppCache(context.actionContext.requestContext);\n const viewCacheKey: ICacheKey = {\n key: `${moduleBinder.name}|${themeBinder ? themeBinder.name : 'no-theme'}`,\n typeName: '__ViewCacheKey__'\n };\n const viewLookupKey = cache.getValue(viewCacheKey);\n const pageInsightsEnabled = isPageInsightsEnabled(context.request.params);\n\n const actionContextData: any = context.actionContext;\n const requestCache: ICache = actionContextData.requestCache;\n if (viewLookupKey) {\n !msdyn365Commerce.isBrowser && actionContextData.requestCache.put(viewCacheKey, { item: viewLookupKey });\n return getViewBinder(moduleBinder.name, viewLookupKey, requestCache, pageInsightsEnabled) || { view: null };\n }\n\n let viewLookup = viewLookupFunc(moduleBinder, themeBinder, requestCache, pageInsightsEnabled);\n\n // If no component found in the theme, search in parent theme (in case of inherited theme)\n if (!viewLookup && themeBinder) {\n const parentThemeName = getModuleName(themeBinder.parentDefinitionPath);\n const parentThemeBinder = getModuleBinder(parentThemeName);\n viewLookup = viewLookupFunc(moduleBinder, parentThemeBinder, requestCache, pageInsightsEnabled);\n }\n\n // If no view file found, fall back to module's default view\n if (!viewLookup) {\n viewLookup = defaultViewLookupFunc(moduleBinder, requestCache, pageInsightsEnabled);\n }\n\n if (viewLookup) {\n cache.put(viewCacheKey, { item: viewLookup.key });\n actionContextData.requestCache.put(viewCacheKey, { item: viewLookup.key });\n return viewLookup;\n }\n\n return { view: null };\n};\n\nconst renderViewForModule: React.FC = (props: T): React.ReactElement | null => {\n props.telemetry.log(LogLevel.Debug, `rendering view-'${props.typeName}' with id-'${props.id}'`);\n const moduleBinder = getModuleBinder(props.typeName);\n if (!moduleBinder) {\n props.context.telemetry.log(LogLevel.Error, EXCEPTION_NOMODULEBINDER, { values: [asSystemMetadata(props.typeName)] });\n return null;\n }\n\n const themeBinder = getModuleBinder(props.context.actionContext.requestContext.params.theme);\n const { view } = getView(moduleBinder, themeBinder, props.context);\n\n if (!view) {\n return props.context.actionContext.requestContext.params.isDebug ? (\n \n View not found - location searched at \n {`views/${moduleBinder.name}.view.tsx`}
\n \n {themeBinder\n ? `views/${themeBinder.name}/${moduleBinder.name}.view.tsx`\n : `No theme [${props.context.actionContext.requestContext.params.theme}] found at local/src`}\n
\n \n {themeBinder\n ? `${\n themeBinder.moduleNamespace !== '__local__'\n ? `${themeBinder.moduleNamespace}/${themeBinder.packageName}/`\n : ''\n }modules/${themeBinder.name}/views/${moduleBinder.name}.view.tsx`\n : `No theme [${props.context.actionContext.requestContext.params.theme}] found at node_modules`}\n
\n {`${\n moduleBinder.moduleNamespace !== '__local__' ? `${moduleBinder.moduleNamespace}/${moduleBinder.packageName}/` : ''\n }modules/${moduleBinder.name}/${moduleBinder.name}.view.tsx`}
\n \n ) : null;\n }\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const platformSettings = (msdyn365Commerce as any).platformSettings;\n const Component = platformSettings && platformSettings.enableModuleEntryPoints ? view?.component()?.default : view.component;\n // @ts-ignore\n if (props.addChunk) {\n // @ts-ignore\n props.addChunk(view.cn);\n }\n return = (props: T): React.ReactElement | null => {\n const performanceUtils = getPerformanceUtils(msdyn365Commerce, props.context.actionContext);\n\n const renderId = performanceUtils?.performanceUtilsPackage.Random.Guid.generateGuid();\n\n performanceUtils?.performanceUtilsPackage.runPreRenderViewPerformanceHook({\n moduleId: props.id,\n moduleTypeName: props.typeName,\n\n renderId: renderId,\n\n internalCache: performanceUtils.cache\n });\n\n const node = renderViewForModule(props);\n\n performanceUtils?.performanceUtilsPackage.runPostRenderViewPerformanceHook({\n moduleId: props.id,\n moduleTypeName: props.typeName,\n\n renderId: renderId,\n\n internalCache: performanceUtils.cache\n });\n\n return node;\n};\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport { IDictionary, IModule } from '@msdyn365-commerce/core-internal';\nimport { EXCEPTION_ERROR_CLIENT_BOUNDARY, InternalTelemetry, LogLevel } from '@msdyn365-commerce/telemetry-internal';\nimport { get as _get } from 'lodash';\nimport React, { useMemo } from 'react';\nimport { MODULE_CONFIG_ERRORS_KEY } from '../consts';\nimport { renderView } from './render-view';\nimport { TSafeRenderModuleProps, TSafeRenderModuleState } from './safe-render-module';\n\ntype ErrorType = 'empty' | 'unregistered' | 'error';\n\ninterface IErrorModuleProps extends IModule {\n id: string;\n errorType: ErrorType;\n error: Error;\n message?: string;\n}\n\nconst getStandardErrorModuleMarkup = (props: IErrorModuleProps) => {\n return (\n \n
{props.id}' threw exception
\n
\n
\n
\n
\n
\n
\n
= (props: IErrorModuleProps) => {\n const params = _get(props, 'context.request.params', {});\n const { isDebug } = params;\n return isDebug || process.env.NODE_ENV === 'development' ? useMemo(() => getStandardErrorModuleMarkup(props), [props]) : null;\n};\n\n/* eslint-disable @typescript-eslint/no-explicit-any */\nexport const renderErrorOrPlaceHolderModules = (\n err: Error,\n internalTelemetry: InternalTelemetry,\n mappedProps: any,\n state: TSafeRenderModuleState,\n props: TSafeRenderModuleProps,\n isEditor: boolean,\n renderModuleAttributes: (props: { [x: string]: any }) => IDictionary\n): JSX.Element | undefined => {\n if (!isEditor) {\n internalTelemetry.log(LogLevel.Error, EXCEPTION_ERROR_CLIENT_BOUNDARY, { exception: err });\n return (\n
;\n }\n return undefined;\n};\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\n/* eslint-disable @typescript-eslint/no-explicit-any */\nimport { ICacheKey } from '@msdyn365-commerce/cache-internal';\nimport {\n CoreContext,\n getPerformanceUtils,\n IAddModuleSlot,\n IAny,\n IDictionary,\n IGeneric,\n IModule,\n IModuleContract,\n isAuthoringEditEnabled,\n msdyn365Commerce,\n SDK_FRAGMENT_NAME,\n WithContext\n} from '@msdyn365-commerce/core-internal';\nimport LazyLoad from 'react-lazy-load';\nimport {\n asSystemMetadata,\n EXCEPTION_MISSINGMODULECONFIG,\n EXCEPTION_MODULERENDERFAIL,\n EXCEPTION_NOMODULEBINDER,\n EXCEPTION_UNREGISTEREDMODULEID,\n InternalTelemetry,\n ITelemetry,\n LogLevel\n} from '@msdyn365-commerce/telemetry-internal';\nimport { get as _get } from 'lodash';\nimport { observer } from 'mobx-react';\nimport * as React from 'react';\nimport ReactDOM from 'react-dom';\nimport { AsyncClientRenderComponent } from './module-client-render-component';\nimport {\n LAYOUT_MOUNT_POINT,\n MODULE_CONFIG_ERRORS_KEY,\n MODULE_LAYOUT_FIELD,\n SERVER_RENDER_ERROR_CACHE_KEY,\n MODULE_CONFIG_KEY\n} from '../consts';\nimport { PageContext } from '../store/page-context';\nimport { AddControlMode, AddModuleControl } from './add-module-control';\nimport { AddModuleWrapper } from './add-module-wrapper';\nimport { ErrorModule, renderErrorOrPlaceHolderModules } from './error-module';\nimport { renderView } from './render-view';\nimport { isLazyRenderModuleEnabled } from '../utils/helpers';\n\ntype ErrorInfo = {\n componentStack: string;\n};\n\nexport type TSafeRenderModuleState = {\n error?: Error;\n info?: ErrorInfo;\n isRegistered?: boolean;\n isConfigured?: boolean;\n isLazyLoaded?: boolean;\n mounted?: boolean;\n};\n\n/**\n * Known types on the props\n */\nexport type TSafeRenderModuleProps = IGeneric & {\n telemetry: ITelemetry;\n internalTelemetry: InternalTelemetry;\n};\n\n/**\n * Component to render module\n */\n@observer\nexport class SafeRenderModule extends React.Component {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n private componentRef: React.RefObject>;\n private shouldDisplayErrors: boolean = false;\n private isRenderAttrributeCalled: boolean = false;\n private disableSSRErrorChecks?: boolean = false;\n private renderCallsCounter = 0;\n private mobxShouldComponentUpdate;\n\n public static getDerivedStateFromError(error: Error): TSafeRenderModuleState {\n return { error: error };\n }\n\n constructor(props: TSafeRenderModuleProps) {\n super(props);\n\n this.state = {\n error: undefined,\n info: undefined,\n isConfigured: true,\n isRegistered: true,\n mounted: false\n };\n this.componentRef = React.createRef();\n this.shouldDisplayErrors = props && props.context ? props.context.request.params.isDebug : true;\n\n // If App Setting to disable server-side rendering error checks is true then instead of rendering each module\n // separately and potentially containing each one in an error-boundary in case of an error,\n // safe-render-module will instead render all modules together in one pass for improved performance.\n this.disableSSRErrorChecks = props.context && props.app && props.app.platform && props.app.platform.disableServerSideErrorChecking;\n\n // In the event that this is being rendered in editor or debug mode we will override this setting to render each individual module separately\n // to catch module errors at the cost of performance\n this.disableSSRErrorChecks =\n this.disableSSRErrorChecks && !props.context.request.params.isDebug && !props.context.request.params.isEditor;\n\n this.props.internalTelemetry.log(\n LogLevel.Debug,\n `Safe Render module constructor type-'{typeName}' with id-'{id} and is ${\n this.disableSSRErrorChecks ? 'not ' : ''\n }running in error check mode.'`,\n {\n values: [asSystemMetadata(this.props.typeName), asSystemMetadata(this.props.id)]\n }\n );\n\n this.mobxShouldComponentUpdate = this.shouldComponentUpdate;\n this.shouldComponentUpdate = this.customShouldComponentUpdate;\n }\n\n public componentDidMount(): void {\n if (!this.state.mounted) {\n this.setState({ mounted: true });\n }\n\n if (this.isRenderAttrributeCalled) {\n return;\n }\n\n this._setErrorStates();\n this._setDataAttributes();\n\n this._initializePerformanceComponent();\n }\n\n public customShouldComponentUpdate(nextProps: TSafeRenderModuleProps, nextState: TSafeRenderModuleState): boolean {\n if (this._isEditorial()) {\n if (nextState.error) {\n this.props.store.requestCache.put(\n { typeName: MODULE_CONFIG_ERRORS_KEY, key: this.props.id },\n { item: [{ property: this.props.id, message: nextState.error.message }] }\n );\n }\n }\n\n return this.mobxShouldComponentUpdate(nextProps, nextState);\n }\n\n public componentDidUpdate(): void {\n if (this.isRenderAttrributeCalled) {\n return;\n }\n\n this._setErrorStates();\n this._setDataAttributes();\n }\n\n public componentDidCatch(error: Error, info: ErrorInfo): void {\n this.setState({ error, info });\n }\n\n public render(): JSX.Element | null {\n const performanceUtils = getPerformanceUtils(msdyn365Commerce, this.props.context.actionContext);\n\n const renderId = performanceUtils?.performanceUtilsPackage.Random.Guid.generateGuid();\n\n performanceUtils?.performanceUtilsPackage.runPreRenderPerformanceHook({\n moduleId: this.props.id,\n moduleTypeName: this.props.typeName,\n\n renderId: renderId,\n renderCallIndex: ++this.renderCallsCounter,\n\n internalCache: performanceUtils.cache\n });\n\n const node = this._renderModule();\n\n performanceUtils?.performanceUtilsPackage.runPostRenderPerformanceHook({\n moduleId: this.props.id,\n moduleTypeName: this.props.typeName,\n\n renderId: renderId,\n\n internalCache: performanceUtils.cache\n });\n\n return node;\n }\n\n private _initializePerformanceComponent(): void {\n const performanceUtils = getPerformanceUtils(msdyn365Commerce, this.props.context.actionContext);\n performanceUtils?.performanceUtilsPackage.initializePerformance(\n () => performanceUtils.cache,\n () => this.props.context.actionContext\n );\n }\n\n // eslint-disable-next-line complexity\n private _renderModule(): JSX.Element | null {\n const config = this.props.config;\n const { internalTelemetry } = this.props;\n internalTelemetry.log(LogLevel.Debug, `Safe Render module render type-'{typeName}' with id-'{id}'`, {\n values: [asSystemMetadata(this.props.typeName), asSystemMetadata(this.props.id)]\n });\n const isMounted = this.state.mounted;\n const mappedProps = mapStateToProps(this.props.store, this.props, isMounted);\n const { id, typeName } = mappedProps && mappedProps.id ? mappedProps : this.props;\n const configErrors = mappedProps.configErrors;\n\n // in development mode, check if there is any server render error for module. If so, render error module so developer can address the issue.\n if (process.env.NODE_ENV === 'development' && !this.props.store.requestContext.features.disable_render_module_server_error) {\n const serverRenderError =\n this.props.store.requestCache?.internalCache && this.props.store.requestCache.internalCache[SERVER_RENDER_ERROR_CACHE_KEY];\n\n if (serverRenderError) {\n const moduleWithError = serverRenderError[this.getModuleServerRenderCacheKeyName(this.props.id, this.props.typeName)];\n if (moduleWithError && moduleWithError.item) {\n return (\n
;\n }\n\n return \n );\n }\n return (\n \n \n \n );\n } else if (this.state.mounted) {\n return (\n ): IDictionary => {\n this.isRenderAttrributeCalled = true;\n\n if (!props || !props.id) {\n return {};\n }\n\n // Construct telemetry attributes for module\n const telemetryId: string = props.friendlyName || props.id;\n const telemetryAttributes: IDictionary =\n this.props.internalTelemetry && this.props.internalTelemetry.setTelemetryAttribute\n ? this.props.internalTelemetry.setTelemetryAttribute(telemetryId)\n : {};\n\n const moduleAttributes: IDictionary = { 'data-m-t': props.typeName, ...telemetryAttributes };\n if (this.shouldDisplayErrors || this._isEditorial()) {\n moduleAttributes['data-i'] = this._setDataInfoAttribute(props);\n }\n\n if (props.platform && typeof props.platform === 'object') {\n Object.keys(props.platform).forEach(key => {\n moduleAttributes[`data-m-${key}`] = props.platform[key];\n });\n }\n\n // If a module is associated with an experiment, add this attribtue to track when to activate the experiment\n if (props.context.request && props.context.request.experiments?.moduleIdToExperimentIdMap) {\n if (props.context.request.experiments.moduleIdToExperimentIdMap[props.id]) {\n moduleAttributes[`data-exp`] = `id:${props.context.request.experiments.moduleIdToExperimentIdMap[props.id]}`;\n }\n }\n // In editor scenario, Authoring will update the module layout by sending us updates on\n // the MODULE_LAYOUT_FIELD in the config object\n\n if (this._isEditorial() && props.config && props.config[MODULE_LAYOUT_FIELD]) {\n moduleAttributes[`data-m-layout`] = props.config[MODULE_LAYOUT_FIELD];\n }\n\n return moduleAttributes;\n };\n\n /**\n * Set the data info attribute to be added to the modules\n * @param props The module props.\n */\n private _setDataInfoAttribute(props: IGeneric): string {\n const dataInfo = [`id:${props.id}`];\n props.slotId && dataInfo.push(`s:${props.slotId}`);\n props.parentId && dataInfo.push(`p:${props.parentId}`);\n props.typeName && dataInfo.push(`t:${props.typeName}`);\n props.friendlyName && dataInfo.push(`fn:${props.friendlyName}`);\n const moduleBinder = (msdyn365Commerce as any).moduleBinder(props.typeName);\n if (moduleBinder) {\n moduleBinder.$type && dataInfo.push(`mt:${moduleBinder.$type}`);\n }\n props.errorType && dataInfo.push(`e:${props.errorType}`);\n return `{${dataInfo.join(',')}}`;\n }\n\n /**\n * isEditor\n * Determines if request is coming from the editor\n */\n private _isEditorial(): boolean {\n return _get(this.props, ['context', 'request', 'params', 'isEditor'], false);\n }\n\n /**\n * Creates data info string to be used by cms e.g '{id:prop-id,s:content,p:parent-id}'\n */\n private _generateDataInfo(): string {\n const dataInfo = [`id:${this.props.id}`];\n this.props.slotId && dataInfo.push(`s:${this.props.slotId}`);\n this.props.parentId && dataInfo.push(`p:${this.props.parentId}`);\n this.props.typeName && dataInfo.push(`t:${this.props.typeName}`);\n this.props.friendlyName && dataInfo.push(`fn:${this.props.friendlyName}`);\n const moduleBinder = (msdyn365Commerce as any).moduleBinder(this.props.typeName);\n if (moduleBinder) {\n moduleBinder.$type && dataInfo.push(`mt:${moduleBinder.$type}`);\n }\n\n // Error scenarios\n // 1. Empty module\n // 2. Unregistered module\n // 3. Generic error\n !this.state.isConfigured && dataInfo.push('e:empty');\n !this.state.isRegistered && dataInfo.push('e:unregistered');\n this.state.error && dataInfo.push('e:error');\n\n return `{${dataInfo.join(',')}}`;\n }\n\n /**\n * Conducts the server side render and returns the result.\n * If disable SSR Error Checking flag is turned on, the React Element is returned immediately,\n * otherwise the render result is calculated using renderToString to catch errors\n * and defer modules (used for editor and debug scenarios)\n */\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n private _doServerSideRender(\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n mappedProps: any,\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n Component: React.ComponentClass<{}, any>,\n internalTelemetry: InternalTelemetry\n ): JSX.Element {\n let renderHtmlString: string;\n const renderHtml = (\n \n \n );\n if (this.disableSSRErrorChecks) {\n // In non editorial or non debug mode and if app setting to disable server side error checking is turned on\n // return the JSX directly without computing the render result to save time and compute cost\n return renderHtml;\n } else {\n try {\n // eslint-disable-next-line\n renderHtmlString = require('react-dom/server').renderToString(renderHtml);\n if (!renderHtmlString.length) {\n // module returned null\n this.props.store.markModuleAsDeferred(this.props.id);\n }\n } catch (e) {\n this.addFailingModuleServerRenderToCache(e);\n\n internalTelemetry.log(LogLevel.Error, `Safe Render module Failed to render type-'{typeName}' with id-'{id}'`, {\n exception: e,\n values: [asSystemMetadata(this.props.typeName), asSystemMetadata(this.props.id)]\n });\n return (\n ,\n moduleConfigs: IModuleContract[],\n slotId: string,\n addSiblingIndices?: number[],\n isMounted?: boolean\n): React.ReactNode[] => {\n if (!moduleConfigs) {\n return [];\n }\n\n const canAddAtIndex = (index: number) => {\n return addSiblingIndices ? addSiblingIndices.indexOf(index + 1) >= 0 : false;\n };\n // if addSiblingIndices is not undefined, we add the AddModuleControl components between each module; but in hidden state if index value isnt provider\n // this prevents re-rendering of the module when the AddModuleControl components are enabled/disabled\n // in preview mode, addSiblingIndices will be undefined and we will only render the modules\n return moduleConfigs.map((moduleConfig: IModuleContract, index: number) => {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const config =\n (!!!parentProps?.store?.requestContext?.features?.disable_moduleConfig_optimize &&\n requestCache.getValue({ typeName: MODULE_CONFIG_KEY, key: moduleConfig.id })) ||\n moduleConfig.config;\n return addSiblingIndices && isMounted ? (\n > => {\n try {\n const { internalTelemetry } = props;\n const moduleConfig = getModuleConfig(store, props.id);\n const requestCache = store.requestCache;\n if (!moduleConfig) {\n internalTelemetry.log(\n LogLevel.Error,\n internalTelemetry.stringFormat(EXCEPTION_MISSINGMODULECONFIG, [props.id, props.typeName])\n );\n return {} as IModule>;\n }\n\n // TODO - following statements introducing side effect in render method (props should not change in render). Please take a look after public preview\n // Pull value out of stuff that came from cache (doing this gives us reactivity via MobX)\n Object.keys(moduleConfig.data).forEach(key => {\n if (moduleConfig.data[key] && moduleConfig.data[key].Item) {\n moduleConfig.data[key] = moduleConfig.data[key].Item;\n }\n });\n\n const moduleBinder = (msdyn365Commerce as any).moduleBinder(moduleConfig.typeName);\n if (!moduleBinder && !isLazyRenderModuleEnabled(store.requestContext)) {\n internalTelemetry.log(LogLevel.Error, EXCEPTION_NOMODULEBINDER, { values: [asSystemMetadata(moduleConfig.typeName)] });\n return {} as IModule>;\n }\n const enableAddModuleControls = isAuthoringEditEnabled(store.requestContext);\n const platformSettings = (msdyn365Commerce as any).platformSettings;\n const componentBinder =\n platformSettings && platformSettings.enableModuleEntryPoints\n ? moduleBinder && moduleBinder?.component()?.default\n : moduleBinder && moduleBinder.component;\n\n return {\n ...props,\n ...moduleConfig,\n component: componentBinder,\n slots: enableAddModuleControls\n ? getSlotDictionary(requestCache, props, moduleConfig.slotsForAddModule, isMounted)\n : getSlotDictionary(requestCache, props)\n };\n } catch (e) {\n props.internalTelemetry.log(LogLevel.Error, props.internalTelemetry.stringFormat(EXCEPTION_MODULERENDERFAIL, [props.id]), {\n exception: e\n });\n return {} as IModule>;\n }\n};\n\nconst getModuleConfig = (store: PageContext, moduleId: string): IModule => {\n return store.modules(moduleId);\n};\n\nconst getSlotDictionary = (\n requestCache: any,\n props: IGeneric,\n slotsForAddModule?: IAddModuleSlot[],\n isMounted?: boolean\n): IDictionary => {\n const slotDictionary: IDictionary = {};\n const { modules } = props;\n const slotsWithAddModuleControls = (slotsForAddModule || []).filter(a => !a.index && a.slotName);\n const addSiblingIndexDictionary: { [key: string]: number[] } = {};\n (slotsForAddModule || [])\n .filter(a => a.index && !a.slotName)\n .forEach(a => {\n addSiblingIndexDictionary[a.slotId] = a.index || [];\n });\n // removes placeholder 'click here to configure' modules\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const getNonPlaceholderModules = (mods: any[]) => {\n return mods.filter(a => a.typeName !== 'place-holder-for-container-preview');\n };\n if (modules) {\n Object.keys(modules).forEach((key: string) => {\n slotDictionary[key] = getRenderSlotComponent(\n requestCache,\n props,\n getNonPlaceholderModules(modules[key]),\n key,\n slotsForAddModule ? addSiblingIndexDictionary[key] || [] : undefined,\n isMounted\n );\n });\n }\n slotsWithAddModuleControls.forEach((slot: IAddModuleSlot) => {\n if (isMounted && (!modules || !modules[slot.slotId] || getNonPlaceholderModules(modules[slot.slotId]).length === 0)) {\n slotDictionary[slot.slotId] = [\n ;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n component: any;\n dataActions: IDataAction[];\n definitionExtensions?: string[];\n definitionPath: string;\n isNodeModule: boolean;\n moduleNamespace: string;\n chunkName: string;\n name: string;\n packageName: string;\n pages?: IDictionary;\n parentDefinitionPath: string;\n path: string;\n segments: string[];\n moduleDirectory: string;\n themeSettings: string;\n}\n\nexport interface IModuleBinderPartial {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n c: () => Promise;\n mn: string;\n md: string;\n da: IDataAction[];\n p: string;\n n: string;\n pdp: string;\n iNM: boolean;\n ns: string;\n}\n\nexport interface IPrototype {\n prototype: IMSDyn365CommerceExtension;\n}\n\ninterface IDAPIBindings {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n modules: IDictionary;\n themes: IThemeModule[];\n}\n\nexport interface IBinding {\n modules: IDictionary;\n dataActions: IDictionary;\n partnerDataActions: IDictionary;\n views: IDictionary;\n components: IDictionary;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n connectors: IDictionary;\n dapi: IDAPIBindings;\n\n // eslint-disable-next-line @typescript-eslint/no-explicit-any -- NPM package source.\n perfAnalysisLibBinding: any;\n}\n\nexport interface IMSDyn365CommerceExtension {\n bindings: IBinding;\n appCache: IDictionary;\n resourceManager: IResourceManager;\n getResourceManager(): IResourceManager;\n getPartnerOverrideAction(id: string): Function;\n dataAction(name: string): Function;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n getConnector(name: string): any;\n getAppCache(requestContext: IRequestContext): ICache;\n moduleBinder(name: string): IModuleBinder;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n viewBinder(name: string): any;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n componentBinder(name: string): any;\n getAllModuleBinder(): IModuleBinder[];\n updatePrivateVariable(): void;\n\n // eslint-disable-next-line @typescript-eslint/no-explicit-any -- Returns NPM package source.\n perfAnalysisBinder(): any;\n}\n\nexport type IMSDyn365CommerceWithPrototype = typeof MSDyn365Commerce & IPrototype;\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\n/* eslint-disable @typescript-eslint/no-explicit-any */\nimport { ActionContext, addLocaleInformation, IRefreshConfigs } from '@msdyn365-commerce/action-internal';\nimport { ICache, ICacheKey } from '@msdyn365-commerce/cache-internal';\nimport {\n IAction,\n IActionInput,\n IDataActionOptions,\n IDictionary,\n IModuleContract,\n IRequestContext,\n msdyn365Commerce\n} from '@msdyn365-commerce/core-internal';\nimport {\n asSystemMetadata,\n EXCEPTION_DATAACTION_EXECUTION,\n EXCEPTION_LOADDATA_ACTION_0,\n EXCEPTION_LOADDATA_ACTION_1,\n EXCEPTION_LOADDATA_ACTION_2,\n InternalTelemetry,\n ITelemetry,\n LogLevel,\n MESSAGE_CREATE_INPUT_LOADDATA\n} from '@msdyn365-commerce/telemetry-internal';\nimport { ActionRuntime, IDataAction } from '../app-initialization/models';\nimport { LAZYLOAD_SWITCH_PREFIX, PAGE_INSIGHTS_ACTIONS_KEY } from '../consts';\nimport { combineExtendedDataActionToModule } from '../utils/data-action-extension-helper';\nimport { getPageInsightsCacheKey, isPageInsightsEnabled, timeSliceLongJSTask } from '../utils/helpers';\n\nexport interface IDataActionMetadata {\n dataActionFunction: IAction;\n inputs: IActionInput[];\n name: string;\n runOn: ActionRuntime;\n id: string;\n options?: IDataActionOptions;\n}\n\n/**\n * Method which stores temporary async results in the cache for actions which\n * will be run at a later time\n * @param tempMetadataList The list of actions which need temporary AsyncResults\n * @param requestCache The request cache\n */\nconst storeTemporaryAsyncResults = (tempMetadataList: IDataActionMetadata[], requestCache: ICache): void => {\n const tempResultCacheItem = { item: { _type: 'AsyncResult', status: 'LOADING', runOn: 'client' } };\n\n // Insert fake temporary AsyncResults for actions that will be deferred to client\n tempMetadataList.forEach(tempMetadata => {\n // Non-observable and instance actions should not get a temp promise\n const firstInput = Array.isArray(tempMetadata.inputs) ? tempMetadata.inputs[0] : tempMetadata.inputs;\n if (\n !tempMetadata.dataActionFunction.prototype.isObservable ||\n !tempMetadata.inputs ||\n (firstInput && firstInput.dataCacheType && firstInput.dataCacheType() === 'instance')\n ) {\n return;\n }\n\n if (!Array.isArray(tempMetadata.inputs)) {\n tempMetadata.inputs = [tempMetadata.inputs];\n }\n\n tempMetadata.inputs.forEach(tempInput => {\n // Don't add temp promise if there is a mock or if the resolved data has already been inserted into the cache\n if (\n requestCache.get({ key: `${tempInput.getCacheObjectType()}:${tempInput.getCacheKey()}`, typeName: '__MOCK' }) ===\n undefined &&\n requestCache.get({ key: `${tempInput.getCacheKey()}`, typeName: tempInput.getCacheObjectType() }) === undefined\n ) {\n requestCache.put({ key: tempInput.getCacheKey(), typeName: tempInput.getCacheObjectType() }, tempResultCacheItem);\n }\n });\n });\n};\n\n/**\n * Runs all the data actions specificed in module definitions present on the page\n */\nexport const loadData = async (\n modules: IModuleContract[],\n context: IRequestContext,\n internalTelemetry: InternalTelemetry,\n moduleTelemetry: ITelemetry,\n requestCache: ICache,\n appCache: ICache | null,\n complexDataTypesPromises?: Promise[]\n): Promise => {\n if (!modules || modules.length === 0) {\n return [];\n }\n\n const dataActionMetadataList: IDataActionMetadata[] = [];\n const lazyLoadModuleIds: { [index: string]: boolean } = {};\n const tempMetadataList: IDataActionMetadata[] = [];\n\n // Note: What modules will need to be lazyloaded due to feature switches\n storeLazyloadModuleId(context, lazyLoadModuleIds);\n loadDataProcessing(modules, lazyLoadModuleIds, context, internalTelemetry, dataActionMetadataList, tempMetadataList, requestCache);\n storeTemporaryAsyncResults(tempMetadataList, requestCache);\n\n await timeSliceLongJSTask(context);\n\n if (dataActionMetadataList.length === 0) {\n // When there is no data actions, we still need to resolve complexTypePromises\n if (complexDataTypesPromises) {\n await Promise.all(complexDataTypesPromises);\n }\n return [];\n }\n\n const actionContext = new ActionContext({\n id: 'T1',\n requestContext: context,\n requestCache: requestCache,\n expectedActionCount: dataActionMetadataList.length,\n telemetry: moduleTelemetry,\n appCache\n });\n\n const promises = processDataActionMetadataList(actionContext, dataActionMetadataList, internalTelemetry);\n\n if (complexDataTypesPromises) {\n promises.push(...complexDataTypesPromises);\n }\n\n await Promise.all(promises);\n\n return actionContext.getRefreshActions();\n};\n\nconst fetchDataActionWithActionid = (lookupId: string) => {\n const dataActionFunction = (msdyn365Commerce).dataAction(lookupId);\n if (\n dataActionFunction &&\n dataActionFunction.default &&\n dataActionFunction.default.prototype &&\n dataActionFunction.default.prototype.inputFunc &&\n typeof dataActionFunction.default.prototype.inputFunc === 'function'\n ) {\n return dataActionFunction;\n }\n return null;\n};\n\nconst loadDataProcessing = (\n modules: IModuleContract[],\n lazyLoadModuleIds: IDictionary,\n context: IRequestContext,\n internalTelemetry: InternalTelemetry,\n dataActionMetadataList: IDataActionMetadata[],\n tempMetadataList: IDataActionMetadata[],\n requestCache: ICache\n) => {\n modules.forEach((moduleContract: IModuleContract) => {\n const moduleConfig = moduleContract.config;\n if (typeof moduleConfig === 'object' && moduleConfig && moduleConfig['clientRender'] === true) {\n lazyLoadModuleIds[moduleContract.id] = true;\n }\n\n const moduleBinderInitial = (msdyn365Commerce).moduleBinder(moduleContract.typeName);\n\n const moduleBinder = context.params.theme\n ? combineExtendedDataActionToModule(moduleBinderInitial, moduleContract.typeName, context.params.theme)\n : moduleBinderInitial;\n\n if (moduleBinder && moduleBinder.dataActions && moduleBinder.dataActions.length > 0) {\n moduleBinder.dataActions.forEach((dataAction: IDataAction) => {\n const lookupId = dataAction.id || dataAction.path;\n if (dataAction.name && lookupId) {\n let dataActionFunction = (msdyn365Commerce).dataAction(lookupId);\n if (\n dataActionFunction &&\n dataActionFunction.default &&\n dataActionFunction.default.prototype &&\n dataActionFunction.default.prototype.id\n ) {\n const newLookUpId = dataActionFunction.default.prototype.id;\n // if the dataAction function's id is different with lookup id, try to fetch the dataAction based on its id again.\n if (newLookUpId !== lookupId) {\n dataActionFunction = fetchDataActionWithActionid(newLookUpId) || dataActionFunction;\n }\n }\n if (\n dataActionFunction &&\n dataActionFunction.default &&\n dataActionFunction.default.prototype &&\n dataActionFunction.default.prototype.inputFunc &&\n typeof dataActionFunction.default.prototype.inputFunc === 'function'\n ) {\n try {\n processModuleDataAction(\n dataActionFunction,\n context,\n moduleContract,\n dataAction,\n dataActionMetadataList,\n internalTelemetry,\n lazyLoadModuleIds,\n tempMetadataList,\n requestCache\n );\n } catch (e) {\n internalTelemetry.log(LogLevel.Error, EXCEPTION_LOADDATA_ACTION_0, {\n exception: new Error(EXCEPTION_LOADDATA_ACTION_1),\n values: [asSystemMetadata(dataAction.name || 'unnamed'), asSystemMetadata(moduleContract.id || 'unnamed')]\n });\n }\n } else {\n internalTelemetry.log(LogLevel.Error, EXCEPTION_LOADDATA_ACTION_2, {\n exception: new Error(EXCEPTION_LOADDATA_ACTION_1),\n values: [asSystemMetadata(dataAction.path || 'unnamed'), asSystemMetadata(moduleContract.id || 'unnamed')]\n });\n }\n }\n });\n internalTelemetry.log(\n LogLevel.Debug,\n internalTelemetry.stringFormat(MESSAGE_CREATE_INPUT_LOADDATA, [\n (moduleContract.dataActions || []).map(d => d.name).join(' | '),\n moduleContract.typeName,\n moduleContract.id\n ])\n );\n }\n });\n};\n\nconst processModuleDataAction = (\n dataActionFunction,\n context: IRequestContext,\n moduleContract: IModuleContract,\n dataAction: IDataAction,\n dataActionMetadataList: IDataActionMetadata[],\n internalTelemetry: InternalTelemetry,\n lazyLoadModuleIds: IDictionary,\n tempMetadataList: IDataActionMetadata[],\n requestCache: ICache\n) => {\n let inputs;\n try {\n inputs = dataActionFunction.default.prototype.inputFunc({\n requestContext: context,\n config: moduleContract.config,\n data: moduleContract.data\n });\n const isArray = Array.isArray(inputs);\n moduleContract.dataActions = moduleContract.dataActions || [];\n addLocaleInformation(inputs, context.locale);\n moduleContract.dataActions.push({\n name: dataAction.name,\n entity: isArray ? inputs[0].getCacheObjectType() : inputs.getCacheObjectType(),\n inputs: isArray ? inputs.map((input: IActionInput) => input.getCacheKey()) : inputs.getCacheKey()\n });\n } catch (e) {\n internalTelemetry.log(LogLevel.Debug, 'Unable to create input for Module: {id}, Action: {name}', {\n values: [asSystemMetadata(moduleContract.id), asSystemMetadata(dataAction.name)]\n });\n moduleContract.dataActions = moduleContract.dataActions || [];\n moduleContract.dataActions.push({\n name: dataAction.name,\n entity: undefined,\n inputs: undefined\n });\n }\n\n const dataActionInsightsKey = getPageInsightsCacheKey(PAGE_INSIGHTS_ACTIONS_KEY);\n const pageInsightsEnabled = isPageInsightsEnabled(context.params);\n const dataActionsInsights = requestCache.get<{ Server: {}; Client: {} }>(dataActionInsightsKey)?.item || { Server: {}, Client: {} };\n if (inputs && dataAction) {\n // Add run on information to data action input\n inputs.runOn = convertRunOnToString(dataAction.runOn);\n }\n if (\n msdyn365Commerce.isBrowser ||\n (!context.features.lazyload_all &&\n (dataAction.runOn === ActionRuntime.server || dataAction.runOn === ActionRuntime.serverOnly) &&\n !lazyLoadModuleIds[moduleContract.id] &&\n !lazyLoadModuleIds[moduleContract.typeName])\n ) {\n if (pageInsightsEnabled) {\n dataActionsInsights.Server[moduleContract.typeName] = dataActionsInsights.Server[moduleContract.typeName] || {};\n dataActionsInsights.Server[moduleContract.typeName][dataAction.name] =\n dataActionsInsights.Server[moduleContract.typeName][dataAction.name] || {};\n dataActionsInsights.Server[moduleContract.typeName][dataAction.name] = dataAction.id || dataAction.path;\n requestCache.put(dataActionInsightsKey, { item: dataActionsInsights });\n }\n\n dataActionMetadataList.push({\n name: dataAction.name,\n runOn: dataAction.runOn,\n id: dataAction.id,\n inputs: inputs,\n dataActionFunction: dataActionFunction.default,\n ...(dataAction.options && { options: dataAction.options })\n });\n } else {\n if (pageInsightsEnabled) {\n dataActionsInsights.Client[moduleContract.typeName] = dataActionsInsights.Client[moduleContract.typeName] || {};\n dataActionsInsights.Client[moduleContract.typeName][dataAction.name] =\n dataActionsInsights.Client[moduleContract.typeName][dataAction.name] || {};\n dataActionsInsights.Client[moduleContract.typeName][dataAction.name] = dataAction.id || dataAction.path;\n requestCache.put(dataActionInsightsKey, { item: dataActionsInsights });\n }\n\n // If the data action is supposed to be run server only it should never\n // be placed in the temporary list that will eventually run client side.\n if (dataAction.runOn !== ActionRuntime.serverOnly) {\n tempMetadataList.push({\n name: dataAction.name,\n runOn: dataAction.runOn,\n id: dataAction.id,\n inputs: inputs,\n dataActionFunction: dataActionFunction.default\n });\n }\n }\n};\n\n//\nconst storeLazyloadModuleId = (renderingContext: IRequestContext, lazyLoadModuleIds: IDictionary) => {\n if (renderingContext.features) {\n Object.keys(renderingContext.features).forEach(switchName => {\n if (switchName.startsWith(LAZYLOAD_SWITCH_PREFIX) && renderingContext.features[switchName]) {\n lazyLoadModuleIds[switchName.replace(LAZYLOAD_SWITCH_PREFIX, '')] = true;\n }\n });\n }\n};\n\nexport const processDataActionMetadataList = (\n actionContext: ActionContext,\n dataActionMetadataList: IDataActionMetadata[],\n internalTelemetry: InternalTelemetry\n) => {\n return dataActionMetadataList\n .map(async (dataActionMetadata: IDataActionMetadata) => {\n // all client side actions are lazy loaded inorder not to interfere with the client hydrate.\n // therefore only return those promises that are non-observable and instance actions\n if (process.env.CURRENT_ENVIRONMENT === 'web') {\n await timeSliceLongJSTask(actionContext?.requestContext);\n const promise = actionContext\n .chainAction(dataActionMetadata.dataActionFunction, dataActionMetadata.inputs, dataActionMetadata.options)\n .catch(e => {\n internalTelemetry.log(LogLevel.Error, EXCEPTION_DATAACTION_EXECUTION, {\n values: [asSystemMetadata(dataActionMetadata.id || dataActionMetadata.name)],\n exception: (e && e.error) || e\n });\n });\n\n // We still need to await non-observable client-side data actions (public-preview)\n if (!dataActionMetadata.dataActionFunction.prototype.isObservable) {\n return promise;\n }\n\n // we should await on observable 'instance' actions that are configured to runOn 'server'\n if (\n actionContext.requestContext.features &&\n !actionContext.requestContext.features.disable_inst_action_await &&\n isServerInstanceAction(dataActionMetadata)\n ) {\n return promise;\n }\n } else {\n return actionContext\n .chainAction(dataActionMetadata.dataActionFunction, dataActionMetadata.inputs, dataActionMetadata.options)\n .catch(e => {\n internalTelemetry.log(LogLevel.Error, EXCEPTION_DATAACTION_EXECUTION, {\n values: [asSystemMetadata(dataActionMetadata.id || dataActionMetadata.name)],\n exception: (e && e.error) || e\n });\n });\n }\n })\n .filter(Boolean);\n};\n\nconst isServerInstanceAction = (dataActionMetadata: IDataActionMetadata) => {\n const firstInput = Array.isArray(dataActionMetadata.inputs) ? dataActionMetadata.inputs[0] : dataActionMetadata.inputs;\n return (\n dataActionMetadata.runOn === ActionRuntime.server &&\n dataActionMetadata.dataActionFunction.prototype.isObservable &&\n firstInput &&\n firstInput.dataCacheType &&\n firstInput.dataCacheType() === 'instance'\n );\n};\n\nexport const convertRunOnToString = (runtime: ActionRuntime) => {\n switch (runtime) {\n case ActionRuntime.client:\n return 'client';\n case ActionRuntime.server:\n return 'server';\n case ActionRuntime.serverOnly:\n return 'serverOnly';\n default:\n return 'server';\n }\n};\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport { IModuleBinder } from '../app-initialization/models';\nimport { getModuleBinder } from '../utils/helpers';\n\nconst dataActionCustimizedMerge = (originDataAction, newDataAction, customizer) =>\n originDataAction\n .filter(originAction => !newDataAction.find(newAction => originAction[customizer] === newAction[customizer]))\n .concat(newDataAction);\n\nexport const combineExtendedDataActionToModule = (originalModuleBinder: IModuleBinder, moduleName: string, themeName: string) => {\n const themeBinder = getModuleBinder(themeName);\n if (!themeBinder || !originalModuleBinder) {\n return originalModuleBinder;\n }\n\n if (themeBinder.dataActions.length === 0) {\n return originalModuleBinder;\n }\n const themeDataActionsForModule = themeBinder.dataActions.filter(\n dataAction => dataAction.moduleName && dataAction.moduleName === moduleName\n );\n\n const moduleDataActions = originalModuleBinder.dataActions ? originalModuleBinder.dataActions : [];\n originalModuleBinder.dataActions = dataActionCustimizedMerge(moduleDataActions, themeDataActionsForModule, 'name');\n return originalModuleBinder;\n};\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport { ICommerceApiSettings } from '@msdyn365-commerce/core-internal';\n\n/**\n * Generates a cache key from the given ApiSettings object\n */\nexport const getCacheKey = (apiSettings: ICommerceApiSettings, catalogId?: number) => {\n if (!apiSettings) {\n return '';\n }\n\n return `${apiSettings.channelId}-${apiSettings.oun}-${catalogId || 0} `;\n};\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport { CacheType, getCatalogIdForSdk, IActionContext, IActionInput, ICommerceApiSettings } from '@msdyn365-commerce/core-internal';\nimport { getCacheKey } from '../utils/link-utils';\n\n/**\n * Links coming from OneRF will have the following structure\n */\nexport interface IServerLink {\n type: string;\n productId?: number;\n categoryId?: number;\n destinationUrl?: string;\n error?: string;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n [x: string]: any;\n}\n\n/**\n * Used by the URL builder to construct the formatted\n * category or product link\n */\nexport interface IPageTypeContext {\n category?: {\n Slug: string;\n RecordId: number;\n };\n product?: {\n Name: string;\n RecordId: number;\n };\n // eslint-disable-next-line @typescript-eslint/no-explicit-any -- needed because type pageTypeContext in url builder allows additional properties\n [x: string]: any;\n}\n\n/**\n * Input Class for ProductLink related actions\n */\nexport class ProductLinkInput implements IActionInput {\n public categoryId: number;\n public productId: number | undefined;\n public channelId: number;\n public catalogId?: number;\n private apiSettings: ICommerceApiSettings;\n private locale: string;\n\n constructor(apiSettings: ICommerceApiSettings, categoryId: number, productId?: number, catalogId?: number | null, locale?: string) {\n this.categoryId = categoryId;\n this.productId = productId;\n this.channelId = apiSettings.channelId;\n this.apiSettings = apiSettings;\n this.catalogId = catalogId || 0;\n this.locale = locale || '';\n }\n\n public getCacheKey = () => `${getCacheKey(this.apiSettings, this.catalogId)}-${this.categoryId}-${this.productId}-${this.locale}`;\n public getCacheObjectType = () => 'ProductLink';\n public dataCacheType = (): CacheType => 'application';\n}\n\n/**\n * Input Class for CategoryLink related actions\n */\nexport class CategoryLinkInput implements IActionInput {\n public categoryId: number;\n public channelId: number;\n public catalogId?: number;\n private apiSettings: ICommerceApiSettings;\n private locale: string;\n\n constructor(apiSettings: ICommerceApiSettings, categoryId: number, catalogId?: number | null, locale?: string) {\n this.categoryId = categoryId;\n this.channelId = apiSettings.channelId;\n this.apiSettings = apiSettings;\n this.catalogId = catalogId || 0;\n this.locale = locale || '';\n }\n\n public getCacheKey = () => `${getCacheKey(this.apiSettings, this.catalogId)}-${this.categoryId}-${this.locale}`;\n public getCacheObjectType = () => 'CategoryLink';\n public dataCacheType = (): CacheType => 'application';\n}\n\n/**\n * ProductList metadata passed from CMS used to hydrate product list\n */\nexport interface IProductListMetaData {\n listType: string;\n productIds?: number[];\n categoryIds?: number[];\n searchText?: string;\n includePageContext?: boolean;\n includeDescendentCategoryChildren?: boolean;\n includeCart?: boolean;\n personalization?: boolean;\n recommendationListId?: string;\n relationshipId?: string;\n pageSize?: number;\n}\n\n// Enum Representing all supported ProductList types\nexport enum ProductListType {\n algo,\n editorial,\n productByCategory,\n productBySearch,\n recommendation,\n relatedProducts,\n recentlyViewedProducts\n}\n\n/**\n * Input Class for ProductList related actions\n */\nexport class ProductListInput implements IActionInput {\n public listMetadata: IProductListMetaData;\n public channelId: number;\n public catalogId: number;\n private _cacheType: CacheType;\n private _cacheObjectType: string;\n private _cacheKey: string;\n\n constructor(listMetadata: IProductListMetaData, actionContext: IActionContext) {\n const requestContext = actionContext.requestContext;\n const catalogIdNumber = getCatalogIdForSdk(requestContext, 0);\n\n this.listMetadata = listMetadata;\n this.catalogId = catalogIdNumber ?? 0;\n this.channelId = requestContext.apiSettings.channelId;\n this._cacheObjectType = `ProductList-${listMetadata.listType}`;\n\n const query = requestContext.query || {};\n const skipToken = query.skip;\n const context = JSON.stringify(requestContext.urlTokens);\n const locale = actionContext.requestContext.locale || 'unknown';\n const baseCacheKey = `${this.channelId}-${this.catalogId}-${locale}-${JSON.stringify(listMetadata)}-${skipToken || ''}`;\n\n switch (ProductListType[listMetadata.listType]) {\n case ProductListType.productBySearch:\n // application cache if not reading from context\n this._cacheType = listMetadata.searchText ? 'application' : 'request';\n this._cacheKey = listMetadata.searchText ? baseCacheKey : `${baseCacheKey}-${query.q || ''}`;\n break;\n case ProductListType.productByCategory:\n this._cacheType = 'application';\n this._cacheKey = listMetadata.categoryIds && listMetadata.categoryIds.length ? baseCacheKey : `${baseCacheKey}-${context}`;\n break;\n case ProductListType.relatedProducts:\n this._cacheType = 'application';\n this._cacheKey = listMetadata.productIds && listMetadata.productIds.length ? baseCacheKey : `${baseCacheKey}-${context}`;\n break;\n case ProductListType.editorial:\n case ProductListType.algo:\n case ProductListType.recommendation:\n default:\n this._cacheType = listMetadata.includeCart || listMetadata.personalization ? 'request' : 'application';\n this._cacheKey = `${baseCacheKey}-${context}`;\n }\n }\n\n public getCacheKey = () => this._cacheKey;\n public getCacheObjectType = () => this._cacheObjectType;\n public dataCacheType = (): CacheType => this._cacheType;\n}\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport { ICommerceApiSettings } from '@msdyn365-commerce/core-internal';\nimport { ProductSearchResult, SimpleProduct } from '@msdyn365-commerce/retail-proxy';\n\n/**\n * Generates a Image URL based on data return from retail server\n * @param imageUrl The image url returned by Retail Server\n * @param ctx The request context\n */\nexport const generateImageUrl = (imageUrl: string | undefined, apiSettings: ICommerceApiSettings): string | undefined => {\n if (imageUrl) {\n // Images hosted in CMS include schema\n if (imageUrl.startsWith('http')) {\n return imageUrl;\n }\n\n // Images hosted in Retail Server must be encoded and joined with the base image url\n return apiSettings.baseImageUrl + encodeURIComponent(imageUrl);\n } else {\n // d365Commerce.telemetry.warning(`Unable to generate a proper Image URL for Product: ${product.RecordId}`);\n return undefined;\n }\n};\n\n/**\n * Generates a Image URL for a product based on data return from retail server\n * @param product The Product returned by Retail Server\n * @param ctx The request context\n */\nexport const getProductImageUrls = (\n products: SimpleProduct[] | ProductSearchResult[],\n apiSettings: ICommerceApiSettings\n): SimpleProduct[] | ProductSearchResult[] => {\n const productsWithImageUrls: SimpleProduct[] | ProductSearchResult[] = [];\n\n products &&\n products.forEach(product => {\n if (product && product.RecordId) {\n product.PrimaryImageUrl = generateImageUrl(product.PrimaryImageUrl, apiSettings);\n productsWithImageUrls.push(product);\n }\n });\n\n return productsWithImageUrls;\n};\n\n/**\n * Uses the order in which the product ids were returned from the reco call to order\n * the results from the product hydration call\n *\n * @param itemIdOrder The order of product ids to observe\n * @param unorderedProductSearchResults Unordered set of hydrated products\n */\nexport const orderProductSearchResults = (\n itemIdOrder: number[],\n unorderedProductSearchResults: ProductSearchResult[]\n): ProductSearchResult[] => {\n return itemIdOrder.reduce((result: ProductSearchResult[], itemId: number) => {\n const product = unorderedProductSearchResults.find(element => element.RecordId === itemId);\n if (product) {\n result.push(product);\n }\n return result;\n }, []);\n};\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\n/**\n * Get inventory sorting value based on channelInventoryConfiguration\n *\n * @param context The current action context\n * @param channelInventoryConfiguration The channelInventoryConfiguration\n */\nexport const getInventorySorting = channelInventoryConfiguration => {\n let sorting;\n if (channelInventoryConfiguration && channelInventoryConfiguration.ProductAvailabilitySortableAttributeRecordId) {\n const sortColumnName = `Attr_${channelInventoryConfiguration.ProductAvailabilitySortableAttributeRecordId}`;\n sorting = {\n Columns: [\n {\n ColumnName: sortColumnName,\n IsDescending: true\n }\n ]\n };\n }\n return sorting;\n};\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport { IProductRefinerHierarchy } from '@msdyn365-commerce/commerce-entities';\nimport { CacheType, createObservableDataAction, IAction, IActionContext, IActionInput, versionGte } from '@msdyn365-commerce/core';\nimport { IQueryResultSettings, ProductRefiner, ProductSearchCriteria } from '@msdyn365-commerce/retail-proxy';\n\n/**\n * This setting defines inventory filtering options.\n */\nexport enum ProductListInventoryFilteringOptions {\n /**\n * Filter out all products out of stock.\n */\n HideOOS = 'hideOOS',\n\n /**\n * Sort products by availability, OOS goes last.\n */\n SortOOS = 'sortOOS',\n\n /**\n * No filtering selected.\n */\n Default = 'default'\n}\n\n/**\n * Input class for get inventory in stock refiner value action.\n */\nexport class InventoryInStockRefinerValueInput implements IActionInput {\n public actionContext: IActionContext;\n public channelId: number;\n public channelInventoryConfiguration;\n public catalogId?: number;\n\n public constructor(actionContext: IActionContext, channelId: number, channelInventoryConfiguration, catalogId: number = 0) {\n this.catalogId = catalogId;\n this.channelId = channelId;\n this.actionContext = actionContext;\n this.channelInventoryConfiguration = channelInventoryConfiguration;\n }\n\n public getCacheKey = (): string =>\n `${this.channelId}-${this.catalogId}-${this.channelInventoryConfiguration?.InventoryProductAttributeRecordId}`;\n public getCacheObjectType = (): string => 'RefinerList';\n public dataCacheType = (): CacheType => 'application';\n}\n\n/**\n * Uses Bulk refiner API to get refiners and child refiner values.\n * @param searchCriteria Product search criteria.\n * @param maxItems Max items.\n * @param queryResultSettings\n * @param ctx Action context.\n */\nasync function getProductRefinerHierarchy(\n searchCriteria: ProductSearchCriteria,\n queryResultSettings: IQueryResultSettings,\n ctx: IActionContext\n): Promise {\n const rsVersion =\n !process.env.MSDyn365Commerce_RSVERSION || process.env.MSDyn365Commerce_RSVERSION === '--'\n ? '0.0'\n : process.env.MSDyn365Commerce_RSVERSION;\n const isHideAndSortByInventoryAvailabilitySupported = versionGte(rsVersion, '9.37');\n if (isHideAndSortByInventoryAvailabilitySupported) {\n // eslint-disable-next-line @typescript-eslint/no-require-imports, @typescript-eslint/no-var-requires\n const productsDataActions = require('@msdyn365-commerce/retail-proxy/dist/DataActions/ProductsDataActions.g');\n return productsDataActions\n .getProductSearchRefinersAsync({ callerContext: ctx, queryResultSettings }, searchCriteria)\n .then((productRefiners: ProductRefiner[]) => {\n if (!productRefiners) {\n ctx.trace('[getRefinersByCriteriaAction] returned no refiners');\n return [];\n }\n\n const result = productRefiners as IProductRefinerHierarchy[];\n\n if (result.length === 0) {\n ctx.trace('[getRefinersByCriteriaAction] returned no IProductRefinerHierarchy objects');\n return [];\n }\n\n return result;\n });\n } else {\n return Promise.resolve([]);\n }\n}\n\n/**\n * Action method returns inventory in stock refiners.\n * @param input - InventoryInStockRefinerValueInput.\n * @param context - IActionContext.\n * @returns - Promise.\n */\nexport async function getInventoryInStockRefiner(\n input: InventoryInStockRefinerValueInput,\n context: IActionContext\n): Promise {\n const queryResultSettings = {\n count: true\n };\n\n const refiners = await getProductRefinerHierarchy(\n {\n Context: {\n ChannelId: input.channelId,\n CatalogId: input.catalogId\n }\n },\n queryResultSettings,\n context\n );\n\n // InventoryProductAttributeRecordId may be 0, and recId of default refiner Category/Price/Rating is always 0 by design. In this case, we should not return refiner\n // Why recId of default refiner Category/Price/Rating is 0: see GetChannelProductRefiners.sql\n const inventoryRefiner =\n input.channelInventoryConfiguration?.InventoryProductAttributeRecordId !== 0 &&\n refiners.find(refiner => refiner.RecordId === input.channelInventoryConfiguration?.InventoryProductAttributeRecordId);\n let inStockRefiner;\n if (inventoryRefiner) {\n inStockRefiner = inventoryRefiner.Values.find(\n value =>\n value.LeftValueBoundString !== input.channelInventoryConfiguration.InventoryOutOfStockAttributeValueText &&\n value.RightValueBoundString !== input.channelInventoryConfiguration.InventoryOutOfStockAttributeValueText\n );\n }\n\n return inStockRefiner;\n}\n\n/**\n * Action.\n * @param id - Id.\n * @param action - Action.\n * @returns - Results.\n */\nexport const getInventoryInStockRefinerAction = createObservableDataAction({\n id: '@msdyn365-commerce/get-inventory-in-stock-refiner',\n action: getInventoryInStockRefiner as IAction\n});\n\nexport default getInventoryInStockRefinerAction;\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport { createObservableDataAction } from '@msdyn365-commerce/action-internal';\nimport { IAction, IActionContext, versionGte } from '@msdyn365-commerce/core-internal';\nimport { searchByCriteriaAsync } from '@msdyn365-commerce/retail-proxy/dist/DataActions/ProductsDataActions.g';\nimport {\n ProductSearchCriteria,\n ProductSearchResult,\n QueryResultSettings\n} from '@msdyn365-commerce/retail-proxy/dist/Entities/CommerceTypes.g';\nimport { CATEGORY_PAGE_NAME } from '../../consts';\nimport { getProductImageUrls } from '../../utils/product-list-utils';\nimport { ProductListInput } from '../hydrator-action-inputs';\nimport { getInventorySorting } from '../utils/inventory-util';\nimport {\n getInventoryInStockRefinerAction,\n InventoryInStockRefinerValueInput,\n ProductListInventoryFilteringOptions\n} from '../utils/data-actions/get-inventory-in-stock-refiner.action';\n\nexport const getProductsByCategoryList = async (input: ProductListInput, context: IActionContext): Promise => {\n let categoryId: number;\n const urlTokens = context.requestContext.urlTokens;\n\n // If the category ID has been provided from the list metadata use it, otherwise grab the category ID from context\n if (input.listMetadata.categoryIds && input.listMetadata.categoryIds.length > 0) {\n categoryId = input.listMetadata.categoryIds[0];\n } else if (urlTokens && urlTokens.pageType && urlTokens.pageType.toLowerCase() === CATEGORY_PAGE_NAME && urlTokens.recordId) {\n categoryId = +urlTokens.recordId;\n } else if (urlTokens && urlTokens.categories && urlTokens.categories.length > 0) {\n categoryId = +urlTokens.categories[0];\n } else {\n // Unable to determine category from list meta data or context\n throw new Error('CategoryId Missing for ProductsByCategory List');\n }\n context.telemetry.debug(`Category Id input to ProductsByCategory action : ${categoryId}`);\n const productSearchCriteria: ProductSearchCriteria = {\n Context: {\n ChannelId: +input.channelId,\n CatalogId: +input.catalogId\n },\n CategoryIds: [categoryId],\n SkipVariantExpansion: true,\n IncludeAttributes: true\n };\n\n const queryResultSettings: QueryResultSettings = {\n Paging: {\n Top: input.listMetadata.pageSize || 10\n }\n };\n\n const rsVersion =\n !process.env.MSDyn365Commerce_RSVERSION || process.env.MSDyn365Commerce_RSVERSION === '--'\n ? '0.0'\n : process.env.MSDyn365Commerce_RSVERSION;\n const isHideAndSortByInventoryAvailabilitySupported = versionGte(rsVersion, '9.37');\n if (isHideAndSortByInventoryAvailabilitySupported) {\n let channelInventoryConfiguration = {};\n if (\n context.requestContext.app.config?.productListInventoryDisplay === ProductListInventoryFilteringOptions.HideOOS ||\n context.requestContext.app.config?.productListInventoryDisplay === ProductListInventoryFilteringOptions.SortOOS\n ) {\n // eslint-disable-next-line @typescript-eslint/no-require-imports, @typescript-eslint/no-var-requires\n const StoreOperationsDataActions = require('@msdyn365-commerce/retail-proxy/dist/DataActions/StoreOperationsDataActions.g');\n channelInventoryConfiguration = await StoreOperationsDataActions.getInventoryConfigurationAsync({ callerContext: context });\n }\n\n if (context.requestContext.app.config?.productListInventoryDisplay === ProductListInventoryFilteringOptions.HideOOS) {\n const inventoryInStockRefinerValueInput = new InventoryInStockRefinerValueInput(\n context,\n +input.channelId,\n channelInventoryConfiguration,\n +input.catalogId\n );\n\n const inventoryInStockRefinerValue = await getInventoryInStockRefinerAction(inventoryInStockRefinerValueInput, context);\n if (inventoryInStockRefinerValue) {\n productSearchCriteria.Refinement = [inventoryInStockRefinerValue];\n }\n }\n\n if (context.requestContext.app.config?.productListInventoryDisplay === ProductListInventoryFilteringOptions.SortOOS) {\n const sorting = getInventorySorting(channelInventoryConfiguration);\n if (sorting) {\n queryResultSettings.Sorting = sorting;\n }\n }\n }\n\n return searchByCriteriaAsync(\n {\n callerContext: context,\n queryResultSettings\n },\n productSearchCriteria\n )\n .then((products: ProductSearchResult[]) => {\n context.telemetry.debug('Products returned by ProductByCategory action', products);\n return getProductImageUrls(products, context.requestContext.apiSettings);\n })\n .catch(error => {\n context.telemetry.error(`Error running ProductByCategory action: ${error}`);\n throw new Error(error);\n });\n};\n\nexport const getProductsByCategoryListAction = createObservableDataAction({\n action: >getProductsByCategoryList,\n id: '@msdyn365-commerce/products-by-category'\n});\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport { createObservableDataAction } from '@msdyn365-commerce/action-internal';\nimport { getCatalogIdForSdk, IAction, IActionContext, versionGte } from '@msdyn365-commerce/core-internal';\nimport { searchByCriteriaAsync } from '@msdyn365-commerce/retail-proxy/dist/DataActions/ProductsDataActions.g';\nimport {\n ProductSearchCriteria,\n ProductSearchResult,\n QueryResultSettings\n} from '@msdyn365-commerce/retail-proxy/dist/Entities/CommerceTypes.g';\nimport { getProductImageUrls } from '../../utils/product-list-utils';\nimport { ProductListInput } from '../hydrator-action-inputs';\nimport { CookieContext } from '../../utils/cookie-utils';\nimport { RecentlyViewedProductItem } from './base';\nimport { getInventorySorting } from '../utils/inventory-util';\nimport {\n getInventoryInStockRefinerAction,\n InventoryInStockRefinerValueInput,\n ProductListInventoryFilteringOptions\n} from '../utils/data-actions/get-inventory-in-stock-refiner.action';\n\nexport const getProductsByRecentlyViewedList = async (input: ProductListInput, ctx: IActionContext): Promise => {\n const searchCriteriaInput: ProductSearchCriteria = {};\n const cookieContext: CookieContext = new CookieContext();\n const catalogId = getCatalogIdForSdk(ctx.requestContext, null);\n searchCriteriaInput.Context = {\n ChannelId: ctx.requestContext.apiSettings.channelId,\n CatalogId: catalogId\n };\n searchCriteriaInput.IncludeAttributes = false;\n searchCriteriaInput.SkipVariantExpansion = true;\n const cookieName: string = '_msdyn365___recently_viewed_products';\n const cookieValue = cookieContext.get(cookieName).value;\n const productIds = cookieValue?.filter(value => value.catalogId === catalogId).map(value => value.productId) || [0];\n searchCriteriaInput.Ids = productIds;\n\n const queryResultSettings: QueryResultSettings = {\n Paging: {\n Top: input.listMetadata.pageSize || 10\n }\n };\n\n const rsVersion =\n !process.env.MSDyn365Commerce_RSVERSION || process.env.MSDyn365Commerce_RSVERSION === '--'\n ? '0.0'\n : process.env.MSDyn365Commerce_RSVERSION;\n const isHideAndSortByInventoryAvailabilitySupported = versionGte(rsVersion, '9.37');\n if (isHideAndSortByInventoryAvailabilitySupported) {\n let channelInventoryConfiguration = {};\n if (\n ctx.requestContext.app.config?.productListInventoryDisplay === ProductListInventoryFilteringOptions.HideOOS ||\n ctx.requestContext.app.config?.productListInventoryDisplay === ProductListInventoryFilteringOptions.SortOOS\n ) {\n // eslint-disable-next-line @typescript-eslint/no-require-imports, @typescript-eslint/no-var-requires\n const StoreOperationsDataActions = require('@msdyn365-commerce/retail-proxy/dist/DataActions/StoreOperationsDataActions.g');\n channelInventoryConfiguration = await StoreOperationsDataActions.getInventoryConfigurationAsync({ callerContext: ctx });\n }\n\n if (ctx.requestContext.app.config?.productListInventoryDisplay === ProductListInventoryFilteringOptions.HideOOS) {\n const inventoryInStockRefinerValueInput = new InventoryInStockRefinerValueInput(\n ctx,\n +input.channelId,\n channelInventoryConfiguration,\n +input.catalogId\n );\n\n const inventoryInStockRefinerValue = await getInventoryInStockRefinerAction(inventoryInStockRefinerValueInput, ctx);\n if (inventoryInStockRefinerValue) {\n searchCriteriaInput.Refinement = [inventoryInStockRefinerValue];\n }\n }\n\n if (ctx.requestContext.app.config?.productListInventoryDisplay === ProductListInventoryFilteringOptions.SortOOS) {\n const sorting = getInventorySorting(channelInventoryConfiguration);\n if (sorting) {\n queryResultSettings.Sorting = sorting;\n }\n }\n }\n\n return searchByCriteriaAsync(\n {\n callerContext: ctx,\n queryResultSettings\n },\n searchCriteriaInput\n )\n .then((products: ProductSearchResult[]) => {\n ctx.telemetry.debug('Products returned by ProductByRecentlyViewed action', products);\n return getProductImageUrls(products, ctx.requestContext.apiSettings);\n })\n .catch(error => {\n ctx.telemetry.error(`Error running ProductByRecentlyViewed action: ${error}`);\n throw new Error(error);\n });\n};\n\nexport const getProductsByRecentlyViewedListAction = createObservableDataAction({\n action: >getProductsByRecentlyViewedList,\n id: '@msdyn365-commerce/products-by-recently-viewed'\n});\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport {\n AsyncResult,\n CacheType,\n createObservableDataAction,\n IAction,\n IActionContext,\n IActionInput,\n ICommerceApiSettings,\n IDictionary\n} from '@msdyn365-commerce/core';\nimport { DataServiceQuery, executeAction, IContext, IDataServiceRequest, IQueryResultSettings } from '@msdyn365-commerce/retail-proxy';\nimport { SimpleProduct } from '@msdyn365-commerce/retail-proxy/dist/Entities/CommerceTypes.g';\n\nimport { getProductImageUrls } from '../utils/product-list-utils';\n\nconst buildCacheKey = (base: string, apiSettings: ICommerceApiSettings, catalogId: Number | null): string => {\n return `${base}-chanId:${apiSettings.channelId}-catId:${catalogId}`;\n};\n\n/**\n * Product Input\n */\nexport class ProductInput implements IActionInput {\n public productId: number;\n public channelId: number;\n public catalogId: number | null;\n private apiSettings: ICommerceApiSettings;\n\n constructor(productId: number | string, apiSettings: ICommerceApiSettings, catalogId: number | null) {\n this.apiSettings = apiSettings;\n this.productId = +productId;\n this.channelId = apiSettings.channelId;\n this.catalogId = catalogId;\n }\n\n public getCacheKey = () => buildCacheKey(`RecordId-${this.productId.toString()}`, this.apiSettings, this.catalogId);\n public getCacheObjectType = () => 'SimpleProduct';\n public dataCacheType = (): CacheType => 'application';\n}\n\nfunction productsQuery(recordId?: number): DataServiceQuery {\n const key = recordId ? { RecordId: recordId } : null;\n return new DataServiceQuery('Products', 'Product', 'ProductClass', key);\n}\n\nfunction createGetByIdsInput(\n queryResultSettings: IQueryResultSettings,\n channelId: number,\n productIds: number[],\n catalogId: number | null\n): IDataServiceRequest {\n const query = productsQuery().resultSettings(queryResultSettings);\n return query.createDataServiceRequestForOperation(\n 'GetByIds',\n true,\n 'SimpleProductClass',\n 'true',\n { bypassCache: 'none', returnEntity: 'SimpleProduct' },\n { channelId: channelId, productIds: productIds, catalogId: catalogId }\n );\n}\n\nfunction getByIdsAsyncAction(\n context: IContext,\n channelId: number,\n productIds: number[],\n catalogId: number | null\n): AsyncResult {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const request = createGetByIdsInput(context.queryResultSettings, channelId, productIds, catalogId);\n return executeAction(request, context);\n}\n\n/**\n * Calls the Retail API and returns the product based on the passed ProductInput\n */\nexport async function getSimpleProductsAction(inputs: ProductInput[], ctx: IActionContext): Promise {\n if (!inputs || !Array.isArray(inputs) || inputs.length === 0) {\n ctx.trace('[getSimpleProductsAction] Invalid or empty inputs passed.');\n return [];\n }\n\n const productIdMapping: IDictionary = {};\n const productIds = inputs.map((input, idx) => {\n productIdMapping[input.productId] = idx;\n return input.productId;\n });\n\n return getByIdsAsyncAction({ callerContext: ctx }, inputs[0].channelId, productIds, inputs[0].catalogId).then(products => {\n if (!products) {\n return [];\n }\n const mappedProducts = (getProductImageUrls(products, ctx.requestContext.apiSettings)).reduce(\n (memo: SimpleProduct[], product: SimpleProduct | undefined) => {\n if (!product) {\n return memo;\n }\n const idx = productIdMapping[product.RecordId];\n memo[idx] = product;\n return memo;\n },\n []\n );\n\n // NOTE: This is not an ideal fix, but will resolve all current issues\n return inputs.map(input => {\n const foundProduct = mappedProducts.find(product => product && product.RecordId === input.productId);\n return foundProduct || {};\n });\n });\n}\n\nexport default createObservableDataAction({\n action: >getSimpleProductsAction,\n id: '@msdyn365-commerce/get-simple-products',\n isBatched: true\n});\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\n/* eslint-disable @typescript-eslint/no-explicit-any */\nimport { createObservableDataAction } from '@msdyn365-commerce/action-internal';\nimport { getCustomerActionDataAction, GetCustomerInput } from '@msdyn365-commerce/core';\nimport { getCatalogIdForSdk, IAction, IActionContext, versionGte } from '@msdyn365-commerce/core-internal';\nimport { IContext } from '@msdyn365-commerce/retail-proxy';\nimport { readAsync } from '@msdyn365-commerce/retail-proxy/dist/DataActions/CartsDataActions.g';\nimport { searchByCriteriaAsync } from '@msdyn365-commerce/retail-proxy/dist/DataActions/ProductsDataActions.g';\nimport { getElementsAsync } from '@msdyn365-commerce/retail-proxy/dist/DataActions/RecommendationsDataActions.g';\nimport {\n Cart,\n Customer,\n ProductSearchCriteria,\n ProductSearchResult,\n QueryResultSettings,\n RecommendationCriteria,\n RecommendedElement\n} from '@msdyn365-commerce/retail-proxy/dist/Entities/CommerceTypes.g';\nimport { CATEGORY_PAGE_NAME, FREQUENTLY_BOUGHT_TOGETHER_LIST, PDP_PAGE_NAME, PICKS_FOR_YOU_LIST } from '../../consts';\nimport { getProductImageUrls, orderProductSearchResults } from '../../utils/product-list-utils';\nimport { ProductInput } from '../get-simple-products';\nimport { ProductListInput } from '../hydrator-action-inputs';\nimport { getInventorySorting } from '../utils/inventory-util';\nimport {\n getInventoryInStockRefinerAction,\n InventoryInStockRefinerValueInput,\n ProductListInventoryFilteringOptions\n} from '../utils/data-actions/get-inventory-in-stock-refiner.action';\n\nconst actionInputError = (missingType: string) => {\n throw new Error(`Input ${missingType} is missing and required to run GetProductsByRecommendationId action`);\n};\n\nconst enum CartTokenPrefix {\n Auth = 't',\n Anon = 'p'\n}\n\n/**\n * Constructs the category context for a recommendation call. If page context is selected the category dervided from page context\n * (current page) will be used. If instead a spefic category is chosen as context that category will be used instead.\n *\n * @param recommendationCriteria The criteria that will be used for the recommendation API call\n * @param input The ProductListInput provided to the action\n * @param context The current action context\n */\nconst getCategoryIdForReco = (recommendationCriteria: RecommendationCriteria, input: ProductListInput, context: IActionContext) => {\n let categoryIds: number[] = [];\n\n if (input.listMetadata.includePageContext || !input.listMetadata.categoryIds || input.listMetadata.categoryIds.length === 0) {\n const urlTokens = context.requestContext.urlTokens;\n\n if (urlTokens && urlTokens.pageType && urlTokens.pageType.toLowerCase() === CATEGORY_PAGE_NAME) {\n if (urlTokens.recordId) {\n categoryIds = [+urlTokens.recordId];\n }\n }\n } else {\n // Use category from a specific context if provided\n if (input.listMetadata.categoryIds && input.listMetadata.categoryIds.length > 0) {\n categoryIds = input.listMetadata.categoryIds;\n }\n }\n\n recommendationCriteria.CategoryIds = categoryIds;\n};\n\n/**\n * Fetches the current active cart to be used when cart context\n * is selected for a reco list\n *\n * @param ctx The current action context\n */\nconst getCart = async (ctx: IActionContext): Promise => {\n let cart;\n if (ctx.requestContext && ctx.requestContext.cookies) {\n const cookies = ctx.requestContext && ctx.requestContext.cookies;\n const cartCookie = cookies.getCartCookie();\n const cartCookieParts = cartCookie.split(':');\n if (cartCookieParts && cartCookieParts.length === 2) {\n if (\n (ctx.requestContext.user.isAuthenticated && cartCookieParts[0] === CartTokenPrefix.Auth) ||\n (!ctx.requestContext.user.isAuthenticated && cartCookieParts[0] === CartTokenPrefix.Anon)\n ) {\n const readCart = await readAsync({ callerContext: ctx }, cartCookieParts[1]);\n if (readCart && readCart.Id) {\n cart = readCart;\n }\n }\n }\n }\n return cart;\n};\n\n/**\n * Constructs the product context for a recommendation call. If cart context is selected, products currently in the active cart will\n * be used as the product ids for the recommendation call. Otherwise, if page context is selected the product derived from page context will be used.\n * Finally, if specific context is selected, a product id will be given to us from the ProductListInput which will be used to seed the product id for the reco call.\n *\n * @param recommendationCriteria The criteria that will be used for the recommendation API call\n * @param input The ProductListInput provided to the action\n * @param context The current action context\n */\nconst getProductIdForReco = async (recommendationCriteria: RecommendationCriteria, input: ProductListInput, context: IActionContext) => {\n let productIds: number[] = [];\n // If include cart is set true, fetch the product ids in the cart to append to the product ID list for the recommendation call\n if (input.listMetadata.includeCart) {\n const cart = await getCart(context);\n if (cart && cart.CartLines) {\n const validCartLines = cart.CartLines.filter(element => element.ProductId !== undefined);\n const cartProductIds = validCartLines.map(product => product.ProductId);\n context.telemetry.debug(`Products in cart: ${cartProductIds}`);\n // If the cart isn't empty, assign the products in the cart to the productIds for seeding\n if (cartProductIds && cartProductIds.length > 0) {\n productIds = cartProductIds;\n }\n }\n } else if (input.listMetadata.includePageContext || !input.listMetadata.productIds || input.listMetadata.productIds.length === 0) {\n const urlTokens = context.requestContext.urlTokens;\n\n if (urlTokens && urlTokens.recordId && urlTokens.pageType && urlTokens.pageType.toLowerCase() === PDP_PAGE_NAME) {\n productIds = [+urlTokens.recordId];\n }\n } else {\n // Use the product from specfic context\n if (input.listMetadata.productIds && input.listMetadata.productIds.length > 0) {\n productIds = [input.listMetadata.productIds[0]];\n }\n }\n\n return productIds;\n};\n\nconst getProductsByNewSearchByCriteria = async (\n input: ProductListInput,\n callerContext: IContext,\n channelInventoryConfiguration\n): Promise => {\n const context = callerContext.callerContext;\n const customer: Customer = await getCustomerActionDataAction(new GetCustomerInput(context.requestContext.apiSettings, ''), context);\n const customerAccountNumber = customer?.AccountNumber || context.requestContext.user.customerAccountNumber;\n const searchCriteria: ProductSearchCriteria = {\n // @ts-ignore\n CustomerAccountNumber: customerAccountNumber,\n RecommendationListId: input.listMetadata.recommendationListId,\n Context: {\n ChannelId: +context.requestContext.apiSettings.channelId,\n CatalogId: +input.catalogId\n },\n SkipVariantExpansion: true,\n IncludeAttributes: true\n };\n const rsVersion =\n !process.env.MSDyn365Commerce_RSVERSION || process.env.MSDyn365Commerce_RSVERSION === '--'\n ? '0.0'\n : process.env.MSDyn365Commerce_RSVERSION;\n\n // after 9.24 version, we dont need to use two retail server call - getElement + searchByCriteria to get all recommendation products.\n // we just need to use searchByCriteria.\n\n const sequentialCallForRecoProducts = versionGte(rsVersion, '9.24');\n if (sequentialCallForRecoProducts && !context.requestContext?.features?.disable_sequential_call_for_recoProducts) {\n try {\n getCategoryIdForReco(searchCriteria, input, context);\n searchCriteria.Ids = await getProductIdForReco(searchCriteria, input, context);\n\n const queryResultSettings: QueryResultSettings = {\n Paging: {\n Top: input.listMetadata.pageSize || 10\n }\n };\n\n const isHideAndSortByInventoryAvailabilitySupported = versionGte(rsVersion, '9.37');\n if (isHideAndSortByInventoryAvailabilitySupported) {\n if (context.requestContext.app.config?.productListInventoryDisplay === ProductListInventoryFilteringOptions.HideOOS) {\n const inventoryInStockRefinerValueInput = new InventoryInStockRefinerValueInput(\n context,\n +input.channelId,\n channelInventoryConfiguration,\n +input.catalogId\n );\n\n const inventoryInStockRefinerValue = await getInventoryInStockRefinerAction(inventoryInStockRefinerValueInput, context);\n if (inventoryInStockRefinerValue) {\n searchCriteria.Refinement = [inventoryInStockRefinerValue];\n }\n }\n\n /**\n * Sort by inventory availability:\n * For other type expect editorial: it's supported since 9.37.\n * For editorial list type: it's supported since 9.44 since it depends on fix from retail server which is fixed on 9.44. But logic here is the same as other types.\n */\n if (context.requestContext.app.config?.productListInventoryDisplay === ProductListInventoryFilteringOptions.SortOOS) {\n const sorting = getInventorySorting(channelInventoryConfiguration);\n if (sorting) {\n queryResultSettings.Sorting = sorting;\n }\n }\n }\n\n let productSearchResults = await searchByCriteriaAsync(\n {\n callerContext: context,\n queryResultSettings\n },\n searchCriteria\n );\n if (productSearchResults.length) {\n let productSearchResultsTmp: ProductSearchResult[] = [];\n productSearchResultsTmp = productSearchResults.filter(item => {\n // @ts-ignore\n const isVariantProduct = !item.IsMasterProduct && item.MasterProductId !== 0;\n return !isVariantProduct;\n });\n productSearchResults = productSearchResultsTmp;\n // If the ProductSearchResult API finds the products then populate the product image urls and return\n // otherwise if the API does not exist or does not return products proceed to the legacy flows for legacy/backward compatibility reasons\n if (productSearchResults.length > 0) {\n getProductImageUrls(productSearchResults, context.requestContext.apiSettings);\n return productSearchResults;\n }\n }\n } catch (e) {\n // In case of an error fall back to legacy flow\n context.telemetry.error(`Error while getting productSearchResult: ${e}`);\n }\n }\n return [];\n};\n\nexport const getProductsByRecommendationList = async (input: ProductListInput, context: IActionContext): Promise => {\n // If the recommendation list is picks for you and the user is not signed do not make the reco API call and return empty list of products\n const customerAccountNumber =\n context.requestContext && context.requestContext.user && context.requestContext.user.customerAccountNumber;\n if (input.listMetadata.recommendationListId === PICKS_FOR_YOU_LIST && !customerAccountNumber) {\n return [];\n }\n\n const recommendationCriteria: RecommendationCriteria = {};\n const proxyContext: IContext = { callerContext: context, queryResultSettings: { Paging: { Top: input.listMetadata.pageSize || 10 } } };\n recommendationCriteria.CatalogId = input.catalogId;\n\n let reccomendationListId;\n if (input.listMetadata.recommendationListId) {\n reccomendationListId = input.listMetadata.recommendationListId;\n } else {\n actionInputError(`recommendationListId (from listmetadata)`);\n }\n recommendationCriteria.ProductIds = await getProductIdForReco(recommendationCriteria, input, context);\n\n if ((input.listMetadata.personalization || reccomendationListId === PICKS_FOR_YOU_LIST) && customerAccountNumber) {\n recommendationCriteria.CustomerAccountNumber = customerAccountNumber;\n proxyContext.bypassCache = 'get';\n }\n\n const rsVersion =\n !process.env.MSDyn365Commerce_RSVERSION || process.env.MSDyn365Commerce_RSVERSION === '--'\n ? '0.0'\n : process.env.MSDyn365Commerce_RSVERSION;\n const isHideAndSortByInventoryAvailabilitySupported = versionGte(rsVersion, '9.37');\n let channelInventoryConfiguration = {};\n if (isHideAndSortByInventoryAvailabilitySupported) {\n if (\n context.requestContext.app.config?.productListInventoryDisplay === ProductListInventoryFilteringOptions.HideOOS ||\n context.requestContext.app.config?.productListInventoryDisplay === ProductListInventoryFilteringOptions.SortOOS\n ) {\n // eslint-disable-next-line @typescript-eslint/no-require-imports, @typescript-eslint/no-var-requires\n const StoreOperationsDataActions = require('@msdyn365-commerce/retail-proxy/dist/DataActions/StoreOperationsDataActions.g');\n channelInventoryConfiguration = await StoreOperationsDataActions.getInventoryConfigurationAsync({ callerContext: context });\n }\n }\n\n const products = await getProductsByNewSearchByCriteria(input, proxyContext, channelInventoryConfiguration);\n if (products.length > 0) {\n return products;\n }\n\n context.telemetry.debug(`Recommendation Criteria: ${JSON.stringify(recommendationCriteria)}`);\n\n // For FBT lists, a product or category seed must be provided or the request will error out. So we check to see if any have been provided and return empty list if none have\n if (reccomendationListId === FREQUENTLY_BOUGHT_TOGETHER_LIST) {\n if (\n recommendationCriteria.ProductIds &&\n recommendationCriteria.ProductIds.length === 0 &&\n recommendationCriteria.CategoryIds &&\n recommendationCriteria.CategoryIds.length === 0\n ) {\n return [];\n }\n }\n\n return getElementsAsync(proxyContext, reccomendationListId, recommendationCriteria)\n .then(async (recommendedElements: RecommendedElement[]) => {\n if (recommendedElements) {\n const productInputs: ProductInput[] = [];\n const productTypeId: string[] = [];\n const catalogIdNumber = getCatalogIdForSdk(context.requestContext, null);\n // Grab all the elements that are products and store the product ids\n for (let i = 0; i < recommendedElements.length; i++) {\n const element = recommendedElements[i];\n // Element type value of 1 indicates product type\n if (element.ElementId && element.ElementTypeValue === 1) {\n productInputs[i] = new ProductInput(+element.ElementId, context.requestContext.apiSettings, catalogIdNumber);\n productTypeId[i] = element.ElementId;\n }\n }\n context.telemetry.debug(`Running recommendation action for list ${input.listMetadata.recommendationListId}`);\n context.telemetry.debug(`Number of products returned: ${productTypeId.length}`);\n context.telemetry.debug('Product ids returned', productTypeId);\n\n if (productInputs.length) {\n const itemIds: number[] = productInputs.map(value => value.productId);\n const productSearchCriteria: ProductSearchCriteria = {\n Ids: itemIds,\n Context: {\n ChannelId: +context.requestContext.apiSettings.channelId,\n CatalogId: +input.catalogId\n },\n SkipVariantExpansion: true,\n IncludeAttributes: true\n };\n\n const queryResultSettings: QueryResultSettings = {\n Paging: {\n Top: input.listMetadata.pageSize || 10\n }\n };\n\n if (isHideAndSortByInventoryAvailabilitySupported) {\n if (\n context.requestContext.app.config?.productListInventoryDisplay === ProductListInventoryFilteringOptions.HideOOS\n ) {\n const inventoryInStockRefinerValueInput = new InventoryInStockRefinerValueInput(\n context,\n +input.channelId,\n channelInventoryConfiguration,\n +input.catalogId\n );\n\n const inventoryInStockRefinerValue = await getInventoryInStockRefinerAction(\n inventoryInStockRefinerValueInput,\n context\n );\n if (inventoryInStockRefinerValue) {\n productSearchCriteria.Refinement = [inventoryInStockRefinerValue];\n }\n }\n\n /**\n * Sort by inventory availability:\n * For other type expect editorial: it's supported since 9.37.\n * For editorial list type: it's supported since 9.44 since it depends on fix from retail server which is fixed on 9.44. But logic here is the same as other types.\n */\n if (\n context.requestContext.app.config?.productListInventoryDisplay === ProductListInventoryFilteringOptions.SortOOS\n ) {\n const sorting = getInventorySorting(channelInventoryConfiguration);\n if (sorting) {\n queryResultSettings.Sorting = sorting;\n }\n }\n }\n\n try {\n let productSearchResults = await searchByCriteriaAsync(\n {\n callerContext: context,\n queryResultSettings\n },\n productSearchCriteria\n );\n // If the ProductSearchResult API finds the products then populate the product image urls and return\n // otherwise if the API does not exist or does not return products proceed to the legacy flows for legacy/backward compatibility reasons\n context.telemetry.debug('Product search results returned', JSON.stringify(productSearchResults));\n if (productSearchResults.length > 0) {\n getProductImageUrls(productSearchResults, context.requestContext.apiSettings);\n productSearchResults = orderProductSearchResults(itemIds, productSearchResults);\n return productSearchResults;\n }\n } catch (e) {\n // In case of an error fall back to legacy flow\n context.telemetry.error(`Error while getting productSearchResult: ${e}`);\n }\n }\n }\n return [];\n })\n .catch(error => {\n context.telemetry.error(`Error running productByRecommendation action: ${error}`);\n throw new Error(error);\n });\n};\n\nexport const getProductsByRecommendationListAction = createObservableDataAction({\n action: >getProductsByRecommendationList,\n id: '@msdyn365-commerce/products-by-recommendation'\n});\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport { createObservableDataAction } from '@msdyn365-commerce/action-internal';\nimport { IAction, IActionContext } from '@msdyn365-commerce/core-internal';\nimport { getRelatedProductsAsync } from '@msdyn365-commerce/retail-proxy/dist/DataActions/ProductsDataActions.g';\nimport { ProductSearchResult } from '@msdyn365-commerce/retail-proxy/dist/Entities/CommerceTypes.g';\nimport { getProductImageUrls } from '../../utils/product-list-utils';\nimport { ProductListInput } from '../hydrator-action-inputs';\n\nconst actionInputError = (missingType: string) => {\n throw new Error(`Input ${missingType} is missing and required to run GetProductsByRelationship action`);\n};\n\nexport const getProductsByRelationshipIdList = async (input: ProductListInput, context: IActionContext): Promise => {\n let productId;\n let relationshipId;\n // Grab the product ID from the list meta data or context\n if (input.listMetadata.productIds && input.listMetadata.productIds.length > 0) {\n productId = input.listMetadata.productIds[0];\n } else if (context.requestContext.urlTokens && context.requestContext.urlTokens.itemId) {\n productId = +context.requestContext.urlTokens.itemId;\n } else {\n actionInputError('productId');\n }\n // The relationship ID must be provided with the list meta data\n if (input.listMetadata.relationshipId) {\n relationshipId = +input.listMetadata.relationshipId;\n } else {\n actionInputError('relationshipId');\n }\n context.telemetry.debug(`Product Id input to productByRelationship action: ${productId}`);\n context.telemetry.debug(`Relationship Id input to productByRelationship action: ${relationshipId}`);\n\n return getRelatedProductsAsync(\n { callerContext: context, queryResultSettings: { Paging: { Top: input.listMetadata.pageSize || 10 } } },\n productId,\n input.channelId,\n input.catalogId,\n relationshipId\n )\n .then((products: ProductSearchResult[]) => {\n context.telemetry.debug('Products returned by getRelatedProducts action', products);\n return getProductImageUrls(products, context.requestContext.apiSettings);\n })\n .catch(error => {\n context.telemetry.error(`Error running getRelatedProducts action: ${error}`);\n throw new Error(error);\n });\n};\n\nexport const getProductsByRelationshipIdListAction = createObservableDataAction({\n action: >getProductsByRelationshipIdList,\n id: '@msdyn365-commerce/products-by-relationship-id'\n});\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport { createObservableDataAction } from '@msdyn365-commerce/action-internal';\nimport { IAction, IActionContext } from '@msdyn365-commerce/core-internal';\nimport { searchByTextAsync } from '@msdyn365-commerce/retail-proxy/dist/DataActions/ProductsDataActions.g';\nimport { ProductSearchResult } from '@msdyn365-commerce/retail-proxy/dist/Entities/CommerceTypes.g';\nimport { getProductImageUrls } from '../../utils/product-list-utils';\nimport { ProductListInput } from '../hydrator-action-inputs';\n\nexport const getProductsBySearchList = async (input: ProductListInput, context: IActionContext): Promise => {\n let searchText: string;\n if (input.listMetadata.searchText) {\n searchText = input.listMetadata.searchText;\n } else if (context.requestContext.query && context.requestContext.query && context.requestContext.query.q) {\n searchText = context.requestContext.query.q;\n } else {\n throw new Error(\n 'Search text missing for ProductsBySearch. Query string ?q={searchText} or search text in list meta data must be present.'\n );\n }\n\n return searchByTextAsync(\n { callerContext: context, queryResultSettings: { Paging: { Top: input.listMetadata.pageSize || 10 } } },\n input.channelId,\n input.catalogId,\n searchText\n )\n .then((products: ProductSearchResult[]) => {\n context.telemetry.debug('Products returned by productsBySearch action:', products);\n return getProductImageUrls(products, context.requestContext.apiSettings);\n })\n .catch(error => {\n context.telemetry.error(`Error running productsBySearch action: ${error}`);\n throw new Error(error);\n });\n};\n\nexport const getProductsBySearchListAction = createObservableDataAction({\n action: >getProductsBySearchList,\n id: '@msdyn365-commerce/products-by-search'\n});\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport msdyn365Commerce, { IActionContext, IDictionary, IObservableAction } from '@msdyn365-commerce/core-internal';\nimport { ICache } from '@msdyn365-commerce/cache-internal';\nimport { IProductList } from '@msdyn365-commerce/retail-proxy/dist/data-types';\nimport { ProductSearchResult } from '@msdyn365-commerce/retail-proxy/dist/Entities/CommerceTypes.g';\nimport { EXCEPTION_PRODUCT_LIST_ACTION, INVALID_PRODUCT_LIST_TYPE } from '@msdyn365-commerce/telemetry-internal';\nimport { toJS } from 'mobx';\nimport { set as _set } from 'lodash';\nimport { MODULE_CONFIG_KEY } from '../consts';\nimport { IProductListMetaData, ProductListInput, ProductListType } from './hydrator-action-inputs';\nimport { getProductsByCategoryListAction } from './product-list-actions/products-by-category.action';\nimport { getProductsByRecentlyViewedListAction } from './product-list-actions/products-by-recentlyviewed.action';\nimport { getProductsByRecommendationListAction } from './product-list-actions/products-by-recommendation.action';\nimport { getProductsByRelationshipIdListAction } from './product-list-actions/products-by-relationship-id.action';\nimport { getProductsBySearchListAction } from './product-list-actions/products-by-search.action';\nimport { shouldOptimizeHydrate } from '../utils/helpers';\n\n/**\n * Method to hydrate a product list from metadata provided by CMS\n * @param listMetaData The metadata for the product list from CMS\n */\nexport const hydrateProductList = async (\n listMetaData: IProductListMetaData,\n context: IActionContext,\n moduleId?: string,\n propertyToMapInConfig?: string\n): Promise => {\n let action: IObservableAction | undefined;\n const productListMetaData = (listMetaData);\n productListMetaData.products = [];\n\n switch (ProductListType[listMetaData.listType]) {\n case ProductListType.productBySearch:\n action = getProductsBySearchListAction;\n break;\n case ProductListType.productByCategory:\n action = getProductsByCategoryListAction;\n break;\n case ProductListType.relatedProducts:\n action = getProductsByRelationshipIdListAction;\n break;\n case ProductListType.recentlyViewedProducts:\n action = getProductsByRecentlyViewedListAction;\n break;\n case ProductListType.editorial:\n case ProductListType.algo:\n case ProductListType.recommendation:\n action = getProductsByRecommendationListAction;\n break;\n default:\n context.telemetry.error(INVALID_PRODUCT_LIST_TYPE, listMetaData.listType);\n productListMetaData.listMetadata = { error: INVALID_PRODUCT_LIST_TYPE };\n }\n\n if (action !== undefined) {\n return action(new ProductListInput(listMetaData, context), context)\n .then(productList => {\n productListMetaData.products = productList ?? [];\n productListMetaData.products = productListMetaData.products.filter(item => item && item.Name);\n updateListDataInRequestCache(context, productList, moduleId, propertyToMapInConfig);\n })\n .catch(error => {\n context.telemetry.error(EXCEPTION_PRODUCT_LIST_ACTION);\n context.telemetry.exception(error);\n productListMetaData.listMetadata = { error: EXCEPTION_PRODUCT_LIST_ACTION };\n updateListDataInRequestCache(context, productListMetaData.products, moduleId, propertyToMapInConfig);\n });\n }\n\n return;\n};\n\n/**\n * update list data in request cache when client optimize hydrate is enabled. This\n * @param context\n * @param products\n * @param moduleId\n * @param propertyToMapInConfig\n */\nconst updateListDataInRequestCache = (\n context: IActionContext,\n products: ProductSearchResult[],\n moduleId?: string,\n propertyToMapInConfig?: string\n) => {\n if (msdyn365Commerce.isBrowser && shouldOptimizeHydrate(context.requestContext) && moduleId && propertyToMapInConfig) {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const requestCache: ICache = (context).requestCache;\n const cacheValue = requestCache.get>({\n typeName: MODULE_CONFIG_KEY,\n key: moduleId\n });\n if (cacheValue) {\n const config = toJS(cacheValue.item);\n config[propertyToMapInConfig].products = products;\n _set(config, [propertyToMapInConfig], config[propertyToMapInConfig]);\n requestCache.put({ typeName: MODULE_CONFIG_KEY, key: moduleId }, { item: config });\n }\n }\n};\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\n/* eslint-disable @typescript-eslint/no-explicit-any */\nimport { ICache } from '@msdyn365-commerce/cache-internal';\nimport { EditError, IDictionary, IModuleContract, PROPERTY_INIT } from '@msdyn365-commerce/core-internal';\nimport { CLIENT_DATA_UPDATE_EVENT, MSDYN365_WYSIWYG_DISABLED_PROPS } from '../consts';\n\nconst MODULE_NAME_PATH = '__MODULE_NAME__';\n\nconst MODULE_TYPE_PATH = '__MODULE_TYPE__';\n\nconst PARENT_PROP_PATH = '__PARENT_PROP__';\n\nexport interface IDisabledProperties {\n modules: IDictionary;\n}\n\nexport const getWrappedProxyObject = (config: IDictionary<{}>, moduleName: string, typeName: string) => {\n if (typeof window === 'undefined') {\n return config;\n }\n\n return getProxyHandler(config, moduleName, typeName);\n};\n\n/**\n * Get parent module id\n */\nexport const disableChildModules = (parentModule: IModuleContract, requestCache: ICache) => {\n const slotKeys = Object.keys(parentModule.modules || []);\n for (let i = 0; i < slotKeys.length; ++i) {\n const childModules: IModuleContract[] = parentModule.modules![slotKeys[i]];\n for (let j = 0; j < childModules.length; ++j) {\n requestCache.put({ typeName: MSDYN365_WYSIWYG_DISABLED_PROPS, key: childModules[j].id }, { item: ['*'] });\n disableChildModules(childModules[j], requestCache);\n }\n }\n};\n\n/**\n * helper function to find module from page contract\n * @param moduleId module to be searched\n * @param pageRoot page root object\n */\nexport const findModule = (moduleId: string, pageRoot: IModuleContract): IModuleContract | undefined => {\n if (pageRoot.id === moduleId) {\n return pageRoot;\n }\n\n const slotKeys = Object.keys(pageRoot.modules || []);\n for (let i = 0; i < slotKeys.length; ++i) {\n const childModules: IModuleContract[] = pageRoot.modules![slotKeys[i]];\n for (let j = 0; j < childModules.length; ++j) {\n const res = findModule(moduleId, childModules[j]);\n if (res) {\n return res;\n }\n }\n }\n\n return undefined;\n};\n\n/**\n * Returns proxy object with get and set traps\n */\nconst getProxyHandler = (config: IDictionary<{}>, moduleName: string, moduleType: string): unknown => {\n const handler: ProxyHandler> = {\n get(target: IDictionary<{}>, key: string): IDictionary<{}> | string {\n // store current module name on the proxy object\n if (!target[MODULE_NAME_PATH]) {\n target[MODULE_NAME_PATH] = moduleName;\n }\n\n if (!target[MODULE_TYPE_PATH]) {\n target[MODULE_TYPE_PATH] = moduleType;\n }\n\n if (typeof target[key] === 'object' && target[key] !== null) {\n // store current prop path as parent and return new proxy (for objects)\n target[key][PARENT_PROP_PATH] = target[PARENT_PROP_PATH] ? `${target[PARENT_PROP_PATH]}.${key}` : key;\n return new Proxy(target[key], handler);\n } else {\n return target[key];\n }\n },\n\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n set(target: IDictionary<{}>, key: string, newValue: any): boolean {\n let disabledProperties: string[] = [];\n const moduleId = target[MODULE_NAME_PATH];\n const typeName: string = target[MODULE_TYPE_PATH];\n\n if (!moduleId || !typeName) {\n return true;\n }\n\n let propertyPath = [key];\n\n if (target[PARENT_PROP_PATH]) {\n const parentPath = (target[PARENT_PROP_PATH]).split('.');\n propertyPath = key === '$type' ? parentPath : parentPath.concat([key]);\n }\n\n // Check for disabled properties only during component initialization\n // MSDYN365_WYSIWYG_INIT is triggered on component mount and whenever\n // there is a change in component props (componentWillReceiveProps)\n if (newValue === '__MSDYN365_WYSIWYG_INIT__') {\n disabledProperties = (window)._msdyn365.authoringHelper.getDisabledProperties(moduleId);\n\n if ((disabledProperties || []).length > 0) {\n // if the value is '*' all properties are disabled\n if (disabledProperties.length === 1 && disabledProperties[0] === '*') {\n throw new EditError('cannot set disabled property');\n }\n\n const fullPath = propertyPath.join('.');\n // properties disabled in template are disabled at root property path - and will only contain part of the updated property's full path\n // e.g. disabledProperties = ['heading','links'], updatedProperty = 'heading.text' and 'links.1.linkText' are disabled\n // we check for fullPath.startsWith(`${p}.`) to handle cases where 'heading' prop is disabled and edited property is 'headingLink'\n if (disabledProperties.filter(p => fullPath === p || fullPath.startsWith(`${p}.`)).length > 0) {\n throw new EditError('cannot set disabled property');\n }\n }\n\n // for events that are called as part of initialization, do no set any value\n // as the initialization is to check if a property is disabled\n const requiredProperties: string[] = getRequiredProperties(typeName) || [];\n throw new EditError('cannot set disabled property', PROPERTY_INIT, requiredProperties.includes(propertyPath.join('.')));\n }\n\n // If we reached here, it means component is not disabled, lets just\n // notify the site builder\n document.dispatchEvent(\n new CustomEvent(CLIENT_DATA_UPDATE_EVENT, {\n detail: { moduleId, value: newValue, property: propertyPath }\n })\n );\n return true;\n }\n };\n\n return new Proxy(config, handler);\n};\n\n/**\n * helper method to get required properties\n */\nconst getRequiredProperties = (typeName: string) => {\n if (!(typeof window === undefined)) {\n const authoringHelper = (window)._msdyn365.authoringHelper;\n return authoringHelper && authoringHelper.renderingHelper && authoringHelper.renderingHelper.moduleRequiredProperties(typeName);\n }\n\n return [];\n};\n","import * as cookie from 'cookie';\r\nexport function hasDocumentCookie() {\r\n // Can we get/set cookies on document.cookie?\r\n return typeof document === 'object' && typeof document.cookie === 'string';\r\n}\r\nexport function cleanCookies() {\r\n document.cookie.split(';').forEach(function (c) {\r\n document.cookie = c\r\n .replace(/^ +/, '')\r\n .replace(/=.*/, '=;expires=' + new Date().toUTCString() + ';path=/');\r\n });\r\n}\r\nexport function parseCookies(cookies, options) {\r\n if (typeof cookies === 'string') {\r\n return cookie.parse(cookies, options);\r\n }\r\n else if (typeof cookies === 'object' && cookies !== null) {\r\n return cookies;\r\n }\r\n else {\r\n return {};\r\n }\r\n}\r\nexport function isParsingCookie(value, doNotParse) {\r\n if (typeof doNotParse === 'undefined') {\r\n // We guess if the cookie start with { or [, it has been serialized\r\n doNotParse =\r\n !value || (value[0] !== '{' && value[0] !== '[' && value[0] !== '\"');\r\n }\r\n return !doNotParse;\r\n}\r\nexport function readCookie(value, options) {\r\n if (options === void 0) { options = {}; }\r\n var cleanValue = cleanupCookieValue(value);\r\n if (isParsingCookie(cleanValue, options.doNotParse)) {\r\n try {\r\n return JSON.parse(cleanValue);\r\n }\r\n catch (e) {\r\n // At least we tried\r\n }\r\n }\r\n // Ignore clean value if we failed the deserialization\r\n // It is not relevant anymore to trim those values\r\n return value;\r\n}\r\nfunction cleanupCookieValue(value) {\r\n // express prepend j: before serializing a cookie\r\n if (value && value[0] === 'j' && value[1] === ':') {\r\n return value.substr(2);\r\n }\r\n return value;\r\n}\r\n","var __assign = (this && this.__assign) || function () {\r\n __assign = Object.assign || function(t) {\r\n for (var s, i = 1, n = arguments.length; i < n; i++) {\r\n s = arguments[i];\r\n for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))\r\n t[p] = s[p];\r\n }\r\n return t;\r\n };\r\n return __assign.apply(this, arguments);\r\n};\r\nimport * as cookie from 'cookie';\r\nimport { hasDocumentCookie, parseCookies, readCookie } from './utils';\r\nvar Cookies = /** @class */ (function () {\r\n function Cookies(cookies, options) {\r\n var _this = this;\r\n this.changeListeners = [];\r\n this.HAS_DOCUMENT_COOKIE = false;\r\n this.cookies = parseCookies(cookies, options);\r\n new Promise(function () {\r\n _this.HAS_DOCUMENT_COOKIE = hasDocumentCookie();\r\n }).catch(function () { });\r\n }\r\n Cookies.prototype._updateBrowserValues = function (parseOptions) {\r\n if (!this.HAS_DOCUMENT_COOKIE) {\r\n return;\r\n }\r\n this.cookies = cookie.parse(document.cookie, parseOptions);\r\n };\r\n Cookies.prototype._emitChange = function (params) {\r\n for (var i = 0; i < this.changeListeners.length; ++i) {\r\n this.changeListeners[i](params);\r\n }\r\n };\r\n Cookies.prototype.get = function (name, options, parseOptions) {\r\n if (options === void 0) { options = {}; }\r\n this._updateBrowserValues(parseOptions);\r\n return readCookie(this.cookies[name], options);\r\n };\r\n Cookies.prototype.getAll = function (options, parseOptions) {\r\n if (options === void 0) { options = {}; }\r\n this._updateBrowserValues(parseOptions);\r\n var result = {};\r\n for (var name_1 in this.cookies) {\r\n result[name_1] = readCookie(this.cookies[name_1], options);\r\n }\r\n return result;\r\n };\r\n Cookies.prototype.set = function (name, value, options) {\r\n var _a;\r\n if (typeof value === 'object') {\r\n value = JSON.stringify(value);\r\n }\r\n this.cookies = __assign(__assign({}, this.cookies), (_a = {}, _a[name] = value, _a));\r\n if (this.HAS_DOCUMENT_COOKIE) {\r\n document.cookie = cookie.serialize(name, value, options);\r\n }\r\n this._emitChange({ name: name, value: value, options: options });\r\n };\r\n Cookies.prototype.remove = function (name, options) {\r\n var finalOptions = (options = __assign(__assign({}, options), { expires: new Date(1970, 1, 1, 0, 0, 1), maxAge: 0 }));\r\n this.cookies = __assign({}, this.cookies);\r\n delete this.cookies[name];\r\n if (this.HAS_DOCUMENT_COOKIE) {\r\n document.cookie = cookie.serialize(name, '', finalOptions);\r\n }\r\n this._emitChange({ name: name, value: undefined, options: options });\r\n };\r\n Cookies.prototype.addChangeListener = function (callback) {\r\n this.changeListeners.push(callback);\r\n };\r\n Cookies.prototype.removeChangeListener = function (callback) {\r\n var idx = this.changeListeners.indexOf(callback);\r\n if (idx >= 0) {\r\n this.changeListeners.splice(idx, 1);\r\n }\r\n };\r\n return Cookies;\r\n}());\r\nexport default Cookies;\r\n","import Cookies from './Cookies';\r\nexport default Cookies;\r\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport msdyn365Commerce, { ICookieContext, ICookieContextOptions, ICookieValue } from '@msdyn365-commerce/core-internal';\nimport { Cart } from '@msdyn365-commerce/retail-proxy';\nimport Cookies, { CookieSetOptions } from 'universal-cookie';\nimport { USER_CONSENT_GIVEN_EVENT } from '../consts';\n\nexport interface ICookieSetOptions extends CookieSetOptions {\n isEssential?: boolean;\n}\n\nexport const enum CartTokenPrefix {\n Auth = 't',\n Anon = 'p'\n}\n\nexport const enum AccountSelectionTokenPrefix {\n Auth = 't',\n Anon = 'p'\n}\n\nconst UserConsentCookieName: string = '_msdyn365___ucc_';\n\n/**\n * Context for cookie handling\n *\n * @export\n * @class CookieContext\n */\nexport class CookieContext implements ICookieContext {\n private _cookies: Cookies;\n private _setCookieList: (() => void)[] = [];\n private _serverCookieList: string[] = [];\n private _clientCookieList: string[] = [];\n private _options: ICookieContextOptions;\n\n /**\n * Returns a cookies class from the selected cookie store. If the express server\n * is passed the cookie header will be used otherwise the global cookie store will be used.\n * @param options Optional ICookieContextOptions.\n */\n constructor(options?: ICookieContextOptions, cookieString?: string) {\n this._options = { isConsentRequired: true, ...options };\n if (cookieString) {\n this._cookies = new Cookies(cookieString);\n } else if (msdyn365Commerce.isBrowser) {\n this._cookies = new Cookies(document && document.cookie);\n } else {\n this._cookies = new Cookies(\n this._options.req &&\n this._options.req.headers &&\n (this._options.req.headers['x-msdyn365-cookie'] || this._options.req.headers.cookie)\n );\n }\n }\n\n /**\n * Get Cookie Value\n *\n * @param {string} cookieName - A string cookie name\n * @return {ICookieValue} cookie value with status\n */\n public get = (cookieName: string, isEssential?: boolean): ICookieValue => {\n if (isEssential || this.isConsentGiven()) {\n const cookieValue = this._cookies.get(cookieName);\n return { name: cookieName, value: cookieValue, status: cookieValue ? 'FOUND' : 'NOT_FOUND' };\n }\n\n return { name: cookieName, value: undefined, status: 'NO_CONSENT' };\n };\n\n /**\n * Set Cookie\n *\n * @param {string} cookieName - A string cookie name\n * @param {T} cookieValue - A cookie value\n * @param {ICookieSetOptions} options cookie options same as document.cookie\n */\n public set = (cookieName: string, cookieValue: T, options?: ICookieSetOptions): void => {\n const sameSiteRequiredFlag = this._options.sameSiteRequired;\n let cookieOptionsWithDefaults: ICookieSetOptions;\n\n cookieOptionsWithDefaults = { path: '/', secure: true, isEssential: false };\n\n if (sameSiteRequiredFlag === true) {\n cookieOptionsWithDefaults = { path: '/', secure: true, isEssential: false, sameSite: 'none', ...options };\n } else {\n if (options) {\n const filteredOptions: ICookieSetOptions = {};\n for (const [key, value] of Object.entries(options)) {\n if (key.toLowerCase() !== 'samesite') {\n filteredOptions[key] = value;\n }\n }\n cookieOptionsWithDefaults = { path: '/', secure: true, isEssential: false, ...filteredOptions };\n }\n }\n\n if (cookieOptionsWithDefaults.isEssential || this.isConsentGiven()) {\n // Set the cookie if client side\n if (msdyn365Commerce.isBrowser) {\n this._cookies.set(cookieName, cookieValue, cookieOptionsWithDefaults);\n const clientCookieString = this.createCookieString(cookieName, cookieValue, cookieOptionsWithDefaults);\n this._clientCookieList.push(clientCookieString);\n return;\n }\n // If server side, convert the cookie into a header string and push it onto an array\n const serverCookieString = this.createCookieString(cookieName, cookieValue, cookieOptionsWithDefaults);\n this._serverCookieList.push(serverCookieString);\n } else {\n this._setCookieList.push(() => {\n this._cookies.set(cookieName, cookieValue, cookieOptionsWithDefaults);\n });\n }\n };\n\n /**\n * Gets the value stored in the cart cookie that contains the\n * cart context and information. Returns an empty string if no such value exists.\n *\n */\n public getCartCookie = (): string => {\n return this.get(msdyn365Commerce.CartCookie, true).value || '';\n };\n\n public getTargetIdCookie = (): string => {\n return this.get('_msdyn365___tuid_', true).value || '';\n };\n\n /**\n * Sets the cart cookie with a new expiry time time of one year\n * from the current date\n *\n * @param cart The object containing the current cart information\n * @param isAuthenticated Boolean representing whether current user is authenticated or not\n * @param setAlways Boolean representing if the cookie should be set regardless of whether the cookie exists or not\n */\n public setCartCookie = (cart: Cart, isAuthenticated: boolean, setAlways: boolean = false): void => {\n const prefix = isAuthenticated ? CartTokenPrefix.Auth : CartTokenPrefix.Anon;\n const cartCookieOptions: ICookieSetOptions = { isEssential: true, secure: true, sameSite: 'none' };\n const cookieValue = `${prefix}:${cart.Id}`;\n const existingCart = this.getCartCookie();\n\n // Unless explicity overridden using setAlways flag, do not set the cookie if the cookie value is the same as existing cookie value\n if (!setAlways && existingCart === cookieValue) {\n return;\n }\n\n if (this._options.cartExpirationInDays) {\n // 86400000 is 1 day in ms\n cartCookieOptions.expires = new Date(Date.now() + this._options.cartExpirationInDays * 86400000);\n }\n this.set(msdyn365Commerce.CartCookie, cookieValue, cartCookieOptions);\n };\n\n /**\n * Gets the value stored in the checkout cart cookie that contains the\n * checkout cart context and information. Returns an empty string if no such value exists.\n */\n public getCheckoutCartCookie = (): string => {\n return this.get(msdyn365Commerce.checkoutCartCookie, true).value || '';\n };\n\n /**\n * Sets the checkout cart cookie with a new expiry time time of one year\n * from the current date\n *\n * @param cart The object containing the current checkout cart information\n * @param isAuthenticated Boolean representing whether current user is authenticated or not\n * @param setAlways Boolean representing if the cookie should be set regardless of whether the cookie exists or not\n */\n public setCheckoutCartCookie = (cart: Cart, isAuthenticated: boolean, setAlways: boolean = false): void => {\n const prefix = isAuthenticated ? CartTokenPrefix.Auth : CartTokenPrefix.Anon;\n const checkoutCartCookieOptions: ICookieSetOptions = { isEssential: true, secure: true, sameSite: 'none' };\n const cookieValue = `${prefix}:${cart.Id}`;\n const existingCookie = this.getCheckoutCartCookie();\n\n // Unless explicity overridden using setAlways flag, do not set the cookie if the cookie value is the same as existing cookie value\n if (!setAlways && existingCookie === cookieValue) {\n return;\n }\n\n if (this._options.cartExpirationInDays) {\n // 86400000 is 1 day in ms\n checkoutCartCookieOptions.expires = new Date(Date.now() + this._options.cartExpirationInDays * 86400000);\n }\n this.set(msdyn365Commerce.checkoutCartCookie, cookieValue, checkoutCartCookieOptions);\n };\n\n /**\n * Remove checkout cart cookie.\n */\n public removeCheckoutCartCookie = (): void => {\n this.remove(msdyn365Commerce.checkoutCartCookie);\n };\n\n /**\n * Gets the value stored in the account selection cookie that contains the\n * account selection context and information. Returns an empty string if no such value exists.\n */\n public getAccountSelectionCookie = (): string => {\n return this.get