From 42cb7120e55acaf2ee8b69b7b1e95052dae8802b Mon Sep 17 00:00:00 2001 From: Luis Alvarez Date: Sun, 18 Oct 2020 15:23:17 -0500 Subject: [PATCH] Added more info about the products --- lib/bigcommerce/api/fragments/product.ts | 26 +++++- .../api/operations/get-all-products.ts | 82 +++++++++++++++---- lib/bigcommerce/schema.d.ts | 69 ++++++++++++++++ 3 files changed, 158 insertions(+), 19 deletions(-) diff --git a/lib/bigcommerce/api/fragments/product.ts b/lib/bigcommerce/api/fragments/product.ts index d047e147a..7c81e0b2e 100644 --- a/lib/bigcommerce/api/fragments/product.ts +++ b/lib/bigcommerce/api/fragments/product.ts @@ -9,12 +9,15 @@ export const responsiveImageFragment = /* GraphQL */ ` isDefault } ` -export const multipleChoiceFragment = /* GraphQL */ ` + +export const swatchOptionFragment = /* GraphQL */ ` fragment swatchOption on SwatchOptionValue { isDefault hexColors } +` +export const multipleChoiceOptionFragment = /* GraphQL */ ` fragment multipleChoiceOption on MultipleChoiceOption { entityId values { @@ -26,6 +29,8 @@ export const multipleChoiceFragment = /* GraphQL */ ` } } } + + ${swatchOptionFragment} ` export const productInfoFragment = /* GraphQL */ ` @@ -76,5 +81,22 @@ export const productInfoFragment = /* GraphQL */ ` } ${responsiveImageFragment} - ${multipleChoiceFragment} + ${multipleChoiceOptionFragment} +` + +export const productConnectionFragment = /* GraphQL */ ` + fragment productConnnection on ProductConnection { + pageInfo { + startCursor + endCursor + } + edges { + cursor + node { + ...productInfo + } + } + } + + ${productInfoFragment} ` diff --git a/lib/bigcommerce/api/operations/get-all-products.ts b/lib/bigcommerce/api/operations/get-all-products.ts index e1b094cac..e83eb7464 100644 --- a/lib/bigcommerce/api/operations/get-all-products.ts +++ b/lib/bigcommerce/api/operations/get-all-products.ts @@ -4,7 +4,7 @@ import type { } from 'lib/bigcommerce/schema' import type { RecursivePartial, RecursiveRequired } from '../utils/types' import filterEdges from '../utils/filter-edges' -import { productInfoFragment } from '../fragments/product' +import { productConnectionFragment } from '../fragments/product' import { BigcommerceConfig, getConfig, Images, ProductImageVariables } from '..' export const getAllProductsQuery = /* GraphQL */ ` @@ -19,24 +19,33 @@ export const getAllProductsQuery = /* GraphQL */ ` $imgLargeHeight: Int $imgXLWidth: Int = 1280 $imgXLHeight: Int + $featuredProducts: Boolean = false + $featuredProducts__first: Int = 10 + $bestSellingProducts: Boolean = false + $bestSellingProducts__first: Int = 10 + $newestProducts: Boolean = false + $newestProducts__first: Int = 10 ) { site { products(first: $first, entityIds: $entityIds) { - pageInfo { - startCursor - endCursor - } - edges { - cursor - node { - ...productInfo - } - } + ...productConnnection + } + featuredProducts(first: $featuredProducts__first) + @include(if: $featuredProducts) { + ...productConnnection + } + bestSellingProducts(first: $bestSellingProducts__first) + @include(if: $bestSellingProducts) { + ...productConnnection + } + newestProducts(first: $newestProducts__first) + @include(if: $newestProducts) { + ...productConnnection } } } - ${productInfoFragment} + ${productConnectionFragment} ` export type Product = NonNullable< @@ -46,10 +55,19 @@ export type Product = NonNullable< export type Products = Product[] export type GetAllProductsResult< - T extends { products: any[] } = { products: Products } + T extends Record = { + products: Products + featuredProducts: Products + bestSellingProducts: Products + newestProducts: Products + } > = T -export type ProductVariables = Images & +export type ProductVariables = { + featured?: boolean | { first?: number } + bestSelling?: boolean | { first?: number } + newest?: boolean | { first?: number } +} & Images & Omit async function getAllProducts(opts?: { @@ -57,7 +75,10 @@ async function getAllProducts(opts?: { config?: BigcommerceConfig }): Promise -async function getAllProducts(opts: { +async function getAllProducts< + T extends Record, + V = any +>(opts: { query: string variables?: V config?: BigcommerceConfig @@ -65,7 +86,7 @@ async function getAllProducts(opts: { async function getAllProducts({ query = getAllProductsQuery, - variables: vars, + variables: { featured, bestSelling, newest, ...vars } = {}, config, }: { query?: string @@ -77,6 +98,26 @@ async function getAllProducts({ ...config.imageVariables, ...vars, } + + if (bestSelling) { + variables.bestSellingProducts = true + if (typeof bestSelling === 'object' && bestSelling.first) { + variables.bestSellingProducts__first = bestSelling.first + } + } + if (featured) { + variables.featuredProducts = true + if (typeof featured === 'object' && featured.first) { + variables.featuredProducts__first = featured.first + } + } + if (newest) { + variables.newestProducts = true + if (typeof newest === 'object' && newest.first) { + variables.newestProducts__first = newest.first + } + } + // RecursivePartial forces the method to check for every prop in the data, which is // required in case there's a custom `query` const data = await config.fetch>( @@ -85,8 +126,15 @@ async function getAllProducts({ ) const products = data.site?.products?.edges + type P = RecursiveRequired + return { - products: filterEdges(products as RecursiveRequired), + products: filterEdges(products as P), + featuredProducts: filterEdges(data.site?.featuredProducts?.edges as P), + bestSellingProducts: filterEdges( + data.site?.bestSellingProducts?.edges as P + ), + newestProducts: filterEdges(data.site?.newestProducts?.edges as P), } } diff --git a/lib/bigcommerce/schema.d.ts b/lib/bigcommerce/schema.d.ts index 6bd4ee8e0..4d13e92d3 100644 --- a/lib/bigcommerce/schema.d.ts +++ b/lib/bigcommerce/schema.d.ts @@ -1785,6 +1785,24 @@ export type ProductInfoFragment = { __typename?: 'Product' } & Pick< } } +export type ProductConnnectionFragment = { + __typename?: 'ProductConnection' +} & { + pageInfo: { __typename?: 'PageInfo' } & Pick< + PageInfo, + 'startCursor' | 'endCursor' + > + edges?: Maybe< + Array< + Maybe< + { __typename?: 'ProductEdge' } & Pick & { + node: { __typename?: 'Product' } & ProductInfoFragment + } + > + > + > +} + export type GetAllProductPathsQueryVariables = Exact<{ [key: string]: never }> export type GetAllProductPathsQuery = { __typename?: 'Query' } & { @@ -1814,6 +1832,12 @@ export type GetAllProductsQueryVariables = Exact<{ imgLargeHeight?: Maybe imgXLWidth?: Maybe imgXLHeight?: Maybe + featuredProducts?: Maybe + featuredProducts__first?: Maybe + bestSellingProducts?: Maybe + bestSellingProducts__first?: Maybe + newestProducts?: Maybe + newestProducts__first?: Maybe }> export type GetAllProductsQuery = { __typename?: 'Query' } & { @@ -1833,6 +1857,51 @@ export type GetAllProductsQuery = { __typename?: 'Query' } & { > > } + featuredProducts: { __typename?: 'ProductConnection' } & { + pageInfo: { __typename?: 'PageInfo' } & Pick< + PageInfo, + 'startCursor' | 'endCursor' + > + edges?: Maybe< + Array< + Maybe< + { __typename?: 'ProductEdge' } & Pick & { + node: { __typename?: 'Product' } & ProductInfoFragment + } + > + > + > + } + bestSellingProducts: { __typename?: 'ProductConnection' } & { + pageInfo: { __typename?: 'PageInfo' } & Pick< + PageInfo, + 'startCursor' | 'endCursor' + > + edges?: Maybe< + Array< + Maybe< + { __typename?: 'ProductEdge' } & Pick & { + node: { __typename?: 'Product' } & ProductInfoFragment + } + > + > + > + } + newestProducts: { __typename?: 'ProductConnection' } & { + pageInfo: { __typename?: 'PageInfo' } & Pick< + PageInfo, + 'startCursor' | 'endCursor' + > + edges?: Maybe< + Array< + Maybe< + { __typename?: 'ProductEdge' } & Pick & { + node: { __typename?: 'Product' } & ProductInfoFragment + } + > + > + > + } } }