@occluze/tether 0.6.8 → 0.7.0

package/src/analytics.js

@@ -1,352 +0,0 @@
-/**
- * Analytics, as an optional part (loaded when config.analytics is set).
- *
- *   analytics: {
- *     dataLayer: true,        // GA4 / Google Tag Manager ecommerce events (window.dataLayer)
- *     shopify: true,          // Shopify's own analytics (experimental, see docs/analytics.md)
- *     onEvent(name, data) {}, // any other tool: Meta, TikTok, Plausible
- *   }
- *
- * Events: view_item (the page's product), view_item_list (lists), add_to_cart / remove_from_cart (from the cart's
- * changes, so quick +/- and JS calls count too), view_cart (cart opened), begin_checkout, search (search as you type).
- * Purchases happen on Shopify's checkout: use Shopify's Google & YouTube app or a checkout pixel for those.
- * Shopify's analytics are set up in analytics-shopify.js.
- */
-import { cfg, reportError } from './config.js';
-import { sel } from './dom.js';
-import { Cart } from './cart.js';
-import { startShopifyAnalytics } from './analytics-shopify.js';
-/** @import { Money } from './shopify-values.js' */
-/** @import { Product, ProductVariant } from './fragments.js' */
-/** @import { AnalyticsBus, EventPayload } from './analytics-shopify.js' */
-
-/**
- * cart.js has no types yet; these are the fields of its cart (`fragment TetherCart`) this module reads.
- *
- * @typedef {object} LineProduct
- * @property {string} id
- * @property {string} title
- * @property {string} handle
- * @property {string} vendor
- * @typedef {{ id: string, title: string, sku: string | null, price: Money, product: LineProduct }} LineVariant
- * @typedef {{ id: string, quantity: number, merchandise: LineVariant }} CartLine
- * @typedef {object} AnalyticsCart
- * @property {{ nodes: CartLine[] }} lines
- * @property {{ totalAmount: Money }} cost
- * @property {{ code: string, applicable: boolean }[]} discountCodes
- */
-
-/**
- * @typedef {object} ItemProduct What a GA4 item is built from: a product, or a cart line's product.
- * @property {string} id
- * @property {string} title
- * @property {string} [vendor]
- * @property {string} [productType]
- * @property {{ minVariantPrice: Money }} [priceRange]
- */
-/** @typedef {Pick<ProductVariant, 'id' | 'title' | 'sku' | 'price'>} ItemVariant */
-/**
- * @typedef {object} AnalyticsItem A GA4 ecommerce item.
- * @property {string} item_id
- * @property {string} item_name
- * @property {string | undefined} item_variant
- * @property {string | undefined} item_brand
- * @property {string | undefined} item_category
- * @property {number} price
- * @property {number} quantity
- * @property {number} [index]
- */
-/** @typedef {{ id: string, handle: string, title: string }} ListCollection */
-/** @typedef {{ product: Product, scope: { root: Element, variant: ProductVariant | null } | null }} ProductReadyDetail */
-/** @typedef {{ products: Product[] | undefined, collection: ListCollection | null }} ListReadyDetail */
-/** @typedef {{ cart: AnalyticsCart | null, reason: string }} CartUpdatedDetail */
-
-/** Shopify's title for the one variant of a product without options. */
-const DEFAULT_VARIANT_TITLE = 'Default Title';
-const CENTS_PER_UNIT = 100;
-/** GA4 drops an event with more items than this. */
-const MAX_LIST_ITEMS = 200;
-
-/** @param {Money | null | undefined} money */
-const amountOf = (money) => (money ? parseFloat(money.amount) : 0);
-
-/**
- * @param {string | null | undefined} gid
- * @returns {string} The numeric part of a gid.
- */
-const numericId = (gid) => (gid ?? '').split('/').pop() ?? '';
-
-/**
- * @param {ItemProduct} product
- * @param {ItemVariant | null | undefined} variant
- * @param {number} [quantity]
- * @param {number} [index] The position in a list.
- * @returns {AnalyticsItem}
- */
-function itemFromVariant(product, variant, quantity = 1, index) {
-  /** @type {AnalyticsItem} */
-  const item = {
-    item_id: variant?.sku || numericId(variant?.id) || numericId(product.id),
-    item_name: product.title,
-    item_variant: variant?.title === DEFAULT_VARIANT_TITLE ? undefined : variant?.title,
-    item_brand: product.vendor || undefined,
-    item_category: product.productType || undefined,
-    price: amountOf(variant?.price ?? product.priceRange?.minVariantPrice),
-    quantity,
-  };
-  if (index != null) item.index = index;
-  return item;
-}
-
-/**
- * @param {CartLine} line
- * @param {number} [quantity]
- */
-const itemFromLine = (line, quantity = line.quantity) =>
-  itemFromVariant(line.merchandise.product, line.merchandise, quantity);
-
-/**
- * @param {AnalyticsItem[]} items
- * @returns {number} The items' total, rounded to cents.
- */
-function totalValue(items) {
-  const total = items.reduce((sum, item) => sum + item.price * (item.quantity || 1), 0);
-  return Math.round(total * CENTS_PER_UNIT) / CENTS_PER_UNIT;
-}
-
-/**
- * @param {Product} product
- * @param {ItemVariant} variant
- * @param {number} [quantity]
- */
-const productPayload = (product, variant, quantity = 1) => ({
-  id: product.id,
-  title: product.title,
-  price: variant.price,
-  vendor: product.vendor || '',
-  variantId: variant.id,
-  variantTitle: variant.title,
-  quantity,
-  sku: variant.sku || undefined,
-  productType: product.productType || undefined,
-});
-
-/** @param {CartLine} line */
-const linePayload = (line) => ({
-  id: line.id,
-  quantity: line.quantity,
-  merchandise: {
-    id: line.merchandise.id,
-    title: line.merchandise.title,
-    price: line.merchandise.price,
-    sku: line.merchandise.sku,
-    product: {
-      id: line.merchandise.product.id,
-      title: line.merchandise.product.title,
-      vendor: line.merchandise.product.vendor || '',
-      handle: line.merchandise.product.handle,
-    },
-  },
-});
-
-/** @returns {unknown[]} The GA4 / GTM data layer, created when the page has none. */
-function dataLayer() {
-  const { dataLayer: option } = cfg.analytics ?? {};
-  const name = typeof option === 'string' ? option : 'dataLayer';
-  /** @type {unknown} */
-  const existing = Reflect.get(window, name);
-  if (Array.isArray(existing)) return existing;
-  /** @type {unknown[]} */
-  const created = [];
-  Reflect.set(window, name, created);
-  return created;
-}
-
-/**
- * @param {string} event
- * @param {Record<string, unknown> | undefined} ecommerce
- */
-function pushToDataLayer(event, ecommerce) {
-  const layer = dataLayer();
-  if (!ecommerce) {
-    layer.push({ event });
-    return;
-  }
-  // Google asks for the previous ecommerce object to be cleared first.
-  layer.push({ ecommerce: null });
-  layer.push({ event, ecommerce });
-}
-
-/** @type {AnalyticsBus | null} */
-let bus = null;
-/** @type {Map<string, CartLine> | null} Variant id to line, to turn cart changes into add and remove events. */
-let lastLines = null;
-/** @type {AnalyticsCart | null} */
-let lastCart = null;
-/** @type {WeakSet<Element>} Product roots whose view_item was sent on this page. */
-let viewed = new WeakSet();
-
-/**
- * @param {string} name The GA4 event.
- * @param {Record<string, unknown>} data
- * @param {string} [shopifyEvent]
- * @param {EventPayload} [shopifyPayload]
- */
-function send(name, data, shopifyEvent, shopifyPayload) {
-  if (cfg.analytics?.dataLayer) pushToDataLayer(name, data);
-  if (bus && shopifyEvent) bus.publish(shopifyEvent, shopifyPayload);
-  try {
-    cfg.analytics?.onEvent?.(name, data);
-  } catch (error) {
-    reportError(error, 'analytics onEvent');
-  }
-}
-
-/** @returns {unknown} The scope of the page's own product: a product root outside every list. */
-function mainProduct() {
-  const el = document.querySelector(sel('product'));
-  if (!el || el.closest(`${sel('collection')},${sel('products')},${sel('recommendations')}`)) return null;
-  /** @type {unknown} */
-  const tether = Reflect.get(window, 'Tether');
-  // The core sets window.Tether before it loads this part.
-  return /** @type {{ getScope: (el: Element) => unknown }} */ (tether).getScope(el);
-}
-
-/** @param {ProductReadyDetail} detail */
-function onProductReady({ product, scope }) {
-  if (!scope || viewed.has(scope.root) || mainProduct() !== scope) return;
-  viewed.add(scope.root);
-  const variant = scope.variant ?? product.variants.nodes[0];
-  const items = [itemFromVariant(product, variant)];
-  const products = variant ? [productPayload(product, variant)] : [];
-  send('view_item', { currency: variant?.price.currencyCode, value: totalValue(items), items }, 'product_viewed', {
-    products,
-  });
-}
-
-/** @param {ListReadyDetail} detail */
-function onListReady({ products = [], collection }) {
-  const items = products
-    .slice(0, MAX_LIST_ITEMS)
-    .map((product, index) => itemFromVariant(product, product.variants.nodes[0], 1, index));
-  const list = { item_list_id: collection?.handle || 'products', item_list_name: collection?.title || 'Products' };
-  if (!collection) {
-    send('view_item_list', { ...list, items });
-    return;
-  }
-  send('view_item_list', { ...list, items }, 'collection_viewed', {
-    collection: { id: collection.id, handle: collection.handle },
-  });
-}
-
-/**
- * @param {AnalyticsCart | null} cart
- * @param {Map<string, CartLine>} now
- * @param {Map<string, CartLine>} before
- */
-function sendCartChanges(cart, now, before) {
-  const currency = cart?.cost.totalAmount.currencyCode;
-  now.forEach((line, variantId) => {
-    const previous = before.get(variantId);
-    const added = line.quantity - (previous?.quantity ?? 0);
-    if (added <= 0) return;
-    const items = [itemFromLine(line, added)];
-    send('add_to_cart', { currency, value: totalValue(items), items }, 'product_added_to_cart', {
-      cart,
-      prevCart: lastCart,
-      currentLine: linePayload(line),
-      prevLine: previous ? linePayload(previous) : undefined,
-    });
-  });
-  before.forEach((line, variantId) => {
-    const removed = line.quantity - (now.get(variantId)?.quantity ?? 0);
-    if (removed <= 0) return;
-    const items = [itemFromLine(line, removed)];
-    send('remove_from_cart', { currency, value: totalValue(items), items });
-  });
-}
-
-/** @param {CartUpdatedDetail} detail */
-function onCartUpdated({ cart, reason }) {
-  const now = new Map((cart?.lines.nodes ?? []).map((line) => [line.merchandise.id, line]));
-  // Loading the saved cart and showing a pending change aren't changes the visitor made.
-  if (lastLines && reason !== 'load' && reason !== 'pending') sendCartChanges(cart, now, lastLines);
-  lastLines = now;
-  lastCart = cart;
-}
-
-function onCartOpened() {
-  const items = Cart.lines.map((line) => itemFromLine(line));
-  send('view_cart', { currency: Cart.state?.cost.totalAmount.currencyCode, value: totalValue(items), items });
-}
-
-/** @param {{ cart: AnalyticsCart }} detail */
-function onCheckout({ cart }) {
-  const items = cart.lines.nodes.map((line) => itemFromLine(line));
-  const coupons = cart.discountCodes.filter((discount) => discount.applicable).map((discount) => discount.code);
-  send('begin_checkout', {
-    currency: cart.cost.totalAmount.currencyCode,
-    value: totalValue(items),
-    coupon: coupons.join(',') || undefined,
-    items,
-  });
-}
-
-/**
- * Turns one Tether event into analytics events. The details are Tether's own (`emit`), typed per event here.
- *
- * @param {Event} event `<prefix>:<name>`.
- */
-function handle(event) {
-  const name = event.type.slice(cfg.prefix.length + 1);
-  /** @type {unknown} */
-  const detail = Reflect.get(event, 'detail');
-  switch (name) {
-    case 'product-ready':
-      onProductReady(/** @type {ProductReadyDetail} */ (detail));
-      break;
-    case 'list-ready':
-      onListReady(/** @type {ListReadyDetail} */ (detail));
-      break;
-    case 'cart-updated':
-      onCartUpdated(/** @type {CartUpdatedDetail} */ (detail));
-      break;
-    case 'cart-toggled':
-      if (/** @type {{ open: boolean }} */ (detail).open) onCartOpened();
-      break;
-    case 'checkout':
-      onCheckout(/** @type {{ cart: AnalyticsCart }} */ (detail));
-      break;
-    case 'search': {
-      const { term } = /** @type {{ term: string }} */ (detail);
-      if (term) send('search', { search_term: term }, 'search_viewed', { searchTerm: term });
-      break;
-    }
-    case 'page':
-      viewed = new WeakSet();
-      bus?.publish('page_viewed', {});
-      break;
-    default:
-      break;
-  }
-}
-
-/**
- * Called by the core with the events it buffered while this part loaded; the queue then handles events as they come.
- *
- * @param {Event[]} queue
- */
-export async function startAnalytics(queue) {
-  if (cfg.analytics?.shopify) {
-    bus = await startShopifyAnalytics(() => mainProduct() != null).catch((/** @type {unknown} */ error) => {
-      reportError(error, 'shopify analytics');
-      return null;
-    });
-  }
-  bus?.publish('page_viewed', {});
-  queue.splice(0).forEach(handle);
-  queue.push = (...events) => {
-    events.forEach(handle);
-    return queue.length;
-  };
-}

