Apply gift cards in the cart

[maplessmann]

Is there a way to apply gift card codes in the cart, similar to how demo store does for discount codes?

At checkout people can insert discount codes and gift card codes in the same input:

I was wondering if this is possible to achieve with Hydrogen 🤔

I know that I could pass a custom method for customMethods__unstable but it looks like there's no Cart mutation for updating gift cards like there is for discount codes with cartDiscountCodesUpdate. I'm not sure if I can use the checkoutGiftCardsAppend mutation since it requires a checkout ID

[wizardlyhel]

@maplessmann Hi, we just merged #2298 that would add the method for applying gift card code. This method will be available in the September release. You only need a cart id to add a gift card code to cart.

As for combining the gift card code and discount code input into one, this is certainly do-able. However, you would need to handle the logic of distinguishing a gift card code input vs a discount code input in your routes/cart.ts

[dvnrsn]

Is there any best practice around discount vs gift card code? Is the idea that shops should start their discounts with a known prefix? Or a length check?

[wizardlyhel]

discount code are meant for you to broadcast to your audiences - so these tends to be short and memorable

gift card codes are like cash and is only intended to be assigned to a single customer - Shopify generates a complex gift card code by default

[dvnrsn]

Is there a way to get a more verbose failure from

const res = await cart.updateDiscountCodes()
const res = await cart.updateGiftCardCodes()

Checkout gives great feedback.

[wizardlyhel]

Good question - I can't find any related cart user errors nor cart warning errors.

Please open a discussion in https://github.com/Shopify/storefront-api-feedback/discussions for feature request on getting more verbose user error and warnings on gift card and discount code that mimics checkout

[dvnrsn]

I believe I will need something akin to appliedGiftCards for discount codes so I can get the amount. However, discountAllocations is coming in empty despite the discount showing on checkout page (after navigation).

    discountAllocations {
      targetType
      discountedAmount {
        amount
      }
    }

Will I need the 2025-01 discountAllocation which seems to include more?

[johnxy84]

Following this topic I found you can use the cartGiftCardCodesUpdate mutation for this however if the user wants to apply multiple giftcards it becomes an issue because the mutation is an all or nothing and we no longer have the previously applied giftcardcode. We need sort of a cartGiftCardCodesAppend mutation to allow this behaviour unlike for vouchers where we have the full code always

[dvnrsn]

You may be able to get some of the way there by keeping track of codes in state. This works better for discount codes because they actually show up in the cart. With gift card codes they are truncated which indeed breaks update. But at least in one session, the user can add multiple gift card codes and check out.

[johnxy84]

Yeah, we already tried to do this . . . and yeah the problem of having only the last digits makes it an issue. Storing the giftcards and having the customer remove or apply gift cards in checkout skews it when the customer comes back to cart and don't want to have an extension just for this