cx/commerce
4
0
Fork 0
forked from crowetic/commerce
Code Pull Requests Activity

Update Next and make the CartProvider not required anymore

Browse Source
This commit is contained in:
Luis Alvarez 2020-10-08 22:17:40 -05:00
parent 2c82348487
commit 6dca1eadd2
6 changed files with 35 additions and 46 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
components/core/Layout/Layout.tsx
View File

@ -2,7 +2,6 @@ import cn from 'classnames'
import { FC } from 'react' import { FC } from 'react'
import s from './Layout.module.css' import s from './Layout.module.css'
import { CommerceProvider } from '@lib/bigcommerce' import { CommerceProvider } from '@lib/bigcommerce'
import { CartProvider } from '@lib/bigcommerce/cart'
import { Navbar, Featurebar, Footer } from '@components/core' import { Navbar, Featurebar, Footer } from '@components/core'
import { Container, Sidebar } from '@components/ui' import { Container, Sidebar } from '@components/ui'
import { CartSidebarView } from '@components/cart' import { CartSidebarView } from '@components/cart'
@ -37,11 +36,9 @@ const CoreLayout: FC<Props> = ({ className, children }) => {
const Layout: FC<Props> = (props) => ( const Layout: FC<Props> = (props) => (
<CommerceProvider locale="en-us"> <CommerceProvider locale="en-us">
<CartProvider>
<UIProvider> <UIProvider>
<CoreLayout {...props} /> <CoreLayout {...props} />
</UIProvider> </UIProvider>
</CartProvider>
</CommerceProvider> </CommerceProvider>
) )

14
lib/bigcommerce/cart/index.tsx
View File

@ -1,19 +1,9 @@
import type { FC } from 'react' import { CartProvider, useCart as useCommerceCart } from '@lib/commerce/cart'
import {
CartProvider as CommerceCartProvider,
useCart as useCommerceCart,
} from '@lib/commerce/cart'
import type { Cart } from '../api/cart' import type { Cart } from '../api/cart'
export type { Cart } export type { Cart }
export const CartProvider: FC = ({ children }) => { export { CartProvider }
return (
<CommerceCartProvider url="/api/bigcommerce/cart">
{children}
</CommerceCartProvider>
)
}
export function useCart() { export function useCart() {
const cart = useCommerceCart<Cart | null>() const cart = useCommerceCart<Cart | null>()

13
lib/commerce/cart/index.tsx
View File

@ -3,15 +3,18 @@ import useSWR, { responseInterface } from 'swr'
import Cookies from 'js-cookie' import Cookies from 'js-cookie'
import { useCommerce } from '..' import { useCommerce } from '..'
const CART_API = '/api/bigcommerce/cart'
export type CartResponse<C> = responseInterface<C, Error> & { export type CartResponse<C> = responseInterface<C, Error> & {
isEmpty: boolean isEmpty: boolean
} }
export type CartProviderProps = export type CartProviderProps = {
| { query: string; url?: string } query?: string
| { query?: string; url: string } url?: string
}
const CartContext = createContext<{ query?: string; url?: string }>({}) const CartContext = createContext<CartProviderProps>({})
const CartProvider: FC<CartProviderProps> = ({ children, query, url }) => { const CartProvider: FC<CartProviderProps> = ({ children, query, url }) => {
const value = useMemo(() => ({ query, url }), [query, url]) const value = useMemo(() => ({ query, url }), [query, url])
@ -22,7 +25,7 @@ function useCart<C>() {
const { fetcherRef, cartCookie } = useCommerce() const { fetcherRef, cartCookie } = useCommerce()
const fetcher = (url?: string, query?: string) => const fetcher = (url?: string, query?: string) =>
Cookies.get(cartCookie) ? fetcherRef.current({ url, query }) : null Cookies.get(cartCookie) ? fetcherRef.current({ url, query }) : null
const { url, query } = useContext(CartContext) const { url = CART_API, query } = useContext(CartContext)
const response = useSWR([url, query], fetcher, { const response = useSWR([url, query], fetcher, {
revalidateOnFocus: false, revalidateOnFocus: false,
}) })

2
package.json
View File

@ -26,7 +26,7 @@
"js-cookie": "^2.2.1", "js-cookie": "^2.2.1",
"lodash": "^4.17.20", "lodash": "^4.17.20",
"lodash.debounce": "^4.0.8", "lodash.debounce": "^4.0.8",
"next": "^9.5.4-canary.23", "next": "^9.5.4",
"postcss-nesting": "^7.0.1", "postcss-nesting": "^7.0.1",
"react": "^16.13.1", "react": "^16.13.1",
"react-aria": "^3.0.0", "react-aria": "^3.0.0",

1
pages/product/[slug].tsx
View File

@ -8,7 +8,6 @@ import getAllProductPaths from '@lib/bigcommerce/api/operations/get-all-product-
export async function getStaticProps({ export async function getStaticProps({
params, params,
}: GetStaticPropsContext<{ slug: string }>) { }: GetStaticPropsContext<{ slug: string }>) {
console.log('SLUG', params!.slug)
const { product } = await getProduct({ variables: { slug: params!.slug } }) const { product } = await getProduct({ variables: { slug: params!.slug } })
if (!product) { if (!product) {

48
yarn.lock
View File

@ -1395,20 +1395,20 @@
resolved "https://registry.yarnpkg.com/@headlessui/react/-/react-0.2.0.tgz#a31f90892d736243ba91c1474f534b3256d0c538" resolved "https://registry.yarnpkg.com/@headlessui/react/-/react-0.2.0.tgz#a31f90892d736243ba91c1474f534b3256d0c538"
integrity sha512-YV+vF+QhTRcspydPdHF3ZXe+FkOiJpRdqMjjFIIX9bSdT2O2T7GurgKQdGgamNUM+B99MZBOTRqxS8Dlh485eg== integrity sha512-YV+vF+QhTRcspydPdHF3ZXe+FkOiJpRdqMjjFIIX9bSdT2O2T7GurgKQdGgamNUM+B99MZBOTRqxS8Dlh485eg==
"@next/env@9.5.4-canary.23": "@next/env@9.5.4":
version "9.5.4-canary.23" version "9.5.4"
resolved "https://registry.yarnpkg.com/@next/env/-/env-9.5.4-canary.23.tgz#2078ce80a1d9424bab7ec169dcf98b8d684bc845" resolved "https://registry.yarnpkg.com/@next/env/-/env-9.5.4.tgz#950f3370151a940ecac6e7e19cf125e6113e101e"
integrity sha512-uP9GV9QU+QODyYM9ueV1E4tocrAeAsvT1+x11mbQWYhC4lv9EXA85S5dUpJp4dbv1WwM+qJQaoEe7yL/exCkng== integrity sha512-uGnUO68/u9C8bqHj5obIvyGRDqe/jh1dFSLx03mJmlESjcCmV4umXYJOnt3XzU1VhVntSE+jUZtnS5bjYmmLfQ==
"@next/polyfill-module@9.5.4-canary.23": "@next/polyfill-module@9.5.4":
version "9.5.4-canary.23" version "9.5.4"
resolved "https://registry.yarnpkg.com/@next/polyfill-module/-/polyfill-module-9.5.4-canary.23.tgz#5fd54f33889a6f605337168c94b0fbac779dc107" resolved "https://registry.yarnpkg.com/@next/polyfill-module/-/polyfill-module-9.5.4.tgz#35ea31ce5f6bbf0ac31aac483b60d4ba17a79861"
integrity sha512-nyvVpt8mb2IGoAqsCucrOk88/nU2c+Xv/Iuaxfyex1qv2g1ZK1KUSojLVSIfqOPa5toP1gCgU+xsz8jXVgmpEg== integrity sha512-GA2sW7gs33s7RGPFqkMiT9asYpaV/Hhw9+XM9/UlPrkNdTaxZWaPa2iHgmqJ7k6OHiOmy+CBLFrUBgzqKNhs3Q==
"@next/react-dev-overlay@9.5.4-canary.23": "@next/react-dev-overlay@9.5.4":
version "9.5.4-canary.23" version "9.5.4"
resolved "https://registry.yarnpkg.com/@next/react-dev-overlay/-/react-dev-overlay-9.5.4-canary.23.tgz#8f856f0b1db2fad6f7a2bdf6b15d487541484bdc" resolved "https://registry.yarnpkg.com/@next/react-dev-overlay/-/react-dev-overlay-9.5.4.tgz#7d88a710d23021020cca213bc77106df18950b2b"
integrity sha512-Ls00yEPvtTkXxipRfprMGJLn9mlmyDozYiIzvZqafkxuZ9KhII/aLu1Xx4W4o6muwEnxPBKW1knsHvWzStsjQA== integrity sha512-tYvNmOQ0inykSvcimkTiONMv4ZyFB2G2clsy9FKLLRZ2OA+Jiov6T7Pq6YpKbBwTLu/BQGVc7Qn4BZ5CDHR8ig==
dependencies: dependencies:
"@babel/code-frame" "7.10.4" "@babel/code-frame" "7.10.4"
ally.js "1.4.1" ally.js "1.4.1"
@ -1421,10 +1421,10 @@
stacktrace-parser "0.1.10" stacktrace-parser "0.1.10"
strip-ansi "6.0.0" strip-ansi "6.0.0"
"@next/react-refresh-utils@9.5.4-canary.23": "@next/react-refresh-utils@9.5.4":
version "9.5.4-canary.23" version "9.5.4"
resolved "https://registry.yarnpkg.com/@next/react-refresh-utils/-/react-refresh-utils-9.5.4-canary.23.tgz#a0a5c3b10108dc6ef1e17ff68e09bd7dcae76278" resolved "https://registry.yarnpkg.com/@next/react-refresh-utils/-/react-refresh-utils-9.5.4.tgz#3bfe067f0cfc717f079482d956211708c9e81126"
integrity sha512-9Bne33O1uveH7YRjfX0UCJLfsUcP/lIZMc1JDmTkZuQOIFcTg8wuWOXC2mwQIAVtPZ8S9Lg37vK/c0ngZO9omw== integrity sha512-TPhEiYxK5YlEuzVuTzgZiDN7SDh4drvUAqsO9Yccd8WLcfYqOLRN2fCALremW5mNLAZQZW3iFgW8PW8Gckq4EQ==
"@nodelib/fs.scandir@2.1.3": "@nodelib/fs.scandir@2.1.3":
version "2.1.3" version "2.1.3"
@ -5681,10 +5681,10 @@ next-tick@~1.0.0:
resolved "https://registry.yarnpkg.com/next-tick/-/next-tick-1.0.0.tgz#ca86d1fe8828169b0120208e3dc8424b9db8342c" resolved "https://registry.yarnpkg.com/next-tick/-/next-tick-1.0.0.tgz#ca86d1fe8828169b0120208e3dc8424b9db8342c"
integrity sha1-yobR/ogoFpsBICCOPchCS524NCw= integrity sha1-yobR/ogoFpsBICCOPchCS524NCw=
next@^9.5.4-canary.23: next@^9.5.4:
version "9.5.4-canary.23" version "9.5.4"
resolved "https://registry.yarnpkg.com/next/-/next-9.5.4-canary.23.tgz#ce0e7b9e284b5f9b718610ff5363827d3dfecd44" resolved "https://registry.yarnpkg.com/next/-/next-9.5.4.tgz#3c6aa3fd38ff1711e956ea2b6833475e0262ec35"
integrity sha512-uNMIonQUZr5uZvmuMJ1Pq2akfzEQa60mQPVkMUUe12eHcE3efsA1M3W+SZfcSnSkCna53qU9Km1pNdGbVLe1Cg== integrity sha512-dicsJSxiUFcRjeZ/rNMAO3HS5ttFFuRHhdAn5g7lHnWUZ3MnEX4ggBIihaoUr6qu2So9KoqUPXpS91MuSXUmBw==
dependencies: dependencies:
"@ampproject/toolbox-optimizer" "2.6.0" "@ampproject/toolbox-optimizer" "2.6.0"
"@babel/code-frame" "7.10.4" "@babel/code-frame" "7.10.4"
@ -5704,10 +5704,10 @@ next@^9.5.4-canary.23:
"@babel/preset-typescript" "7.10.4" "@babel/preset-typescript" "7.10.4"
"@babel/runtime" "7.11.2" "@babel/runtime" "7.11.2"
"@babel/types" "7.11.5" "@babel/types" "7.11.5"
"@next/env" "9.5.4-canary.23" "@next/env" "9.5.4"
"@next/polyfill-module" "9.5.4-canary.23" "@next/polyfill-module" "9.5.4"
"@next/react-dev-overlay" "9.5.4-canary.23" "@next/react-dev-overlay" "9.5.4"
"@next/react-refresh-utils" "9.5.4-canary.23" "@next/react-refresh-utils" "9.5.4"
ast-types "0.13.2" ast-types "0.13.2"
babel-plugin-transform-define "2.0.0" babel-plugin-transform-define "2.0.0"
babel-plugin-transform-react-remove-prop-types "0.4.24" babel-plugin-transform-react-remove-prop-types "0.4.24"