package/src/cart/checkout.js

@@ -1,97 +0,0 @@
-/**
- * Sending the visitor to Shopify's checkout. The URL comes from Shopify at click time, because the cart's checkout URL
- * changes with its market and customer; a logged-in customer's account part may supply its own (`beforeCheckout`).
- */
-import { cfg, reportError } from '../config.js';
-import { TetherError } from '../client.js';
-import { isHttpsUrl } from '../shopify-values.js';
-import { emit } from '../dom.js';
-import { fetchCheckoutUrl } from './mutations.js';
-import { customer, currentCart, savedCartId } from './store.js';
-/** @import { CheckoutTarget } from '../config.js' */
-
-/** @typedef {{ kind: 'url', url: string | null } | { kind: 'failed', error: unknown }} CheckoutUrlAnswer */
-
-/**
- * @param {string} cartId
- * @returns {Promise<CheckoutUrlAnswer>} Shopify's answer as a value, so the request can run alongside the account's
- *   and its failure is read only when its URL is the one used.
- */
-const askCheckoutUrl = (cartId) =>
-  fetchCheckoutUrl(cartId).then(
-    (url) => ({ kind: /** @type {const} */ ('url'), url }),
-    (/** @type {unknown} */ error) => ({ kind: /** @type {const} */ ('failed'), error }),
-  );
-
-/**
- * @returns {Promise<string | null>} The logged-in customer's checkout URL. When the account can't give one, the
- *   failure is reported and the cart's own checkout URL is used, which still checks out (without the login).
- */
-async function accountCheckoutUrl() {
-  if (!customer.beforeCheckout) return null;
-  try {
-    return await customer.beforeCheckout();
-  } catch (error) {
-    reportError(error, 'account checkout');
-    return null;
-  }
-}
-
-/**
- * @param {string} cartId
- * @returns {Promise<string>}
- * @throws {TetherError} `ERROR` without a checkout URL (the cart is empty or Shopify no longer has it).
- */
-async function checkoutUrl(cartId) {
-  const cartAnswer = askCheckoutUrl(cartId);
-  let url = await accountCheckoutUrl();
-  if (!url) {
-    const answer = await cartAnswer;
-    if (answer.kind === 'failed') throw answer.error;
-    url = answer.url;
-  }
-  if (!url) throw new TetherError('No checkoutUrl (cart empty or expired)');
-  if (!customer.accessToken) return url;
-  return `${url}${url.includes('?') ? '&' : '?'}logged_in=true`;
-}
-
-/**
- * A new tab's `opener` gives the checkout page a handle on this one; a browser that doesn't let a script clear it
- * leaves the tab as it opened.
- *
- * @param {Window} tab
- */
-function detachOpenerIfAllowed(tab) {
-  try {
-    tab.opener = null;
-  } catch {
-    // The browser keeps `opener` read-only: see the function's comment.
-  }
-}
-
-/**
- * Goes to Shopify's checkout. With `_blank` the tab opens inside the click (Safari blocks `window.open` after an
- * await) and gets its URL once there is one.
- *
- * @param {CheckoutTarget} target
- * @returns {Promise<string | null>} The checkout URL, `null` with nothing to check out or after a reported failure.
- */
-export async function checkout(target = cfg.checkoutTarget) {
-  const cartId = savedCartId();
-  const cart = currentCart();
-  if (!cartId || (cart && !cart.totalQuantity)) return null;
-  const tab = target === '_blank' ? window.open('', '_blank') : null;
-  if (tab) detachOpenerIfAllowed(tab);
-  try {
-    const url = await checkoutUrl(cartId);
-    if (!isHttpsUrl(url)) throw new TetherError('The checkout URL is not https: not opened');
-    emit('checkout', { url, cart: currentCart() });
-    if (tab && !tab.closed) tab.location.href = url;
-    else window.location.href = url;
-    return url;
-  } catch (error) {
-    tab?.close();
-    reportError(error, 'checkout failed');
-    return null;
-  }
-}

