diff --git a/components/product/ProductCard/ProductCard.tsx b/components/product/ProductCard/ProductCard.tsx index 3d862e21e..30ffaffb1 100644 --- a/components/product/ProductCard/ProductCard.tsx +++ b/components/product/ProductCard/ProductCard.tsx @@ -1,30 +1,24 @@ import cn from 'classnames' import s from './ProductCard.module.css' import { FC, ReactNode, Component } from 'react' +import type { Product } from '@lib/bigcommerce/api/operations/get-all-products' import { Heart } from '@components/icon' import Link from 'next/link' interface Props { className?: string children?: ReactNode[] | Component[] | any[] - node: ProductData + product: Product['node'] variant?: 'slim' | 'simple' } -interface ProductData { - name: string - images: any - prices: any - path: string -} - -const ProductCard: FC = ({ className, node: p, variant }) => { +const ProductCard: FC = ({ className, product: p, variant }) => { if (variant === 'slim') { return (
@@ -41,7 +35,7 @@ const ProductCard: FC = ({ className, node: p, variant }) => {
@@ -50,7 +44,7 @@ const ProductCard: FC = ({ className, node: p, variant }) => {

{p.name}

- ${p.prices.price.value} + ${p.prices?.price.value}
diff --git a/lib/bigcommerce/api/operations/get-all-products.ts b/lib/bigcommerce/api/operations/get-all-products.ts index 5b3bd1f8b..39f7ba147 100644 --- a/lib/bigcommerce/api/operations/get-all-products.ts +++ b/lib/bigcommerce/api/operations/get-all-products.ts @@ -43,11 +43,13 @@ export const getAllProductsQuery = /* GraphQL */ ` ${productConnectionFragment} ` -export type Product = NonNullable< +export type ProductEdge = NonNullable< NonNullable[0] > -export type Products = Product[] +export type Product = ProductEdge + +export type Products = ProductEdge[] export type GetAllProductsResult< T extends Record = { products: Products } diff --git a/lib/bigcommerce/api/utils/fetch-graphql-api.ts b/lib/bigcommerce/api/utils/fetch-graphql-api.ts index 26246249c..aaf6e75ea 100644 --- a/lib/bigcommerce/api/utils/fetch-graphql-api.ts +++ b/lib/bigcommerce/api/utils/fetch-graphql-api.ts @@ -6,7 +6,7 @@ export default async function fetchGraphqlApi( query: string, { variables, preview }: CommerceAPIFetchOptions = {} ): Promise { - log.warn(query) + // log.warn(query) const config = getConfig() const res = await fetch(config.commerceUrl + (preview ? '/preview' : ''), { method: 'POST', diff --git a/pages/index.tsx b/pages/index.tsx index 253cec917..65afe747f 100644 --- a/pages/index.tsx +++ b/pages/index.tsx @@ -28,13 +28,13 @@ export default function Home({ return (
- {featuredProducts.map((p: any) => ( - + {featuredProducts.map(({ node }) => ( + ))} - {products.slice(0, 3).map((p: any) => ( - + {products.slice(0, 3).map(({ node }) => ( + ))} - {products.slice(3, 6).map((p: any) => ( - + {products.slice(3, 6).map(({ node }) => ( + ))} - {products.slice(0, 3).map((p: any) => ( - + {products.slice(0, 3).map(({ node }) => ( + ))}
@@ -84,8 +84,8 @@ export default function Home({
- {products.map((p: any) => ( - + {products.map(({ node }) => ( + ))}
diff --git a/pages/search.tsx b/pages/search.tsx index 7d0721f3f..391acf22e 100644 --- a/pages/search.tsx +++ b/pages/search.tsx @@ -141,10 +141,11 @@ export default function Search({ {data ? ( - {data.products.map((p: any) => ( + {data.products.map(({ node }) => ( ))}