diff --git a/.vercelignore b/.vercelignore deleted file mode 100644 index a65b41774..000000000 --- a/.vercelignore +++ /dev/null @@ -1 +0,0 @@ -lib diff --git a/lib/bigcommerce/api/operations/get-all-product-paths.ts b/lib/bigcommerce/api/operations/get-all-product-paths.ts index ebb196eb2..96ab111c4 100644 --- a/lib/bigcommerce/api/operations/get-all-product-paths.ts +++ b/lib/bigcommerce/api/operations/get-all-product-paths.ts @@ -23,7 +23,6 @@ export interface GetAllProductPathsResult { } async function getAllProductPaths(opts?: { - query?: string config?: BigcommerceConfig }): Promise> diff --git a/lib/bigcommerce/api/operations/get-all-products.ts b/lib/bigcommerce/api/operations/get-all-products.ts index a43a92747..8dc85b7fd 100644 --- a/lib/bigcommerce/api/operations/get-all-products.ts +++ b/lib/bigcommerce/api/operations/get-all-products.ts @@ -47,7 +47,6 @@ export type ProductVariables = Images & Omit async function getAllProducts(opts?: { - query?: string variables?: ProductVariables config?: BigcommerceConfig }): Promise> diff --git a/lib/bigcommerce/api/operations/get-product.ts b/lib/bigcommerce/api/operations/get-product.ts index ae601d7c0..86ddc34ad 100644 --- a/lib/bigcommerce/api/operations/get-product.ts +++ b/lib/bigcommerce/api/operations/get-product.ts @@ -43,7 +43,6 @@ export type ProductVariables = Images & ({ path: string; slug?: never } | { path?: never; slug: string }) async function getProduct(opts: { - query?: string variables: ProductVariables config?: BigcommerceConfig }): Promise> diff --git a/lib/bigcommerce/cart.tsx b/lib/bigcommerce/cart.tsx index bc3563807..d57736e91 100644 --- a/lib/bigcommerce/cart.tsx +++ b/lib/bigcommerce/cart.tsx @@ -1,21 +1,15 @@ +import { FC } from 'react' import { CartProvider as CommerceCartProvider, useCart as useCommerceCart, } from 'lib/commerce/cart' -import { FunctionComponent } from 'react' export type Cart = any -interface Props { - children?: any +export const CartProvider: FC = ({ children }) => { + return {children} } -function useCart() { +export function useCart() { return useCommerceCart() } - -const CartProvider: FunctionComponent = ({ children }) => { - return {children} -} - -export { CartProvider, useCart } diff --git a/lib/bigcommerce/index.tsx b/lib/bigcommerce/index.tsx index 4170deb87..006d5389c 100644 --- a/lib/bigcommerce/index.tsx +++ b/lib/bigcommerce/index.tsx @@ -1,9 +1,9 @@ +import { ReactNode } from 'react' import { + CommerceConfig, CommerceProvider as CoreCommerceProvider, - Connector, useCommerce as useCoreCommerce, } from 'lib/commerce' -import { ReactNode } from 'react' async function getText(res: Response) { try { @@ -31,19 +31,21 @@ async function fetcher(url: string, query: string) { throw await getError(res) } -export const bigcommerce: Connector = { +export const bigcommerceConfig: CommerceConfig = { locale: 'en-us', fetcher, } -interface Props { - children?: ReactNode | any +export type BigcommerceConfig = Partial + +export type BigcommerceProps = { + children?: ReactNode + config: BigcommerceConfig } -// TODO: The connector should be extendable when a developer is using it -export function CommerceProvider({ children }: Props) { +export function CommerceProvider({ children, config }: BigcommerceProps) { return ( - + {children} ) diff --git a/lib/commerce/cart.tsx b/lib/commerce/cart.tsx index ab9d6f70a..8c1335780 100644 --- a/lib/commerce/cart.tsx +++ b/lib/commerce/cart.tsx @@ -1,31 +1,27 @@ -import { createContext, useContext, FunctionComponent } from 'react' +import { createContext, useContext, FC } from 'react' import useSWR, { responseInterface } from 'swr' import { useCommerce } from '.' -interface Props { - children?: any -} -export type Cart = any - -export type CartResponse = responseInterface & { +export type CartResponse = responseInterface & { isEmpty: boolean } -const CartContext = createContext | any>(null) +export type CartProviderProps = + | { query: string; url?: string } + | { query?: string; url: string } + +const CartContext = createContext | null>(null) function getCartCookie() { // TODO: Figure how the cart should be persisted return null } -const CartProvider: FunctionComponent = ({ children }) => { - const { hooks, fetcher } = useCommerce() - const { useCart } = hooks +const CartProvider: FC = ({ children, query, url }) => { + const { fetcher } = useCommerce() const cartId = getCartCookie() - const response = useSWR( - () => (cartId ? [useCart.url, useCart.query, useCart.resolver] : null), - fetcher - ) + const response = useSWR(() => (cartId ? [url, query] : null), fetcher) + // TODO: Do something to make this prop work const isEmpty = true return ( @@ -35,7 +31,7 @@ const CartProvider: FunctionComponent = ({ children }) => { ) } -function useCart() { +function useCart() { return useContext(CartContext) as CartResponse } diff --git a/lib/commerce/index.tsx b/lib/commerce/index.tsx index 6849ed0b3..2659def45 100644 --- a/lib/commerce/index.tsx +++ b/lib/commerce/index.tsx @@ -1,29 +1,27 @@ import { createContext, ReactNode, useContext } from 'react' -const Commerce = createContext(null) +const Commerce = createContext(null) export type CommerceProps = { - children?: ReactNode | any - connector: Connector + children?: ReactNode + config: CommerceConfig } -export type Connector = { +export type CommerceConfig = { fetcher: Fetcher locale: string } export type Fetcher = (...args: any) => T | Promise -export function CommerceProvider({ children, connector }: CommerceProps) { - if (!connector) { - throw new Error( - 'CommerceProvider requires a valid headless commerce connector' - ) +export function CommerceProvider({ children, config }: CommerceProps) { + if (!config) { + throw new Error('CommerceProvider requires a valid config object') } - return {children} + return {children} } -export function useCommerce() { +export function useCommerce() { return useContext(Commerce) as T } diff --git a/pages/product/[slug].tsx b/pages/product/[slug].tsx index 1342968a5..4e6af3308 100644 --- a/pages/product/[slug].tsx +++ b/pages/product/[slug].tsx @@ -1,6 +1,6 @@ import { GetStaticPropsContext, InferGetStaticPropsType } from 'next' import { useRouter } from 'next/router' -import getProduct from 'lib/bigcommerce/api/operations/get-product' +import getProduct from '@lib/bigcommerce/api/operations/get-product' import { Layout } from '@components/core' import { ProductView } from '@components/product' import getAllProductPaths from '@lib/bigcommerce/api/operations/get-all-product-paths' @@ -37,11 +37,7 @@ export async function getStaticPaths() { const { products } = await getAllProductPaths() return { - paths: products.map((product) => { - const { path } = product!.node - // Exclude the slashes: `/slug/` -> `slug` - return { params: { slug: path.substring(1, path.length - 1) } } - }), + paths: products.map((product) => `/product${product!.node.path}`), fallback: 'unstable_blocking', } } diff --git a/tsconfig.json b/tsconfig.json index faa489c13..ec924f865 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -1,7 +1,7 @@ { "compilerOptions": { "baseUrl": ".", - "target": "es5", + "target": "esnext", "lib": ["dom", "dom.iterable", "esnext"], "allowJs": true, "skipLibCheck": true, @@ -20,6 +20,6 @@ "@components/*": ["components/*"] } }, - "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx"], + "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", "**/*.js"], "exclude": ["node_modules"] }