UNPKG

use-shopify

Version:

React hooks to work with Shopify's Storefront API

656 lines (625 loc) 46.9 kB
'use strict'; Object.defineProperty(exports, '__esModule', { value: true }); function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; } var React = require('react'); var gql = _interopDefault(require('graphql-tag')); var Cookies = _interopDefault(require('js-cookie')); var m = require('@thi.ng/memoize'); var unwindEdges = require('@good-idea/unwind-edges'); /*! ***************************************************************************** Copyright (c) Microsoft Corporation. Permission to use, copy, modify, and/or distribute this software for any purpose with or without fee is hereby granted. THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT, INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR PERFORMANCE OF THIS SOFTWARE. ***************************************************************************** */ var __assign = function() { __assign = Object.assign || function __assign(t) { for (var s, i = 1, n = arguments.length; i < n; i++) { s = arguments[i]; for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p]; } return t; }; return __assign.apply(this, arguments); }; function __awaiter(thisArg, _arguments, P, generator) { function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); } return new (P || (P = Promise))(function (resolve, reject) { function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } } function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } } function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); } step((generator = generator.apply(thisArg, _arguments || [])).next()); }); } function __generator(thisArg, body) { var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g; return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g; function verb(n) { return function (v) { return step([n, v]); }; } function step(op) { if (f) throw new TypeError("Generator is already executing."); while (_) try { if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t; if (y = 0, t) op = [op[0] & 2, t.value]; switch (op[0]) { case 0: case 1: t = op; break; case 4: _.label++; return { value: op[1], done: false }; case 5: _.label++; y = op[1]; op = [0]; continue; case 7: op = _.ops.pop(); _.trys.pop(); continue; default: if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; } if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; } if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; } if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; } if (t[2]) _.ops.pop(); _.trys.pop(); continue; } op = body.call(thisArg, _); } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; } if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true }; } } function __spreadArrays() { for (var s = 0, i = 0, il = arguments.length; i < il; i++) s += arguments[i].length; for (var r = Array(s), k = 0, i = 0; i < il; i++) for (var a = arguments[i], j = 0, jl = a.length; j < jl; j++, k++) r[k] = a[j]; return r; } function __makeTemplateObject(cooked, raw) { if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; } return cooked; } var moneyV2Fragment = gql(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n fragment MoneyV2Fragment on MoneyV2 {\n __typename\n amount\n currencyCode\n }\n"], ["\n fragment MoneyV2Fragment on MoneyV2 {\n __typename\n amount\n currencyCode\n }\n"]))); var imageFragment = gql(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n fragment ImageFragment on Image {\n __typename\n altText\n id\n originalSrc\n }\n"], ["\n fragment ImageFragment on Image {\n __typename\n altText\n id\n originalSrc\n }\n"]))); var collectionFragment = gql(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n fragment CollectionFragment on Collection {\n __typename\n description\n descriptionHtml\n handle\n id\n image {\n ...ImageFragment\n }\n title\n updatedAt\n }\n ", "\n"], ["\n fragment CollectionFragment on Collection {\n __typename\n description\n descriptionHtml\n handle\n id\n image {\n ...ImageFragment\n }\n title\n updatedAt\n }\n ", "\n"])), imageFragment); var productWithoutVariantsFragment = gql(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n fragment ProductWithoutVariantsFragment on Product {\n __typename\n availableForSale\n createdAt\n description\n descriptionHtml\n handle\n id\n productType\n publishedAt\n tags\n title\n vendor\n images(first: 100) {\n __typename\n edges {\n __typename\n node {\n ...ImageFragment\n }\n }\n }\n options(first: 100) {\n __typename\n id\n name\n values\n }\n priceRange {\n __typename\n maxVariantPrice {\n ...MoneyV2Fragment\n }\n minVariantPrice {\n ...MoneyV2Fragment\n }\n }\n }\n\n ", "\n ", "\n"], ["\n fragment ProductWithoutVariantsFragment on Product {\n __typename\n availableForSale\n createdAt\n description\n descriptionHtml\n handle\n id\n productType\n publishedAt\n tags\n title\n vendor\n images(first: 100) {\n __typename\n edges {\n __typename\n node {\n ...ImageFragment\n }\n }\n }\n options(first: 100) {\n __typename\n id\n name\n values\n }\n priceRange {\n __typename\n maxVariantPrice {\n ...MoneyV2Fragment\n }\n minVariantPrice {\n ...MoneyV2Fragment\n }\n }\n }\n\n ", "\n ", "\n"])), imageFragment, moneyV2Fragment); var variantWithProductFragment = gql(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n fragment VariantWithProductFragment on ProductVariant {\n __typename\n id\n sku\n title\n weight\n weightUnit\n compareAtPriceV2 {\n ...MoneyV2Fragment\n }\n priceV2 {\n ...MoneyV2Fragment\n }\n product {\n ...ProductWithoutVariantsFragment\n }\n image {\n ...ImageFragment\n }\n requiresShipping\n selectedOptions {\n __typename\n name\n value\n }\n }\n ", "\n ", "\n ", "\n"], ["\n fragment VariantWithProductFragment on ProductVariant {\n __typename\n id\n sku\n title\n weight\n weightUnit\n compareAtPriceV2 {\n ...MoneyV2Fragment\n }\n priceV2 {\n ...MoneyV2Fragment\n }\n product {\n ...ProductWithoutVariantsFragment\n }\n image {\n ...ImageFragment\n }\n requiresShipping\n selectedOptions {\n __typename\n name\n value\n }\n }\n ", "\n ", "\n ", "\n"])), moneyV2Fragment, productWithoutVariantsFragment, imageFragment); var variantFragment = gql(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n fragment VariantFragment on ProductVariant {\n __typename\n availableForSale\n id\n sku\n title\n weight\n weightUnit\n compareAtPriceV2 {\n ...MoneyV2Fragment\n }\n priceV2 {\n ...MoneyV2Fragment\n }\n requiresShipping\n selectedOptions {\n __typename\n name\n value\n }\n image {\n ...ImageFragment\n }\n }\n ", "\n ", "\n"], ["\n fragment VariantFragment on ProductVariant {\n __typename\n availableForSale\n id\n sku\n title\n weight\n weightUnit\n compareAtPriceV2 {\n ...MoneyV2Fragment\n }\n priceV2 {\n ...MoneyV2Fragment\n }\n requiresShipping\n selectedOptions {\n __typename\n name\n value\n }\n image {\n ...ImageFragment\n }\n }\n ", "\n ", "\n"])), moneyV2Fragment, imageFragment); var productFragment = gql(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n fragment ProductFragment on Product {\n __typename\n availableForSale\n createdAt\n description\n descriptionHtml\n handle\n id\n productType\n publishedAt\n tags\n title\n vendor\n images(first: 100) {\n __typename\n edges {\n __typename\n node {\n ...ImageFragment\n }\n }\n }\n options(first: 100) {\n __typename\n id\n name\n values\n }\n priceRange {\n __typename\n maxVariantPrice {\n ...MoneyV2Fragment\n }\n minVariantPrice {\n ...MoneyV2Fragment\n }\n }\n variants(first: 100) {\n __typename\n pageInfo {\n __typename\n hasNextPage\n hasPreviousPage\n }\n edges {\n __typename\n node {\n ...VariantFragment\n }\n }\n }\n }\n\n ", "\n ", "\n ", "\n"], ["\n fragment ProductFragment on Product {\n __typename\n availableForSale\n createdAt\n description\n descriptionHtml\n handle\n id\n productType\n publishedAt\n tags\n title\n vendor\n images(first: 100) {\n __typename\n edges {\n __typename\n node {\n ...ImageFragment\n }\n }\n }\n options(first: 100) {\n __typename\n id\n name\n values\n }\n priceRange {\n __typename\n maxVariantPrice {\n ...MoneyV2Fragment\n }\n minVariantPrice {\n ...MoneyV2Fragment\n }\n }\n variants(first: 100) {\n __typename\n pageInfo {\n __typename\n hasNextPage\n hasPreviousPage\n }\n edges {\n __typename\n node {\n ...VariantFragment\n }\n }\n }\n }\n\n ", "\n ", "\n ", "\n"])), imageFragment, moneyV2Fragment, variantFragment); var discountApplicationFragment = gql(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n fragment DiscountApplicationFragment on DiscountApplication {\n __typename\n allocationMethod\n targetSelection\n targetType\n ... on DiscountCodeApplication {\n __typename\n code\n applicable\n }\n value {\n ... on PricingPercentageValue {\n __typename\n percentage\n }\n ... on MoneyV2 {\n ...MoneyV2Fragment\n }\n }\n }\n ", "\n"], ["\n fragment DiscountApplicationFragment on DiscountApplication {\n __typename\n allocationMethod\n targetSelection\n targetType\n ... on DiscountCodeApplication {\n __typename\n code\n applicable\n }\n value {\n ... on PricingPercentageValue {\n __typename\n percentage\n }\n ... on MoneyV2 {\n ...MoneyV2Fragment\n }\n }\n }\n ", "\n"])), moneyV2Fragment); var lineItemFragment = gql(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n fragment LineItemFragment on CheckoutLineItem {\n __typename\n id\n quantity\n title\n discountAllocations {\n __typename\n allocatedAmount {\n ...MoneyV2Fragment\n }\n discountApplication {\n ...DiscountApplicationFragment\n }\n }\n variant {\n ...VariantWithProductFragment\n }\n }\n ", "\n ", "\n"], ["\n fragment LineItemFragment on CheckoutLineItem {\n __typename\n id\n quantity\n title\n discountAllocations {\n __typename\n allocatedAmount {\n ...MoneyV2Fragment\n }\n discountApplication {\n ...DiscountApplicationFragment\n }\n }\n variant {\n ...VariantWithProductFragment\n }\n }\n ", "\n ", "\n"])), discountApplicationFragment, variantWithProductFragment); var checkoutFragment = gql(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n fragment CheckoutFragment on Checkout {\n __typename\n id\n paymentDueV2 {\n ...MoneyV2Fragment\n }\n webUrl\n completedAt\n shippingLine {\n __typename\n handle\n price\n title\n }\n email\n discountApplications(first: 100) {\n __typename\n pageInfo {\n __typename\n hasNextPage\n hasPreviousPage\n }\n edges {\n __typename\n cursor\n node {\n ...DiscountApplicationFragment\n }\n }\n }\n lineItems(first: 100) {\n __typename\n pageInfo {\n __typename\n hasNextPage\n hasPreviousPage\n }\n edges {\n __typename\n cursor\n node {\n ...LineItemFragment\n }\n }\n }\n }\n\n ", "\n ", "\n ", "\n"], ["\n fragment CheckoutFragment on Checkout {\n __typename\n id\n paymentDueV2 {\n ...MoneyV2Fragment\n }\n webUrl\n completedAt\n shippingLine {\n __typename\n handle\n price\n title\n }\n email\n discountApplications(first: 100) {\n __typename\n pageInfo {\n __typename\n hasNextPage\n hasPreviousPage\n }\n edges {\n __typename\n cursor\n node {\n ...DiscountApplicationFragment\n }\n }\n }\n lineItems(first: 100) {\n __typename\n pageInfo {\n __typename\n hasNextPage\n hasPreviousPage\n }\n edges {\n __typename\n cursor\n node {\n ...LineItemFragment\n }\n }\n }\n }\n\n ", "\n ", "\n ", "\n"])), moneyV2Fragment, discountApplicationFragment, lineItemFragment); var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10; var CHECKOUT_CREATE = gql(templateObject_1$1 || (templateObject_1$1 = __makeTemplateObject(["\n mutation CheckoutCreate(\n $email: String\n $lineItems: [CheckoutLineItemInput!]\n $shippingAddress: MailingAddressInput\n $note: String\n $customAttributes: [AttributeInput!]\n $allowPartialAddresses: Boolean\n ) {\n checkoutCreate(\n input: {\n email: $email\n lineItems: $lineItems\n shippingAddress: $shippingAddress\n note: $note\n customAttributes: $customAttributes\n allowPartialAddresses: $allowPartialAddresses\n }\n ) {\n checkoutUserErrors {\n __typename\n code\n field\n }\n checkout {\n ...CheckoutFragment\n }\n }\n }\n ", "\n"], ["\n mutation CheckoutCreate(\n $email: String\n $lineItems: [CheckoutLineItemInput!]\n $shippingAddress: MailingAddressInput\n $note: String\n $customAttributes: [AttributeInput!]\n $allowPartialAddresses: Boolean\n ) {\n checkoutCreate(\n input: {\n email: $email\n lineItems: $lineItems\n shippingAddress: $shippingAddress\n note: $note\n customAttributes: $customAttributes\n allowPartialAddresses: $allowPartialAddresses\n }\n ) {\n checkoutUserErrors {\n __typename\n code\n field\n }\n checkout {\n ...CheckoutFragment\n }\n }\n }\n ", "\n"])), checkoutFragment); var templateObject_1$1; var CHECKOUT_DISCOUNT_CODE_APPLY = gql(templateObject_1$2 || (templateObject_1$2 = __makeTemplateObject(["\n mutation CheckoutDiscountCodeApplyV2(\n $checkoutId: ID!\n $discountCode: String!\n ) {\n checkoutDiscountCodeApplyV2(\n checkoutId: $checkoutId\n discountCode: $discountCode\n ) {\n checkoutUserErrors {\n __typename\n code\n field\n message\n }\n checkout {\n ...CheckoutFragment\n }\n }\n }\n ", "\n"], ["\n mutation CheckoutDiscountCodeApplyV2(\n $checkoutId: ID!\n $discountCode: String!\n ) {\n checkoutDiscountCodeApplyV2(\n checkoutId: $checkoutId\n discountCode: $discountCode\n ) {\n checkoutUserErrors {\n __typename\n code\n field\n message\n }\n checkout {\n ...CheckoutFragment\n }\n }\n }\n ", "\n"])), checkoutFragment); var templateObject_1$2; var CHECKOUT_DISCOUNT_CODE_REMOVE = gql(templateObject_1$3 || (templateObject_1$3 = __makeTemplateObject(["\n mutation CheckoutDiscountCodeRemove($checkoutId: ID!) {\n checkoutDiscountCodeRemove(checkoutId: $checkoutId) {\n checkoutUserErrors {\n __typename\n code\n field\n message\n }\n checkout {\n ...CheckoutFragment\n }\n }\n }\n\n ", "\n"], ["\n mutation CheckoutDiscountCodeRemove($checkoutId: ID!) {\n checkoutDiscountCodeRemove(checkoutId: $checkoutId) {\n checkoutUserErrors {\n __typename\n code\n field\n message\n }\n checkout {\n ...CheckoutFragment\n }\n }\n }\n\n ", "\n"])), checkoutFragment); var templateObject_1$3; var CHECKOUT_LINE_ITEMS_UPDATE = gql(templateObject_1$4 || (templateObject_1$4 = __makeTemplateObject(["\n mutation CheckoutLineItemsUpdate(\n $checkoutId: ID!\n $lineItems: [CheckoutLineItemUpdateInput!]!\n ) {\n checkoutLineItemsUpdate(checkoutId: $checkoutId, lineItems: $lineItems) {\n checkoutUserErrors {\n __typename\n code\n field\n message\n }\n checkout {\n ...CheckoutFragment\n }\n }\n }\n ", "\n"], ["\n mutation CheckoutLineItemsUpdate(\n $checkoutId: ID!\n $lineItems: [CheckoutLineItemUpdateInput!]!\n ) {\n checkoutLineItemsUpdate(checkoutId: $checkoutId, lineItems: $lineItems) {\n checkoutUserErrors {\n __typename\n code\n field\n message\n }\n checkout {\n ...CheckoutFragment\n }\n }\n }\n ", "\n"])), checkoutFragment); var templateObject_1$4; var CHECKOUT_LINE_ITEMS_ADD = gql(templateObject_1$5 || (templateObject_1$5 = __makeTemplateObject(["\n mutation CheckoutLineItemsAdd(\n $checkoutId: ID!\n $lineItems: [CheckoutLineItemInput!]!\n ) {\n checkoutLineItemsAdd(checkoutId: $checkoutId, lineItems: $lineItems) {\n checkoutUserErrors {\n __typename\n code\n field\n message\n }\n checkout {\n ...CheckoutFragment\n }\n }\n }\n ", "\n"], ["\n mutation CheckoutLineItemsAdd(\n $checkoutId: ID!\n $lineItems: [CheckoutLineItemInput!]!\n ) {\n checkoutLineItemsAdd(checkoutId: $checkoutId, lineItems: $lineItems) {\n checkoutUserErrors {\n __typename\n code\n field\n message\n }\n checkout {\n ...CheckoutFragment\n }\n }\n }\n ", "\n"])), checkoutFragment); var templateObject_1$5; var CHECKOUT_FETCH = gql(templateObject_1$6 || (templateObject_1$6 = __makeTemplateObject(["\n query CheckoutQuery($id: ID!) {\n node(id: $id) {\n id\n ... on Checkout {\n ...CheckoutFragment\n }\n }\n }\n ", "\n"], ["\n query CheckoutQuery($id: ID!) {\n node(id: $id) {\n id\n ... on Checkout {\n ...CheckoutFragment\n }\n }\n }\n ", "\n"])), checkoutFragment); var templateObject_1$6; var CHECKOUT_ATTRIBUTES_UPDATE = gql(templateObject_1$7 || (templateObject_1$7 = __makeTemplateObject(["\n mutation AddNote($checkoutId: ID!, $input: CheckoutAttributesUdpateV2Input!) {\n checkoutAttributesUpdateV2(checkoutId: $checkoutId, input: $input) {\n checkoutUserErrors {\n __typename\n code\n field\n message\n }\n checkout {\n ...CheckoutFragment\n }\n }\n }\n ", "\n"], ["\n mutation AddNote($checkoutId: ID!, $input: CheckoutAttributesUdpateV2Input!) {\n checkoutAttributesUpdateV2(checkoutId: $checkoutId, input: $input) {\n checkoutUserErrors {\n __typename\n code\n field\n message\n }\n checkout {\n ...CheckoutFragment\n }\n }\n }\n ", "\n"])), checkoutFragment); var templateObject_1$7; var defaultQueries = { CHECKOUT_CREATE: CHECKOUT_CREATE, CHECKOUT_DISCOUNT_CODE_REMOVE: CHECKOUT_DISCOUNT_CODE_REMOVE, CHECKOUT_DISCOUNT_CODE_APPLY: CHECKOUT_DISCOUNT_CODE_APPLY, CHECKOUT_LINE_ITEMS_UPDATE: CHECKOUT_LINE_ITEMS_UPDATE, CHECKOUT_LINE_ITEMS_ADD: CHECKOUT_LINE_ITEMS_ADD, CHECKOUT_FETCH: CHECKOUT_FETCH, CHECKOUT_ATTRIBUTES_UPDATE: CHECKOUT_ATTRIBUTES_UPDATE, }; var STARTED_REQUEST = 'STARTED_REQUEST'; var FETCHED_CHECKOUT = 'FETCHED_CHECKOUT'; var CREATED_CHECKOUT = 'CREATED_CHECKOUT'; var APPLIED_DISCOUNT = 'APPLIED_DISCOUNT'; var REMOVED_DISCOUNT = 'REMOVED_DISCOUNT'; var ADDED_LINE_ITEMS = 'ADDED_LINE_ITEMS'; var UPDATED_LINE_ITEMS = 'UPDATED_LINE_ITEMS'; var RECEIVED_ERRORS = 'RECEIVED_ERRORS'; var CART_CLEARED = 'RECEIVED_ERRORS'; var reducer = function (state, action) { switch (action.type) { case STARTED_REQUEST: return __assign(__assign({}, state), { loading: true }); case CART_CLEARED: return __assign(__assign({}, state), { checkout: undefined, checkoutUserErrors: [], loading: false, ready: true }); case FETCHED_CHECKOUT: case CREATED_CHECKOUT: case APPLIED_DISCOUNT: case REMOVED_DISCOUNT: case ADDED_LINE_ITEMS: case UPDATED_LINE_ITEMS: case RECEIVED_ERRORS: var checkoutUserErrors = action.checkoutUserErrors, checkout = action.checkout; return __assign(__assign({}, state), { checkoutUserErrors: checkoutUserErrors || [], checkout: checkout, loading: false, ready: true }); default: return state; } }; var VIEWER_CART_TOKEN = '_shopify_cart'; var setCookie = function (key, val, config) { if (val === undefined) return; var defaults = { expires: 7, path: '/', }; var settings = __assign(__assign({}, defaults), config); var stringified = JSON.stringify(val); Cookies.set(key, stringified, settings); }; var getCookie = function (key) { var value = Cookies.get(key); if (value) return JSON.parse(value); return null; }; // export const removeData = (key: string, forceCookie: boolean): mixed => {}; var useReducer = React.useReducer, useEffect = React.useEffect; /** * Setup */ var initialState = { ready: false, loading: true, checkoutUserErrors: [], checkout: undefined, }; /** * Helper Functions */ var setViewerCartCookie = function (token) { return setCookie(VIEWER_CART_TOKEN, token); }; var getViewerCartCookie = function () { return getCookie(VIEWER_CART_TOKEN); }; var useCheckout = function (_a) { var userQueries = _a.queries, query = _a.query; var _b = __assign(__assign({}, defaultQueries), userQueries), CHECKOUT_CREATE = _b.CHECKOUT_CREATE, CHECKOUT_FETCH = _b.CHECKOUT_FETCH, CHECKOUT_DISCOUNT_CODE_APPLY = _b.CHECKOUT_DISCOUNT_CODE_APPLY, CHECKOUT_DISCOUNT_CODE_REMOVE = _b.CHECKOUT_DISCOUNT_CODE_REMOVE, CHECKOUT_LINE_ITEMS_ADD = _b.CHECKOUT_LINE_ITEMS_ADD, CHECKOUT_LINE_ITEMS_UPDATE = _b.CHECKOUT_LINE_ITEMS_UPDATE; /** * State */ var _c = useReducer(reducer, initialState), state = _c[0], dispatch = _c[1]; /** * Base Methods * * These methods query the Shopify API. Their names should match the names of the * available queries & mutations. * */ var checkoutCreate = function (variables) { return __awaiter(void 0, void 0, void 0, function () { var result, checkoutCreateResponse; return __generator(this, function (_a) { switch (_a.label) { case 0: if (state.checkout) return [2 /*return*/, { checkout: state.checkout }]; return [4 /*yield*/, query(CHECKOUT_CREATE, variables || {})]; case 1: result = _a.sent(); checkoutCreateResponse = result.data.checkoutCreate; if (checkoutCreateResponse.checkout) setViewerCartCookie(checkoutCreateResponse.checkout.id); dispatch(__assign({ type: CREATED_CHECKOUT }, checkoutCreateResponse)); return [2 /*return*/, checkoutCreateResponse]; } }); }); }; var getOrCreateCheckout = function (variables) { return __awaiter(void 0, void 0, void 0, function () { return __generator(this, function (_a) { return [2 /*return*/, state.checkout ? { checkout: state.checkout, checkoutUserErrors: state.checkoutUserErrors, } : checkoutCreate(variables)]; }); }); }; var fetchCheckout = function () { return __awaiter(void 0, void 0, void 0, function () { var checkoutToken, variables, result, checkout; return __generator(this, function (_a) { switch (_a.label) { case 0: checkoutToken = getViewerCartCookie(); if (!checkoutToken) return [3 /*break*/, 2]; variables = { id: checkoutToken }; return [4 /*yield*/, query(CHECKOUT_FETCH, variables)]; case 1: result = _a.sent(); checkout = result.data ? result.data.node : undefined; dispatch({ type: FETCHED_CHECKOUT, checkout: checkout }); return [3 /*break*/, 3]; case 2: /* When no token exists, dispatch this to set "loading" to false. */ /* This might deserve its own action type, "NOTHING_TO_FETCH" */ dispatch({ type: FETCHED_CHECKOUT, checkout: undefined }); _a.label = 3; case 3: return [2 /*return*/]; } }); }); }; var checkoutLineItemsAdd = function (lineItems) { return __awaiter(void 0, void 0, void 0, function () { var checkout, variables, result; return __generator(this, function (_a) { switch (_a.label) { case 0: return [4 /*yield*/, getOrCreateCheckout()]; case 1: checkout = (_a.sent()).checkout; if (!checkout) throw new Error('checkoutLineItemsAdd was called before a checkout was created.'); dispatch({ type: STARTED_REQUEST }); variables = { lineItems: lineItems, checkoutId: checkout.id }; return [4 /*yield*/, query(CHECKOUT_LINE_ITEMS_ADD, variables)]; case 2: result = _a.sent(); dispatch(__assign({ type: ADDED_LINE_ITEMS }, result.data.checkoutLineItemsAdd)); return [2 /*return*/]; } }); }); }; var checkoutLineItemsUpdate = function (lineItems) { return __awaiter(void 0, void 0, void 0, function () { var checkout, result; return __generator(this, function (_a) { switch (_a.label) { case 0: return [4 /*yield*/, getOrCreateCheckout()]; case 1: checkout = (_a.sent()).checkout; if (!checkout) throw new Error('There is no checkout to update'); dispatch({ type: STARTED_REQUEST }); return [4 /*yield*/, query(CHECKOUT_LINE_ITEMS_UPDATE, { lineItems: lineItems, checkoutId: checkout.id, })]; case 2: result = _a.sent(); dispatch(__assign({ type: UPDATED_LINE_ITEMS }, result.data.checkoutLineItemsUpdate)); return [2 /*return*/]; } }); }); }; var checkoutDiscountCodeApply = function (discountCode) { return __awaiter(void 0, void 0, void 0, function () { var checkout, result; return __generator(this, function (_a) { switch (_a.label) { case 0: return [4 /*yield*/, getOrCreateCheckout()]; case 1: checkout = (_a.sent()).checkout; if (!checkout) throw new Error('checkoutDiscountCodeApply was called before a checkout was created.'); dispatch({ type: STARTED_REQUEST }); return [4 /*yield*/, query(CHECKOUT_DISCOUNT_CODE_APPLY, { checkoutId: checkout.id, discountCode: discountCode, })]; case 2: result = _a.sent(); dispatch(__assign({ type: APPLIED_DISCOUNT }, result.data.checkoutDiscountCodeApplyV2)); return [2 /*return*/]; } }); }); }; var checkoutDiscountCodeRemove = function () { return __awaiter(void 0, void 0, void 0, function () { var checkout, result; return __generator(this, function (_a) { switch (_a.label) { case 0: return [4 /*yield*/, getOrCreateCheckout()]; case 1: checkout = (_a.sent()).checkout; if (!checkout) throw new Error('checkoutDiscountCodeRemove was called before a checkout was created.'); dispatch({ type: STARTED_REQUEST }); return [4 /*yield*/, query(CHECKOUT_DISCOUNT_CODE_REMOVE, { checkoutId: checkout.id, })]; case 2: result = _a.sent(); dispatch(__assign({ type: REMOVED_DISCOUNT }, result.data.checkoutDiscountCodeRemove)); return [2 /*return*/]; } }); }); }; var checkoutAttributesUpdate = function (input) { return __awaiter(void 0, void 0, void 0, function () { var checkout, result; return __generator(this, function (_a) { switch (_a.label) { case 0: return [4 /*yield*/, getOrCreateCheckout()]; case 1: checkout = (_a.sent()).checkout; if (!checkout) throw new Error('checkoutDiscountCodeApply was called before a checkout was created.'); dispatch({ type: STARTED_REQUEST }); return [4 /*yield*/, query(CHECKOUT_DISCOUNT_CODE_APPLY, { checkoutId: checkout.id, input: input, })]; case 2: result = _a.sent(); dispatch(__assign({ type: APPLIED_DISCOUNT }, result.data.checkoutAttributesUpdateV2)); return [2 /*return*/]; } }); }); }; /** * Shortcut Methods * * These methods implement the base methods to provide simpler "shortcut" * functions with a simpler API */ /* Adds a single line item to the checkout */ var addLineItem = function (lineItem) { return __awaiter(void 0, void 0, void 0, function () { return __generator(this, function (_a) { return [2 /*return*/, checkoutLineItemsAdd([lineItem]) /* Updates a single line item */ ]; }); }); }; /* Updates a single line item */ var updateLineItem = function (lineItem) { return __awaiter(void 0, void 0, void 0, function () { return __generator(this, function (_a) { return [2 /*return*/, checkoutLineItemsUpdate([lineItem])]; }); }); }; var addNote = function (note) { return checkoutAttributesUpdate({ note: note }); }; /* Clears the cart */ var clearCheckout = function () { return __awaiter(void 0, void 0, void 0, function () { return __generator(this, function (_a) { return [2 /*return*/, dispatch({ type: CART_CLEARED }) /** * Effects */ ]; }); }); }; /** * Effects */ useEffect(function () { fetchCheckout(); }, []); // fetch the checkout on load var value = __assign(__assign({}, state), { /* Base Methods */ checkoutCreate: checkoutCreate, checkoutLineItemsAdd: checkoutLineItemsAdd, checkoutLineItemsUpdate: checkoutLineItemsUpdate, checkoutDiscountCodeApply: checkoutDiscountCodeApply, checkoutDiscountCodeRemove: checkoutDiscountCodeRemove, checkoutAttributesUpdate: checkoutAttributesUpdate, /* Shortcut Methods */ addLineItem: addLineItem, updateLineItem: updateLineItem, clearCheckout: clearCheckout, addNote: addNote }); return value; }; var debounce = function (func, waitFor) { var timeout; var debounced = function () { var args = []; for (var _i = 0; _i < arguments.length; _i++) { args[_i] = arguments[_i]; } clearTimeout(timeout); timeout = setTimeout(function () { return func.apply(void 0, args); }, waitFor); }; return debounced; }; // TODO: Break this into two queries var SEARCH_QUERY = gql(templateObject_1$8 || (templateObject_1$8 = __makeTemplateObject(["\n query SearchQuery(\n $productFirst: Int!\n $productAfter: String\n $productLast: Int\n $productBefore: String\n $productReverse: Boolean\n $productSortKey: ProductSortKeys\n $productQuery: String!\n $collectionFirst: Int!\n $collectionAfter: String\n $collectionLast: Int\n $collectionBefore: String\n $collectionReverse: Boolean\n $collectionSortKey: CollectionSortKeys\n $collectionQuery: String!\n ) {\n products(\n first: $productFirst\n after: $productAfter\n last: $productLast\n before: $productBefore\n reverse: $productReverse\n sortKey: $productSortKey\n query: $productQuery\n ) {\n pageInfo {\n hasNextPage\n hasPreviousPage\n }\n edges {\n cursor\n node {\n ...ProductFragment\n }\n }\n }\n\n collections(\n first: $collectionFirst\n after: $collectionAfter\n last: $collectionLast\n before: $collectionBefore\n reverse: $collectionReverse\n sortKey: $collectionSortKey\n query: $collectionQuery\n ) {\n pageInfo {\n hasNextPage\n hasPreviousPage\n }\n edges {\n cursor\n node {\n ...CollectionFragment\n }\n }\n }\n }\n ", "\n ", "\n"], ["\n query SearchQuery(\n $productFirst: Int!\n $productAfter: String\n $productLast: Int\n $productBefore: String\n $productReverse: Boolean\n $productSortKey: ProductSortKeys\n $productQuery: String!\n $collectionFirst: Int!\n $collectionAfter: String\n $collectionLast: Int\n $collectionBefore: String\n $collectionReverse: Boolean\n $collectionSortKey: CollectionSortKeys\n $collectionQuery: String!\n ) {\n products(\n first: $productFirst\n after: $productAfter\n last: $productLast\n before: $productBefore\n reverse: $productReverse\n sortKey: $productSortKey\n query: $productQuery\n ) {\n pageInfo {\n hasNextPage\n hasPreviousPage\n }\n edges {\n cursor\n node {\n ...ProductFragment\n }\n }\n }\n\n collections(\n first: $collectionFirst\n after: $collectionAfter\n last: $collectionLast\n before: $collectionBefore\n reverse: $collectionReverse\n sortKey: $collectionSortKey\n query: $collectionQuery\n ) {\n pageInfo {\n hasNextPage\n hasPreviousPage\n }\n edges {\n cursor\n node {\n ...CollectionFragment\n }\n }\n }\n }\n ", "\n ", "\n"])), productFragment, collectionFragment); var defaultQueries$1 = { SEARCH_QUERY: SEARCH_QUERY }; var templateObject_1$8; var NEW_SEARCH = 'NEW_SEARCH'; var SET_SEARCH_TERM = 'SET_SEARCH_TERM'; var FETCH_MORE = 'FETCH_MORE'; var FETCHED_RESULTS = 'FETCHED_RESULTS'; var RESET = 'RESET'; var initialState$1 = { searchTerm: '', loading: false, results: [], products: [], collections: [], hasMoreResults: false, stale: false, lastSearchTerm: undefined, }; var reducer$1 = function (state, action) { switch (action.type) { case NEW_SEARCH: return __assign(__assign({}, state), { searchTerm: action.searchTerm ? action.searchTerm : state.searchTerm, results: [], products: [], collections: [], lastSearchTerm: action.searchTerm ? action.searchTerm : state.searchTerm, loading: true }); case SET_SEARCH_TERM: return __assign(__assign({}, state), { searchTerm: action.searchTerm, stale: action.searchTerm === state.lastSearchTerm }); case FETCH_MORE: return __assign(__assign({}, state), { loading: true }); case FETCHED_RESULTS: var results = action.results; var products = results.products ? unwindEdges.unwindEdges(results.products)[0] : []; var collections = results.collections ? unwindEdges.unwindEdges(results.collections)[0] : []; return __assign(__assign({}, state), { products: __spreadArrays(state.products, products), collections: __spreadArrays(state.collections, collections), results: __spreadArrays(state.results, [results]), loading: false }); case RESET: // reset everything but the initial config return __assign(__assign({}, initialState$1), { config: state.config }); default: return state; } }; var useReducer$1 = React.useReducer, useMemo = React.useMemo; /** * Utils */ var getSearchVariables = function (searchTerm, searchState) { var _a = searchState.config, pageSize = _a.pageSize, products = _a.products, collections = _a.collections; var productQuery = products ? "" + searchTerm : '__NO__SEARCH'; var collectionQuery = collections ? "" + searchTerm : '__NO_SEARCH'; return { productQuery: productQuery, productFirst: pageSize, // productAfter: productCursor, collectionQuery: collectionQuery, collectionFirst: pageSize, }; }; var memoizeQueryFunction = function (fn) { return m.memoizeJ(fn); }; var defaultConfig = { collections: true, products: true, memoize: true, debounce: 200, pageSize: 96, }; var getInitialState = function (config) { return (__assign(__assign({}, initialState$1), { config: config })); }; /** * useSearch */ var useSearch = function (_a) { var userQueryFunction = _a.query, userConfig = _a.config, queries = _a.queries; var config = __assign(__assign({}, defaultConfig), userConfig); var _b = useReducer$1(reducer$1, getInitialState(config)), state = _b[0], dispatch = _b[1]; /* Memoize the query function, and * debounce the Search function * Use React's useMemo so we only create these once */ var query = state.config.memoize ? useMemo(function () { return memoizeQueryFunction(userQueryFunction); }, [ userQueryFunction, ]) : userQueryFunction; var SEARCH_QUERY = __assign(__assign({}, defaultQueries$1), queries).SEARCH_QUERY; var runSearchFn = function (variables) { return __awaiter(void 0, void 0, void 0, function () { var response, data; return __generator(this, function (_a) { switch (_a.label) { case 0: return [4 /*yield*/, query(SEARCH_QUERY, variables)]; case 1: response = _a.sent(); data = response.data; dispatch({ type: FETCHED_RESULTS, results: data }); return [2 /*return*/]; } }); }); }; var runSearch = state.config.debounce && state.config.debounce > 0 ? useMemo(function () { return debounce(runSearchFn, config.debounce); }, [config.debounce]) : runSearchFn; /** * Updates the settings for a new search, * and resets product & collection cursors */ var search = function (newSearchTerm) { return __awaiter(void 0, void 0, void 0, function () { var variables; return __generator(this, function (_a) { dispatch({ type: NEW_SEARCH, searchTerm: newSearchTerm }); variables = getSearchVariables(newSearchTerm || state.searchTerm, state); runSearch(variables); return [2 /*return*/]; }); }); }; var setSearchTerm = function (newSearchTerm) { if (newSearchTerm === void 0) { newSearchTerm = ''; } return dispatch({ type: SET_SEARCH_TERM, searchTerm: newSearchTerm }); }; var reset = function () { return dispatch({ type: RESET }); }; // const loadMore = async () => { // if (!state.hasNextPage) return emptyResult // dispatch({ type: FETCH_MORE }) // const variables = getSearchVariables(state.currentOptions, state) // const response = await query<SearchQueryResult, SearchQueryInputSearchInput>(SEARCH_QUERY, variables) // const { data } = response // dispatch({ type: FETCHED_RESULTS, results: data }) // return data // } var searchTerm = state.searchTerm, loading = state.loading, products = state.products, collections = state.collections, results = state.results, hasMoreResults = state.hasMoreResults; return { /* State */ searchTerm: searchTerm, loading: loading, results: results, hasMoreResults: hasMoreResults, products: products, collections: collections, /* Methods */ search: search, setSearchTerm: setSearchTerm, reset: reset, }; }; var ShopifyContext = React.createContext(undefined); var ShopifyConsumer = ShopifyContext.Consumer; var useShopify = function () { var ctx = React.useContext(ShopifyContext); if (!ctx) throw new Error('`useShopify` must be used within a ShopifyProvider'); return ctx; }; var defaultConfig$1 = { search: undefined, checkout: undefined, }; var ShopifyProvider = function (_a) { var children = _a.children, queries = _a.queries, query = _a.query, userConfig = _a.config; var config = __assign(__assign({}, defaultConfig$1), userConfig); var checkout = useCheckout({ queries: queries, query: query, config: config.checkout ? config.checkout : undefined, }); var search = useSearch({ queries: queries, query: query, config: config.search }); var value = { checkout: checkout, search: search, }; return (React.createElement(ShopifyContext.Provider, { value: value }, children)); }; var useState = React.useState; var useProductVariant = function (product, options) { if (options === void 0) { options = {}; } var initialVariant = options.initialVariant; var variants = product.variants ? unwindEdges.unwindEdges(product.variants)[0] : []; if (!variants.length) throw new Error('The supplied product has no variants'); /** * Private Methods */ var findVariant = function (variantId) { var variant = variants.find(function (v) { return v.id === variantId; }); if (!variant) throw new Error("There is no variant with the id \"" + variantId + "\" on the product " + product.title); return variant; }; var getInitialState = function () { if (!initialVariant || initialVariant === 'first') return variants[0]; if (initialVariant === 'last') return variants[variants.length - 1]; return findVariant(initialVariant); }; var _a = useState(getInitialState()), currentVariant = _a[0], setCurrentVariant = _a[1]; /** * Public Methods */ var selectVariant = function (variantId) { var variant = findVariant(variantId); setCurrentVariant(variant); }; return { currentVariant: currentVariant, selectVariant: selectVariant, }; }; var useCheckout$1 = function () { var ctx = React.useContext(ShopifyContext); if (!ctx) throw new Error("useCheckout was called outside of a provider. Be sure to include a ShopifyProvider higher up in your App's component tree."); return ctx.checkout; }; var useSearch$1 = function () { var ctx = React.useContext(ShopifyContext); if (!ctx) throw new Error("useCheckout was called outside of a provider. Be sure to include a ShopifyProvider higher up in your App's component tree."); return ctx.search; }; exports.ShopifyConsumer = ShopifyConsumer; exports.ShopifyContext = ShopifyContext; exports.ShopifyProvider = ShopifyProvider; exports.useCheckout = useCheckout$1; exports.useProductVariant = useProductVariant; exports.useSearch = useSearch$1; exports.useShopify = useShopify; //# sourceMappingURL=index.js.map