diff --git a/commerce.config.json b/commerce.config.json index bef7db222..e8418f296 100644 --- a/commerce.config.json +++ b/commerce.config.json @@ -1,7 +1,7 @@ { - "provider": "bigcommerce", + "provider": "shopify", "features": { - "wishlist": true, + "wishlist": false, "customCheckout": false } } diff --git a/components/product/helpers.ts b/components/product/helpers.ts index f8ab538ba..a0ceb7aa5 100644 --- a/components/product/helpers.ts +++ b/components/product/helpers.ts @@ -4,18 +4,14 @@ export type SelectedOptions = Record export function getVariant(product: Product, opts: SelectedOptions) { const variant = product.variants.find((variant) => { return Object.entries(opts).every(([key, value]) => - value - ? variant.options.find((option) => { - if ( - option.__typename === 'MultipleChoiceOption' && - option.displayName.toLowerCase() === key.toLowerCase() - ) { - return option.values.find((v) => v.label.toLowerCase() === value) - } - }) - : !variant.options.find( - (v) => v.displayName.toLowerCase() === key.toLowerCase() - ) + variant.options.find((option) => { + if ( + option.__typename === 'MultipleChoiceOption' && + option.displayName.toLowerCase() === key.toLowerCase() + ) { + return option.values.find((v) => v.label.toLowerCase() === value) + } + }) ) }) return variant diff --git a/framework/shopify/cart/use-cart.tsx b/framework/shopify/cart/use-cart.tsx index ea1982c2c..5f77360bb 100644 --- a/framework/shopify/cart/use-cart.tsx +++ b/framework/shopify/cart/use-cart.tsx @@ -27,7 +27,7 @@ export const handler: SWRHook< const data = await fetch({ ...options, variables: { - checkoutId, + checkoutId: checkoutId, }, }) checkout = data.node diff --git a/framework/shopify/fetcher.ts b/framework/shopify/fetcher.ts index 9c4fe9a9e..a69150503 100644 --- a/framework/shopify/fetcher.ts +++ b/framework/shopify/fetcher.ts @@ -2,9 +2,14 @@ import { Fetcher } from '@commerce/utils/types' import { API_TOKEN, API_URL } from './const' import { handleFetchResponse } from './utils' -const fetcher: Fetcher = async ({ method = 'POST', variables, query }) => { +const fetcher: Fetcher = async ({ + url = API_URL, + method = 'POST', + variables, + query, +}) => { return handleFetchResponse( - await fetch(API_URL, { + await fetch(url, { method, body: JSON.stringify({ query, variables }), headers: { diff --git a/framework/shopify/index.tsx b/framework/shopify/index.tsx index c26704771..5b25d6b21 100644 --- a/framework/shopify/index.tsx +++ b/framework/shopify/index.tsx @@ -28,8 +28,7 @@ export type ShopifyProps = { export function CommerceProvider({ children, ...config }: ShopifyProps) { return ( {children} diff --git a/framework/shopify/provider.ts b/framework/shopify/provider.ts index 5041770c6..00db5c1d3 100644 --- a/framework/shopify/provider.ts +++ b/framework/shopify/provider.ts @@ -1,4 +1,4 @@ -import { SHOPIFY_CHECKOUT_ID_COOKIE, STORE_DOMAIN } from './const' +import { SHOPIFY_CHECKOUT_ID_COOKIE } from './const' import { handler as useCart } from './cart/use-cart' import { handler as useAddItem } from './cart/use-add-item' @@ -17,7 +17,6 @@ import fetcher from './fetcher' export const shopifyProvider = { locale: 'en-us', cartCookie: SHOPIFY_CHECKOUT_ID_COOKIE, - storeDomain: STORE_DOMAIN, fetcher, cart: { useCart, useAddItem, useUpdateItem, useRemoveItem }, customer: { useCustomer }, diff --git a/framework/shopify/types.ts b/framework/shopify/types.ts index c4e42b67d..e7bcb2476 100644 --- a/framework/shopify/types.ts +++ b/framework/shopify/types.ts @@ -7,13 +7,11 @@ export type ShopifyCheckout = { lineItems: CheckoutLineItem[] } -export interface Cart extends Core.Cart { - id: string +export type Cart = Core.Cart & { lineItems: LineItem[] } - export interface LineItem extends Core.LineItem { - options: any[] + options?: any[] } /** diff --git a/framework/shopify/utils/storage.ts b/framework/shopify/utils/storage.ts deleted file mode 100644 index d46dadb21..000000000 --- a/framework/shopify/utils/storage.ts +++ /dev/null @@ -1,13 +0,0 @@ -export const getCheckoutIdFromStorage = (token: string) => { - if (window && window.sessionStorage) { - return window.sessionStorage.getItem(token) - } - - return null -} - -export const setCheckoutIdInStorage = (token: string, id: string | number) => { - if (window && window.sessionStorage) { - return window.sessionStorage.setItem(token, id + '') - } -} diff --git a/framework/shopify/wishlist/use-add-item.tsx b/framework/shopify/wishlist/use-add-item.tsx index 438397f2b..75f067c3a 100644 --- a/framework/shopify/wishlist/use-add-item.tsx +++ b/framework/shopify/wishlist/use-add-item.tsx @@ -1,34 +1,13 @@ import { useCallback } from 'react' -import type { MutationHook } from '@commerce/utils/types' -import { CommerceError } from '@commerce/utils/errors' -import useAddItem, { UseAddItem } from '@commerce/wishlist/use-add-item' -import useCustomer from '../customer/use-customer' -import useWishlist from './use-wishlist' +export function emptyHook() { + const useEmptyHook = async (options = {}) => { + return useCallback(async function () { + return Promise.resolve() + }, []) + } -export default useAddItem as UseAddItem - -export const handler: MutationHook = { - fetchOptions: { - query: '', - }, - useHook: ({ fetch }) => () => { - const { data: customer } = useCustomer() - const { revalidate } = useWishlist() - - return useCallback( - async function addItem(item) { - if (!customer) { - // A signed customer is required in order to have a wishlist - throw new CommerceError({ - message: 'Signed customer not found', - }) - } - - await revalidate() - return null - }, - [fetch, revalidate, customer] - ) - }, + return useEmptyHook } + +export default emptyHook diff --git a/framework/shopify/wishlist/use-remove-item.tsx b/framework/shopify/wishlist/use-remove-item.tsx index 971ec082f..a2d3a8a05 100644 --- a/framework/shopify/wishlist/use-remove-item.tsx +++ b/framework/shopify/wishlist/use-remove-item.tsx @@ -1,36 +1,17 @@ import { useCallback } from 'react' -import type { MutationHook } from '@commerce/utils/types' -import { CommerceError } from '@commerce/utils/errors' -import useRemoveItem, { - UseRemoveItem, -} from '@commerce/wishlist/use-remove-item' -import useCustomer from '../customer/use-customer' -import useWishlist from './use-wishlist' - -export default useRemoveItem as UseRemoveItem - -export const handler: MutationHook = { - fetchOptions: { - query: '', - }, - useHook: ({ fetch }) => () => { - const { data: customer } = useCustomer() - const { revalidate } = useWishlist() - - return useCallback( - async function addItem(item) { - if (!customer) { - // A signed customer is required in order to have a wishlist - throw new CommerceError({ - message: 'Signed customer not found', - }) - } - - await revalidate() - return null - }, - [fetch, revalidate, customer] - ) - }, +type Options = { + includeProducts?: boolean } + +export function emptyHook(options?: Options) { + const useEmptyHook = async ({ id }: { id: string | number }) => { + return useCallback(async function () { + return Promise.resolve() + }, []) + } + + return useEmptyHook +} + +export default emptyHook diff --git a/framework/shopify/wishlist/use-wishlist.tsx b/framework/shopify/wishlist/use-wishlist.tsx index 651ea06c8..d2ce9db5b 100644 --- a/framework/shopify/wishlist/use-wishlist.tsx +++ b/framework/shopify/wishlist/use-wishlist.tsx @@ -1,49 +1,46 @@ -import { useMemo } from 'react' -import { SWRHook } from '@commerce/utils/types' -import useWishlist, { UseWishlist } from '@commerce/wishlist/use-wishlist' -import useCustomer from '../customer/use-customer' +// TODO: replace this hook and other wishlist hooks with a handler, or remove them if +// Shopify doesn't have a wishlist -export type UseWishlistInput = { includeProducts?: boolean } +import { HookFetcher } from '@commerce/utils/types' +import { Product } from '../schema' -export default useWishlist as UseWishlist +const defaultOpts = {} -export const handler: SWRHook< - any | null, - UseWishlistInput, - { customerId?: number } & UseWishlistInput, - { isEmpty?: boolean } -> = { - fetchOptions: { - url: '/api/bigcommerce/wishlist', - method: 'GET', - }, - fetcher() { - return { items: [] } - }, - useHook: ({ useData }) => (input) => { - const { data: customer } = useCustomer() - const response = useData({ - input: [ - ['customerId', customer?.entityId], - ['includeProducts', input?.includeProducts], - ], - swrOptions: { - revalidateOnFocus: false, - ...input?.swrOptions, - }, - }) - - return useMemo( - () => - Object.create(response, { - isEmpty: { - get() { - return (response.data?.items?.length || 0) <= 0 - }, - enumerable: true, - }, - }), - [response] - ) - }, +export type Wishlist = { + items: [ + { + product_id: number + variant_id: number + id: number + product: Product + } + ] } + +export interface UseWishlistOptions { + includeProducts?: boolean +} + +export interface UseWishlistInput extends UseWishlistOptions { + customerId?: number +} + +export const fetcher: HookFetcher = () => { + return null +} + +export function extendHook( + customFetcher: typeof fetcher, + // swrOptions?: SwrOptions + swrOptions?: any +) { + const useWishlist = ({ includeProducts }: UseWishlistOptions = {}) => { + return { data: null } + } + + useWishlist.extend = extendHook + + return useWishlist +} + +export default extendHook(fetcher) diff --git a/pages/[...pages].tsx b/pages/[...pages].tsx index 67adb6287..3f39845b5 100644 --- a/pages/[...pages].tsx +++ b/pages/[...pages].tsx @@ -25,8 +25,7 @@ export async function getStaticProps({ const pageItem = pages.find((p) => (p.url ? getSlug(p.url) === slug : false)) const data = pageItem && - // TODO: Shopify - Fix this type - (await getPage({ variables: { id: pageItem.id! } as any, config, preview })) + (await getPage({ variables: { id: pageItem.id! }, config, preview })) const page = data?.page if (!page) { diff --git a/pages/customer/activate.tsx b/pages/customer/activate.tsx deleted file mode 100644 index 61e4da0ca..000000000 --- a/pages/customer/activate.tsx +++ /dev/null @@ -1,26 +0,0 @@ -import type { GetStaticPropsContext } from 'next' -import { getConfig } from '@framework/api' -import getAllPages from '@framework/common/get-all-pages' -import { Layout } from '@components/common' -import { Container, Text } from '@components/ui' - -export async function getStaticProps({ - preview, - locale, -}: GetStaticPropsContext) { - const config = getConfig({ locale }) - const { pages } = await getAllPages({ config, preview }) - return { - props: { pages }, - } -} - -export default function ActivateAccount() { - return ( - - Activate Your Account - - ) -} - -ActivateAccount.Layout = Layout diff --git a/tsconfig.json b/tsconfig.json index 9e712fb18..e20f37099 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -22,8 +22,8 @@ "@components/*": ["components/*"], "@commerce": ["framework/commerce"], "@commerce/*": ["framework/commerce/*"], - "@framework": ["framework/bigcommerce"], - "@framework/*": ["framework/bigcommerce/*"] + "@framework": ["framework/shopify"], + "@framework/*": ["framework/shopify/*"] } }, "include": ["next-env.d.ts", "**/*.d.ts", "**/*.ts", "**/*.tsx", "**/*.js"],