Simpler data management with

REACT QUERY

Current stack
playlumi.com/roli.com

MobX Store

Component

Shopify API
GET /cart

MobX Store

Keep the cart products in a variable of the store.

Every time a mutation happen, store needs to update this.products to keep it up to date.

React Query
react-query.tanstack.com

Component

Shopify API
GET /cart

Cart.js

services/shopify/helpers.js

export function getTotalCartPrices(cart) {
  if (!cart) return null
  return {
    price: cart.totalAmount,
    discount: cart.lines.reduce((acc, line) => {
      return (
        acc + line.price.amount * edge.quantity
      )
    }, 0)
  }
}

export function getCartProductsQuantity(cart) {
  return ...
}


...

playlumi-next.com/cart