forked from crowetic/commerce
multiple changes to fix the wishlist
This commit is contained in:
parent
3acca7cc17
commit
751011767a
@ -30,7 +30,8 @@ const WishlistButton: FC<Props> = ({
|
||||
const itemInWishlist = data?.items?.find(
|
||||
// @ts-ignore Wishlist is not always enabled
|
||||
(item) =>
|
||||
item.product_id === productId && (item.variant_id as any) === variant.id
|
||||
item.product_id === Number(productId) &&
|
||||
(item.variant_id as any) === Number(variant.id)
|
||||
)
|
||||
|
||||
const handleWishlistChange = async (e: any) => {
|
||||
|
@ -1,6 +1,11 @@
|
||||
import type { ItemBody as WishlistItemBody } from '../wishlist'
|
||||
import type { CartItemBody, OptionSelections } from '../../types'
|
||||
|
||||
type BCWishlistItemBody = {
|
||||
product_id: number
|
||||
variant_id: number
|
||||
}
|
||||
|
||||
type BCCartItemBody = {
|
||||
product_id: number
|
||||
variant_id: number
|
||||
@ -8,9 +13,11 @@ type BCCartItemBody = {
|
||||
option_selections?: OptionSelections
|
||||
}
|
||||
|
||||
export const parseWishlistItem = (item: WishlistItemBody) => ({
|
||||
product_id: item.productId,
|
||||
variant_id: item.variantId,
|
||||
export const parseWishlistItem = (
|
||||
item: WishlistItemBody
|
||||
): BCWishlistItemBody => ({
|
||||
product_id: Number(item.productId),
|
||||
variant_id: Number(item.variantId),
|
||||
})
|
||||
|
||||
export const parseCartItem = (item: CartItemBody): BCCartItemBody => ({
|
||||
|
@ -68,14 +68,15 @@ async function getCustomerWishlist({
|
||||
const productsById = graphqlData.products.reduce<{
|
||||
[k: number]: ProductEdge
|
||||
}>((prods, p) => {
|
||||
prods[Number(p.node.entityId)] = p as any
|
||||
prods[Number(p.id)] = p as any
|
||||
return prods
|
||||
}, {})
|
||||
// Populate the wishlist items with the graphql products
|
||||
wishlist.items.forEach((item) => {
|
||||
const product = item && productsById[item.product_id!]
|
||||
if (item && product) {
|
||||
item.product = product.node
|
||||
// @ts-ignore Fix this type when the wishlist type is properly defined
|
||||
item.product = product
|
||||
}
|
||||
})
|
||||
}
|
||||
|
@ -18,7 +18,7 @@ export const handler: SWRHook<
|
||||
url: '/api/bigcommerce/wishlist',
|
||||
method: 'GET',
|
||||
},
|
||||
fetcher({ input: { customerId, includeProducts }, options, fetch }) {
|
||||
async fetcher({ input: { customerId, includeProducts }, options, fetch }) {
|
||||
if (!customerId) return null
|
||||
|
||||
// Use a dummy base as we only care about the relative path
|
||||
@ -35,7 +35,7 @@ export const handler: SWRHook<
|
||||
const { data: customer } = useCustomer()
|
||||
const response = useData({
|
||||
input: [
|
||||
['customerId', (customer as any)?.id],
|
||||
['customerId', customer?.entityId],
|
||||
['includeProducts', input?.includeProducts],
|
||||
],
|
||||
swrOptions: {
|
||||
|
@ -8,7 +8,6 @@ import {
|
||||
} from '../const'
|
||||
|
||||
if (!API_URL) {
|
||||
console.log(process.env)
|
||||
throw new Error(
|
||||
`The environment variable NEXT_PUBLIC_SHOPIFY_STORE_DOMAIN is missing and it's required to access your store`
|
||||
)
|
||||
|
@ -8,7 +8,6 @@
|
||||
"analyze": "BUNDLE_ANALYZE=both yarn build",
|
||||
"prettier-fix": "prettier --write .",
|
||||
"find:unused": "next-unused",
|
||||
"commerce": "node scripts/commerce.js",
|
||||
"generate": "graphql-codegen",
|
||||
"generate:definitions": "node framework/bigcommerce/scripts/generate-definitions.js"
|
||||
},
|
||||
|
@ -1,7 +1,4 @@
|
||||
import { useEffect } from 'react'
|
||||
import { useRouter } from 'next/router'
|
||||
import type { GetStaticPropsContext } from 'next'
|
||||
|
||||
import { Heart } from '@components/icons'
|
||||
import { Layout } from '@components/common'
|
||||
import { Text, Container } from '@components/ui'
|
||||
@ -36,8 +33,7 @@ export async function getStaticProps({
|
||||
export default function Wishlist() {
|
||||
const { data: customer } = useCustomer()
|
||||
// @ts-ignore Shopify - Fix this types
|
||||
const { data, isLoading, isEmpty } = useWishlist()
|
||||
const router = useRouter()
|
||||
const { data, isLoading, isEmpty } = useWishlist({ includeProducts: true })
|
||||
|
||||
return (
|
||||
<Container>
|
||||
@ -60,7 +56,7 @@ export default function Wishlist() {
|
||||
data &&
|
||||
// @ts-ignore Shopify - Fix this types
|
||||
data.items?.map((item) => (
|
||||
<WishlistCard key={item.id} product={item as any} />
|
||||
<WishlistCard key={item.id} product={item.product! as any} />
|
||||
))
|
||||
)}
|
||||
</div>
|
||||
|
@ -1 +0,0 @@
|
||||
console.log('Hello')
|
Loading…
x
Reference in New Issue
Block a user