forked from crowetic/commerce
Added more info about the products
This commit is contained in:
parent
526b291f4f
commit
42cb7120e5
@ -9,12 +9,15 @@ export const responsiveImageFragment = /* GraphQL */ `
|
|||||||
isDefault
|
isDefault
|
||||||
}
|
}
|
||||||
`
|
`
|
||||||
export const multipleChoiceFragment = /* GraphQL */ `
|
|
||||||
|
export const swatchOptionFragment = /* GraphQL */ `
|
||||||
fragment swatchOption on SwatchOptionValue {
|
fragment swatchOption on SwatchOptionValue {
|
||||||
isDefault
|
isDefault
|
||||||
hexColors
|
hexColors
|
||||||
}
|
}
|
||||||
|
`
|
||||||
|
|
||||||
|
export const multipleChoiceOptionFragment = /* GraphQL */ `
|
||||||
fragment multipleChoiceOption on MultipleChoiceOption {
|
fragment multipleChoiceOption on MultipleChoiceOption {
|
||||||
entityId
|
entityId
|
||||||
values {
|
values {
|
||||||
@ -26,6 +29,8 @@ export const multipleChoiceFragment = /* GraphQL */ `
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
${swatchOptionFragment}
|
||||||
`
|
`
|
||||||
|
|
||||||
export const productInfoFragment = /* GraphQL */ `
|
export const productInfoFragment = /* GraphQL */ `
|
||||||
@ -76,5 +81,22 @@ export const productInfoFragment = /* GraphQL */ `
|
|||||||
}
|
}
|
||||||
|
|
||||||
${responsiveImageFragment}
|
${responsiveImageFragment}
|
||||||
${multipleChoiceFragment}
|
${multipleChoiceOptionFragment}
|
||||||
|
`
|
||||||
|
|
||||||
|
export const productConnectionFragment = /* GraphQL */ `
|
||||||
|
fragment productConnnection on ProductConnection {
|
||||||
|
pageInfo {
|
||||||
|
startCursor
|
||||||
|
endCursor
|
||||||
|
}
|
||||||
|
edges {
|
||||||
|
cursor
|
||||||
|
node {
|
||||||
|
...productInfo
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
${productInfoFragment}
|
||||||
`
|
`
|
||||||
|
@ -4,7 +4,7 @@ import type {
|
|||||||
} from 'lib/bigcommerce/schema'
|
} from 'lib/bigcommerce/schema'
|
||||||
import type { RecursivePartial, RecursiveRequired } from '../utils/types'
|
import type { RecursivePartial, RecursiveRequired } from '../utils/types'
|
||||||
import filterEdges from '../utils/filter-edges'
|
import filterEdges from '../utils/filter-edges'
|
||||||
import { productInfoFragment } from '../fragments/product'
|
import { productConnectionFragment } from '../fragments/product'
|
||||||
import { BigcommerceConfig, getConfig, Images, ProductImageVariables } from '..'
|
import { BigcommerceConfig, getConfig, Images, ProductImageVariables } from '..'
|
||||||
|
|
||||||
export const getAllProductsQuery = /* GraphQL */ `
|
export const getAllProductsQuery = /* GraphQL */ `
|
||||||
@ -19,24 +19,33 @@ export const getAllProductsQuery = /* GraphQL */ `
|
|||||||
$imgLargeHeight: Int
|
$imgLargeHeight: Int
|
||||||
$imgXLWidth: Int = 1280
|
$imgXLWidth: Int = 1280
|
||||||
$imgXLHeight: Int
|
$imgXLHeight: Int
|
||||||
|
$featuredProducts: Boolean = false
|
||||||
|
$featuredProducts__first: Int = 10
|
||||||
|
$bestSellingProducts: Boolean = false
|
||||||
|
$bestSellingProducts__first: Int = 10
|
||||||
|
$newestProducts: Boolean = false
|
||||||
|
$newestProducts__first: Int = 10
|
||||||
) {
|
) {
|
||||||
site {
|
site {
|
||||||
products(first: $first, entityIds: $entityIds) {
|
products(first: $first, entityIds: $entityIds) {
|
||||||
pageInfo {
|
...productConnnection
|
||||||
startCursor
|
}
|
||||||
endCursor
|
featuredProducts(first: $featuredProducts__first)
|
||||||
}
|
@include(if: $featuredProducts) {
|
||||||
edges {
|
...productConnnection
|
||||||
cursor
|
}
|
||||||
node {
|
bestSellingProducts(first: $bestSellingProducts__first)
|
||||||
...productInfo
|
@include(if: $bestSellingProducts) {
|
||||||
}
|
...productConnnection
|
||||||
}
|
}
|
||||||
|
newestProducts(first: $newestProducts__first)
|
||||||
|
@include(if: $newestProducts) {
|
||||||
|
...productConnnection
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
${productInfoFragment}
|
${productConnectionFragment}
|
||||||
`
|
`
|
||||||
|
|
||||||
export type Product = NonNullable<
|
export type Product = NonNullable<
|
||||||
@ -46,10 +55,19 @@ export type Product = NonNullable<
|
|||||||
export type Products = Product[]
|
export type Products = Product[]
|
||||||
|
|
||||||
export type GetAllProductsResult<
|
export type GetAllProductsResult<
|
||||||
T extends { products: any[] } = { products: Products }
|
T extends Record<keyof GetAllProductsResult, any[]> = {
|
||||||
|
products: Products
|
||||||
|
featuredProducts: Products
|
||||||
|
bestSellingProducts: Products
|
||||||
|
newestProducts: Products
|
||||||
|
}
|
||||||
> = T
|
> = T
|
||||||
|
|
||||||
export type ProductVariables = Images &
|
export type ProductVariables = {
|
||||||
|
featured?: boolean | { first?: number }
|
||||||
|
bestSelling?: boolean | { first?: number }
|
||||||
|
newest?: boolean | { first?: number }
|
||||||
|
} & Images &
|
||||||
Omit<GetAllProductsQueryVariables, keyof ProductImageVariables>
|
Omit<GetAllProductsQueryVariables, keyof ProductImageVariables>
|
||||||
|
|
||||||
async function getAllProducts(opts?: {
|
async function getAllProducts(opts?: {
|
||||||
@ -57,7 +75,10 @@ async function getAllProducts(opts?: {
|
|||||||
config?: BigcommerceConfig
|
config?: BigcommerceConfig
|
||||||
}): Promise<GetAllProductsResult>
|
}): Promise<GetAllProductsResult>
|
||||||
|
|
||||||
async function getAllProducts<T extends { products: any[] }, V = any>(opts: {
|
async function getAllProducts<
|
||||||
|
T extends Record<keyof GetAllProductsResult, any[]>,
|
||||||
|
V = any
|
||||||
|
>(opts: {
|
||||||
query: string
|
query: string
|
||||||
variables?: V
|
variables?: V
|
||||||
config?: BigcommerceConfig
|
config?: BigcommerceConfig
|
||||||
@ -65,7 +86,7 @@ async function getAllProducts<T extends { products: any[] }, V = any>(opts: {
|
|||||||
|
|
||||||
async function getAllProducts({
|
async function getAllProducts({
|
||||||
query = getAllProductsQuery,
|
query = getAllProductsQuery,
|
||||||
variables: vars,
|
variables: { featured, bestSelling, newest, ...vars } = {},
|
||||||
config,
|
config,
|
||||||
}: {
|
}: {
|
||||||
query?: string
|
query?: string
|
||||||
@ -77,6 +98,26 @@ async function getAllProducts({
|
|||||||
...config.imageVariables,
|
...config.imageVariables,
|
||||||
...vars,
|
...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
|
// RecursivePartial forces the method to check for every prop in the data, which is
|
||||||
// required in case there's a custom `query`
|
// required in case there's a custom `query`
|
||||||
const data = await config.fetch<RecursivePartial<GetAllProductsQuery>>(
|
const data = await config.fetch<RecursivePartial<GetAllProductsQuery>>(
|
||||||
@ -85,8 +126,15 @@ async function getAllProducts({
|
|||||||
)
|
)
|
||||||
const products = data.site?.products?.edges
|
const products = data.site?.products?.edges
|
||||||
|
|
||||||
|
type P = RecursiveRequired<typeof products>
|
||||||
|
|
||||||
return {
|
return {
|
||||||
products: filterEdges(products as RecursiveRequired<typeof products>),
|
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),
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
69
lib/bigcommerce/schema.d.ts
vendored
69
lib/bigcommerce/schema.d.ts
vendored
@ -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<ProductEdge, 'cursor'> & {
|
||||||
|
node: { __typename?: 'Product' } & ProductInfoFragment
|
||||||
|
}
|
||||||
|
>
|
||||||
|
>
|
||||||
|
>
|
||||||
|
}
|
||||||
|
|
||||||
export type GetAllProductPathsQueryVariables = Exact<{ [key: string]: never }>
|
export type GetAllProductPathsQueryVariables = Exact<{ [key: string]: never }>
|
||||||
|
|
||||||
export type GetAllProductPathsQuery = { __typename?: 'Query' } & {
|
export type GetAllProductPathsQuery = { __typename?: 'Query' } & {
|
||||||
@ -1814,6 +1832,12 @@ export type GetAllProductsQueryVariables = Exact<{
|
|||||||
imgLargeHeight?: Maybe<Scalars['Int']>
|
imgLargeHeight?: Maybe<Scalars['Int']>
|
||||||
imgXLWidth?: Maybe<Scalars['Int']>
|
imgXLWidth?: Maybe<Scalars['Int']>
|
||||||
imgXLHeight?: Maybe<Scalars['Int']>
|
imgXLHeight?: Maybe<Scalars['Int']>
|
||||||
|
featuredProducts?: Maybe<Scalars['Boolean']>
|
||||||
|
featuredProducts__first?: Maybe<Scalars['Int']>
|
||||||
|
bestSellingProducts?: Maybe<Scalars['Boolean']>
|
||||||
|
bestSellingProducts__first?: Maybe<Scalars['Int']>
|
||||||
|
newestProducts?: Maybe<Scalars['Boolean']>
|
||||||
|
newestProducts__first?: Maybe<Scalars['Int']>
|
||||||
}>
|
}>
|
||||||
|
|
||||||
export type GetAllProductsQuery = { __typename?: 'Query' } & {
|
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<ProductEdge, 'cursor'> & {
|
||||||
|
node: { __typename?: 'Product' } & ProductInfoFragment
|
||||||
|
}
|
||||||
|
>
|
||||||
|
>
|
||||||
|
>
|
||||||
|
}
|
||||||
|
bestSellingProducts: { __typename?: 'ProductConnection' } & {
|
||||||
|
pageInfo: { __typename?: 'PageInfo' } & Pick<
|
||||||
|
PageInfo,
|
||||||
|
'startCursor' | 'endCursor'
|
||||||
|
>
|
||||||
|
edges?: Maybe<
|
||||||
|
Array<
|
||||||
|
Maybe<
|
||||||
|
{ __typename?: 'ProductEdge' } & Pick<ProductEdge, 'cursor'> & {
|
||||||
|
node: { __typename?: 'Product' } & ProductInfoFragment
|
||||||
|
}
|
||||||
|
>
|
||||||
|
>
|
||||||
|
>
|
||||||
|
}
|
||||||
|
newestProducts: { __typename?: 'ProductConnection' } & {
|
||||||
|
pageInfo: { __typename?: 'PageInfo' } & Pick<
|
||||||
|
PageInfo,
|
||||||
|
'startCursor' | 'endCursor'
|
||||||
|
>
|
||||||
|
edges?: Maybe<
|
||||||
|
Array<
|
||||||
|
Maybe<
|
||||||
|
{ __typename?: 'ProductEdge' } & Pick<ProductEdge, 'cursor'> & {
|
||||||
|
node: { __typename?: 'Product' } & ProductInfoFragment
|
||||||
|
}
|
||||||
|
>
|
||||||
|
>
|
||||||
|
>
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
Loading…
x
Reference in New Issue
Block a user