From a3cf05fbd2a2aebaa6507c4718feaab874595564 Mon Sep 17 00:00:00 2001 From: Luis Alvarez Date: Sun, 4 Oct 2020 21:20:52 -0500 Subject: [PATCH] Fetch the cart! --- lib/bigcommerce/api/cart.ts | 16 ++++++++++++++-- lib/bigcommerce/cart/index.tsx | 7 ++++--- lib/bigcommerce/index.tsx | 1 + lib/commerce/cart/index.tsx | 10 +++------- lib/commerce/index.tsx | 1 + package.json | 2 ++ yarn.lock | 10 ++++++++++ 7 files changed, 35 insertions(+), 12 deletions(-) diff --git a/lib/bigcommerce/api/cart.ts b/lib/bigcommerce/api/cart.ts index 1f92205de..b54a5fc14 100644 --- a/lib/bigcommerce/api/cart.ts +++ b/lib/bigcommerce/api/cart.ts @@ -11,7 +11,20 @@ export type Item = { quantity?: number } -export type Cart = any +// TODO: this type should match: +// https://developer.bigcommerce.com/api-reference/cart-checkout/server-server-cart-api/cart/getacart#responses +export type Cart = { + id: string + parent_id?: string + customer_id: number + email: string + currency: { code: string } + tax_included: boolean + base_amount: number + discount_amount: number + cart_amount: number + // TODO: add missing fields +} const METHODS = ['GET', 'POST', 'PUT', 'DELETE'] @@ -91,7 +104,6 @@ function getCartCookie(name: string, cartId?: string, maxAge?: number) { ? { maxAge, expires: new Date(Date.now() + maxAge * 1000), - httpOnly: true, secure: process.env.NODE_ENV === 'production', path: '/', sameSite: 'lax', diff --git a/lib/bigcommerce/cart/index.tsx b/lib/bigcommerce/cart/index.tsx index b778c86e1..d554443f0 100644 --- a/lib/bigcommerce/cart/index.tsx +++ b/lib/bigcommerce/cart/index.tsx @@ -1,10 +1,11 @@ -import { FC } from 'react' +import type { FC } from 'react' import { CartProvider as CommerceCartProvider, useCart as useCommerceCart, -} from 'lib/commerce/cart' +} from '@lib/commerce/cart' +import type { Cart } from '../api/cart' -export type Cart = {} +export type { Cart } export const CartProvider: FC = ({ children }) => { return ( diff --git a/lib/bigcommerce/index.tsx b/lib/bigcommerce/index.tsx index 472ba6d36..d4c8acb39 100644 --- a/lib/bigcommerce/index.tsx +++ b/lib/bigcommerce/index.tsx @@ -23,6 +23,7 @@ async function getError(res: Response) { export const bigcommerceConfig: CommerceConfig = { locale: 'en-us', + cartCookie: 'bc_cartId', async fetcher({ url, method = 'GET', variables, body: bodyObj }) { const hasBody = Boolean(variables || bodyObj) const body = hasBody diff --git a/lib/commerce/cart/index.tsx b/lib/commerce/cart/index.tsx index dc90eb89b..dad90d7a2 100644 --- a/lib/commerce/cart/index.tsx +++ b/lib/commerce/cart/index.tsx @@ -1,5 +1,6 @@ import { createContext, useContext, FC } from 'react' import useSWR, { responseInterface } from 'swr' +import Cookies from 'js-cookie' import { useCommerce } from '..' export type CartResponse = responseInterface & { @@ -12,15 +13,10 @@ export type CartProviderProps = const CartContext = createContext | null>(null) -function getCartCookie() { - // TODO: Figure how the cart should be persisted - return null -} - const CartProvider: FC = ({ children, query, url }) => { - const { fetcher: fetch } = useCommerce() + const { fetcher: fetch, cartCookie } = useCommerce() const fetcher = (url?: string, query?: string) => fetch({ url, query }) - const cartId = getCartCookie() + const cartId = Cookies.get(cartCookie) const response = useSWR(() => (cartId ? [url, query] : null), fetcher) return ( diff --git a/lib/commerce/index.tsx b/lib/commerce/index.tsx index 69747c7e0..c024df5de 100644 --- a/lib/commerce/index.tsx +++ b/lib/commerce/index.tsx @@ -17,6 +17,7 @@ export type CommerceProps = { export type CommerceConfig = { fetcher: Fetcher locale: string + cartCookie: string } export type Fetcher = (options: FetcherOptions) => T | Promise diff --git a/package.json b/package.json index 49e51fe5b..a511f0191 100644 --- a/package.json +++ b/package.json @@ -22,6 +22,7 @@ "@types/classnames": "^2.2.10", "classnames": "^2.2.6", "cookie": "^0.4.1", + "js-cookie": "^2.2.1", "lodash": "^4.17.20", "next": "^9.5.4-canary.23", "postcss-nested": "^5.0.1", @@ -36,6 +37,7 @@ "@graphql-codegen/typescript": "^1.17.10", "@graphql-codegen/typescript-operations": "^1.17.8", "@types/cookie": "^0.4.0", + "@types/js-cookie": "^2.2.6", "@types/node": "^14.11.2", "@types/react": "^16.9.49", "graphql": "^15.3.0", diff --git a/yarn.lock b/yarn.lock index 58b4345ec..22063a99c 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1540,6 +1540,11 @@ dependencies: "@types/node" "*" +"@types/js-cookie@^2.2.6": + version "2.2.6" + resolved "https://registry.yarnpkg.com/@types/js-cookie/-/js-cookie-2.2.6.tgz#f1a1cb35aff47bc5cfb05cb0c441ca91e914c26f" + integrity sha512-+oY0FDTO2GYKEV0YPvSshGq9t7YozVkgvXLty7zogQNuCxBhT9/3INX9Q7H1aRZ4SUDRXAKlJuA4EA5nTt7SNw== + "@types/js-yaml@^3.12.5": version "3.12.5" resolved "https://registry.yarnpkg.com/@types/js-yaml/-/js-yaml-3.12.5.tgz#136d5e6a57a931e1cce6f9d8126aa98a9c92a6bb" @@ -4398,6 +4403,11 @@ jest-worker@^26.3.0: merge-stream "^2.0.0" supports-color "^7.0.0" +js-cookie@^2.2.1: + version "2.2.1" + resolved "https://registry.yarnpkg.com/js-cookie/-/js-cookie-2.2.1.tgz#69e106dc5d5806894562902aa5baec3744e9b2b8" + integrity sha512-HvdH2LzI/EAZcUwA8+0nKNtWHqS+ZmijLA30RwZA0bo7ToCckjK5MkGhjED9KoRcXO6BaGI3I9UIzSA1FKFPOQ== + "js-tokens@^3.0.0 || ^4.0.0", js-tokens@^4.0.0: version "4.0.0" resolved "https://registry.yarnpkg.com/js-tokens/-/js-tokens-4.0.0.tgz#19203fb59991df98e3a287050d4647cdeaf32499"