package/src/cart/mutations.js

@@ -1,234 +0,0 @@
-/**
- * The Storefront Cart API: loading the saved cart, creating one, and the mutations that change it. Shopify forgets a
- * cart some days after its last change and once it has been checked out; a change that needs a cart then creates a
- * new one with the same input, so the visitor's click still lands.
- */
-import { cfg, log } from '../config.js';
-import { gql, unwrap, TetherError } from '../client.js';
-import { cartFragment } from '../fragments.js';
-import { GID } from '../selling-plans.js';
-import { toAttributes } from '../dom.js';
-import { customer, savedCartId, forgetSavedCart, setWarnings } from './store.js';
-/** @import { CartWarning } from '../config.js' */
-/** @import { UserError } from '../client.js' */
-/** @import { AttributeValue } from '../dom.js' */
-/** @import { ShopifyCart, Attribute } from './store.js' */
-
-/** @typedef {Record<string, AttributeValue> | { key: string | number, value?: AttributeValue }[]} Attributes */
-/**
- * @typedef {object} LineSpec A line to add, in any of the shapes `Cart.add` takes.
- * @property {string | number} [variantId]
- * @property {string | number} [merchandiseId]
- * @property {string | number} [id]
- * @property {number | string} [quantity]
- * @property {string | number | null} [sellingPlanId]
- * @property {string | number | null} [sellingPlan]
- * @property {Attributes | null} [attributes]
- */
-/**
- * @typedef {object} CartLineInput Shopify's `CartLineInput`.
- * @property {string} merchandiseId
- * @property {number} quantity
- * @property {string} [sellingPlanId]
- * @property {Attribute[]} [attributes]
- */
-/**
- * @typedef {object} CartPayload What every cart mutation answers.
- * @property {ShopifyCart | null} cart
- * @property {UserError[]} userErrors
- * @property {CartWarning[]} [warnings]
- */
-
-/**
- * Shopify answers a cart id it can't resolve, in a mutation, with a top-level GraphQL error whose only detail is
- * this message (no `extensions.code`). A user error on the `cartId` field is recognised by its shape instead.
- */
-const UNKNOWN_CART_MESSAGE = /does not exist|not found|invalid id/i;
-
-/**
- * @param {unknown} error
- * @returns {boolean} True when `error` says Shopify doesn't have the cart, false for any other failure (the network,
- *   the token, a line it refused), after which the saved cart is still good.
- */
-export function isCartGone(error) {
-  if (!(error instanceof TetherError)) return false;
-  if (error.userErrors?.some((userError) => userError.field?.[0] === 'cartId')) return true;
-  return (error.errors ?? []).some((graphQLError) => UNKNOWN_CART_MESSAGE.test(graphQLError.message));
-}
-
-/**
- * @param {string | number | LineSpec | null | undefined} input A variant id, or a line.
- * @param {number} [quantity] For a variant id.
- * @param {Omit<LineSpec, 'variantId' | 'quantity'>} [options] For a variant id.
- * @returns {CartLineInput}
- * @throws {TetherError} `ERROR` without a variant id.
- */
-export function toLineInput(input, quantity = 1, options = {}) {
-  const spec = typeof input === 'object' && input !== null ? input : { ...options, variantId: input, quantity };
-  const merchandiseId = GID.variant(spec.merchandiseId || spec.variantId || spec.id);
-  if (!merchandiseId) throw new TetherError('add(): variantId is required');
-  const asked = parseInt(String(spec.quantity ?? 1), 10);
-  /** @type {CartLineInput} */
-  const line = { merchandiseId, quantity: Math.max(1, asked || 1) };
-  const planId = GID.sellingPlan(spec.sellingPlanId || spec.sellingPlan);
-  if (planId) line.sellingPlanId = planId;
-  const attributes = toAttributes(spec.attributes);
-  if (attributes.length) line.attributes = attributes;
-  return line;
-}
-
-/**
- * @param {string} name The mutation, which is also its payload's field.
- * @param {string} args The operation's variable definitions.
- * @param {string} inner The mutation field's arguments.
- */
-function mutationText(name, args, inner) {
-  return `mutation Tether_${name}(${args}) {
-  ${name}(${inner}) { cart { ...TetherCart } userErrors { field message } warnings { code message target } }
-}
-${cartFragment()}`;
-}
-
-/**
- * @param {string} name
- * @param {string} args
- * @param {string} inner
- * @param {Record<string, unknown>} variables
- * @returns {Promise<ShopifyCart | null>} The cart in Shopify's answer, after keeping its warnings.
- * @throws {TetherError} For a failed request, or the mutation's user errors.
- */
-async function send(name, args, inner, variables) {
-  /** @type {Record<string, CartPayload | null | undefined>} */
-  const data = await gql(mutationText(name, args, inner), variables);
-  const payload = unwrap(data[name], name);
-  setWarnings(payload.warnings ?? []);
-  return payload.cart;
-}
-
-/**
- * A new cart in the visitor's market, for the logged-in customer if there is one.
- *
- * @param {Record<string, unknown>} input More of Shopify's `CartInput`, e.g. the first lines.
- * @returns {Promise<ShopifyCart | null>}
- */
-function createCart(input) {
-  const buyerIdentity = {
-    ...(cfg.country ? { countryCode: cfg.country.toUpperCase() } : {}),
-    ...(customer.accessToken ? { customerAccessToken: customer.accessToken } : {}),
-  };
-  const withIdentity = Object.keys(buyerIdentity).length ? { buyerIdentity, ...input } : input;
-  return send('cartCreate', '$input: CartInput!', 'input: $input', { input: withIdentity });
-}
-
-/**
- * @typedef {object} CartMutation A mutation on the saved cart.
- * @property {string} name The mutation, e.g. `cartLinesAdd`.
- * @property {string} args Its variable definitions besides `$cartId`.
- * @property {string} inner Its arguments besides `cartId`.
- * @property {Record<string, unknown>} variables
- * @property {Record<string, unknown> | null} createInput The `CartInput` of a new cart that does what the mutation
- *   asks, when there is no cart (or Shopify no longer has it); `null` leaves the visitor without a cart instead.
- */
-
-/**
- * Runs a mutation on the saved cart, or creates a cart from `createInput` when there is none to change.
- *
- * @param {CartMutation} mutation
- * @returns {Promise<ShopifyCart | null>} The changed cart; `null` without a cart and without a `createInput`.
- * @throws {TetherError} For a failed request or Shopify's user errors; also when the cart is gone and there is no
- *   `createInput` (the saved cart is forgotten first).
- */
-export async function mutateCart({ name, args, inner, variables, createInput }) {
-  const cartId = savedCartId();
-  if (!cartId) return createInput ? createCart(createInput) : null;
-  try {
-    return await send(name, `$cartId: ID!, ${args}`, `cartId: $cartId, ${inner}`, { ...variables, cartId });
-  } catch (error) {
-    if (!isCartGone(error)) throw error;
-    forgetSavedCart();
-    if (!createInput) throw error;
-    log('cart expired, creating a new one');
-    return createCart(createInput);
-  }
-}
-
-/**
- * @param {string} id
- * @returns {Promise<ShopifyCart | null>} The cart, `null` when Shopify doesn't have it (expired or checked out).
- */
-export async function fetchCart(id) {
-  /** @type {{ cart: ShopifyCart | null }} */
-  const data = await gql(`query TetherCart($id: ID!) { cart(id: $id) { ...TetherCart } }\n${cartFragment()}`, { id });
-  return data.cart;
-}
-
-/**
- * @param {string} id
- * @returns {Promise<string | null>} The cart's current checkout URL, `null` when Shopify doesn't have the cart.
- */
-export async function fetchCheckoutUrl(id) {
-  /** @type {{ cart: { checkoutUrl: string } | null }} */
-  const data = await gql('query TetherCheckout($id: ID!) { cart(id: $id) { checkoutUrl } }', { id });
-  return data.cart?.checkoutUrl ?? null;
-}
-
-/**
- * @typedef {object} LinePatch A change to one line, for `updateLine`.
- * @property {number} [quantity] 0 or less removes the line.
- * @property {string | number | null} [sellingPlanId] `null` switches the line back to one-time purchase.
- * @property {Attributes} [attributes]
- * @property {string | number} [merchandiseId]
- * @property {string | number} [variantId]
- */
-
-/**
- * @param {string} lineId
- * @param {number | LinePatch} patch
- * @returns {Record<string, unknown>} Shopify's `CartLineUpdateInput`.
- */
-export function toLineUpdate(lineId, patch) {
-  const change = typeof patch === 'number' ? { quantity: patch } : patch;
-  /** @type {Record<string, unknown>} */
-  const line = { id: lineId };
-  if (change.quantity !== undefined) line['quantity'] = change.quantity;
-  if ('sellingPlanId' in change)
-    line['sellingPlanId'] = change.sellingPlanId ? GID.sellingPlan(change.sellingPlanId) : null;
-  if (change.attributes) line['attributes'] = toAttributes(change.attributes);
-  const variantId = change.merchandiseId || change.variantId;
-  if (variantId) line['merchandiseId'] = GID.variant(variantId);
-  return line;
-}
-
-/**
- * @param {Record<string, unknown>[]} lines
- * @returns {Promise<ShopifyCart | null>}
- */
-export const updateLines = (lines) =>
-  mutateCart({
-    name: 'cartLinesUpdate',
-    args: '$lines: [CartLineUpdateInput!]!',
-    inner: 'lines: $lines',
-    variables: { lines },
-    createInput: null,
-  });
-
-/**
- * @param {string[]} lineIds
- * @returns {Promise<ShopifyCart | null>}
- */
-export const removeLines = (lineIds) =>
-  mutateCart({
-    name: 'cartLinesRemove',
-    args: '$lineIds: [ID!]!',
-    inner: 'lineIds: $lineIds',
-    variables: { lineIds },
-    createInput: null,
-  });
-
-/**
- * @param {string} lineId
- * @param {number} target
- * @returns {Promise<ShopifyCart | null>} The cart once `lineId` has `target` (0 removes it).
- */
-export const setLineQuantity = (lineId, target) =>
-  target > 0 ? updateLines([{ id: lineId, quantity: target }]) : removeLines([lineId]);