Versions Compared

Old Version 59

changes.mady.by.user Augusto Romao, Vinicius

Saved on

compared with

New Version 60

changes.mady.by.user Augusto Romao, Vinicius

Saved on

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

Questions:

...

Expand
title1 - TASK: Apply a promo code flow for loyalty

  • Create a feature flag

  • The first step to use the loyalty promo code at checkout will be to change the validation promo code flow.

    • On the promo code component field, we will need to add a feature flag:

      • When this flag is enabled: The promo code flow will be LOYALTY OFFER

      • When this flag is disabled: The promo code flow will be CBA OFFER (current flow)

  • Where the new logic can be (two options):

    • A new hook to contain all the rules of this flow

    • We can use the same hook used to offer page flow.

      • intl-whitelabel-app/workspaces/frontend/src/state/loyalty/hooks/use-redeem-promo-codes.ts

Code Block
languagetypescript
const onSubmitLoyaltyPromoCode = useCallback(async () => {
    setPromoCodeValidationLoading(true)

    // const loyaltyId = 'ec5cec01-b41b-509b-9111-310ab5a18154'

    let event = createRbiApplyPromoCodeEvent(promoCodeInput, 'Successful')
    const personalizedOffer = await redeemMutation(user?.loyaltyId || '', promoCodeInput)
      .catch((e: PromoCodeError) => {
        const reason = buildErrorMessageFromPromoCodeError(e)
        setPromoCodeErrorMessageId(
          (reason as TPromoCodeErrorMessageIds) || PromoCodeErrorMessageIds.default
        )

        logger.error(`Error validating promo code ${e}`)
        event = createRbiApplyPromoCodeEvent(promoCodeInput, 'Failed', e.message)
      })
      .finally(() => {
        setPromoCodeValidationLoading(false)
      })

    trackEvent(event)

    if (personalizedOffer) {
      await handleRedemption(personalizedOffer)

      // clear promo code input & error message
      setPromoCodeErrorMessageId(null)
      setPromoCodeInput('')

      toast.success(formatMessage({ id: 'offerAddedToCart' }))
    }
  }, [
    formatMessage,
    handleRedemption,
    promoCodeInput,
    redeemMutation,
    trackEvent,
    user?.loyaltyId,
  ])
  
  
   useEffect(() => {
    if (appliedOfferPromoCode?.loyaltyEngineId) {
      const standardOffersLimit =
        earningCalculationData?.EarningCalculation?.offerRedemptionLimits?.standardOffersLimit || 1

      dispatch(actions.loyalty.setSelectedOffer(appliedOfferPromoCode))
      dispatch(actions.loyalty.setAppliedOffers([appliedOfferPromoCode]))

      if (isDiscountLoyaltyOffer(appliedOfferPromoCode)) {
        // If limit of offers reached remove the first one
        if (appliedOffers?.length >= standardOffersLimit) {
          removeFromCart({ cartId: appliedOffers[0].cartId })
        }

        //Discount offers should not show menu item details
        dispatch(
          actions.loyalty.applyOffer({
            id: appliedOfferPromoCode.loyaltyEngineId,
            type: OfferType.GLOBAL,
            isStackable: appliedOfferPromoCode.isStackable,
            isSurprise: isSurpriseOffer(appliedOfferPromoCode),
            cmsId: appliedOfferPromoCode._id,
            cartId: 'discount-offer',
          })
        )
      }

      dispatch(actions.loyalty.setCmsOffers([appliedOfferPromoCode]))
      return
    }

    dispatch(actions.loyalty.setSelectedOffer(null))
    dispatch(actions.loyalty.setAppliedOffers([]))
    dispatch(actions.loyalty.setCmsOffers([]))

    // eslint-disable-next-line react-hooks/exhaustive-deps
  }, [appliedOfferPromoCode])

The code above was developed in the PoC and is a new code.

Attention points:

  1. We need to apply (dispatch) the personalised offer on some contexts:

    1. actions.loyalty.setSelectedOffer(personalizedOffer)

    2. actions.loyalty.setAppliedOffers

    3. actions.loyalty.applyOffer

    4. actions.loyalty.setCmsOffers

OBS.: It’s possible we need to apply the offer in another context too.

  1. When we click on remove in offer info (after applying the offer), we need to remove the offer in all contexts.

  2. When the customers reload the page, the offer must continue applied.

  3. Verify the need for other validations

With this update, the frontend is prepared to apply the promo code to loyalty.

...

Expand
title4 - TASK: Apply discount again if not used - NOT FOR NOW

This task is not for now. We’ll develop a PoC and validate the ideas first

  • Currently, we don’t have the validated voucher flow on whitelabel-app and voucherify, Just the burn voucher flow when we applied the promo code.

  • When we applied the promo code, the offer get saved on the offers page.

    • So, We need to validate the offers saved and compare the promo code added on the field to offers saved before validating the promo code on voucherify.

      • If we have a promo code saved, we will apply the offer without validating voucherify.

      • If we don’t have one, we will validate the promo code with voucherify

  • When have the promo code information on file:

    • path: intl-whitelabel-app/workspaces/frontend/src/pages/loyalty/loyalty-offers/loyalty-offers.tsx

      Code Block
      languagetypescript
      const { sortedTilesAndOffers, marketingTileTop, marketingTileBottom } =
  useOffersPageMarketingTiles({
    offers,
    offersPageMarketingTiles: marketingTiles,
    selectedOffer: selectedIncentive || null,
  })

    • On object sortedTilesAndOffers

Important: We don’t have the POC to this task

...