forked from crowetic/commerce
Use fragments
This commit is contained in:
66
lib/bigcommerce/api/fragments/product.ts
Normal file
66
lib/bigcommerce/api/fragments/product.ts
Normal file
@@ -0,0 +1,66 @@
|
||||
export const responsiveImageFragment = /* GraphQL */ `
|
||||
fragment responsiveImage on Image {
|
||||
urlSmall: url(width: $imgSmallWidth, height: $imgSmallHeight)
|
||||
urlMedium: url(width: $imgMediumWidth, height: $imgMediumHeight)
|
||||
urlLarge: url(width: $imgLargeWidth, height: $imgLargeHeight)
|
||||
urlXL: url(width: $imgXLWidth, height: $imgXLHeight)
|
||||
}
|
||||
`;
|
||||
|
||||
export const productInfoFragment = /* GraphQL */ `
|
||||
fragment productInfo on Product {
|
||||
entityId
|
||||
name
|
||||
path
|
||||
brand {
|
||||
name
|
||||
}
|
||||
description
|
||||
prices {
|
||||
price {
|
||||
value
|
||||
currencyCode
|
||||
}
|
||||
salePrice {
|
||||
value
|
||||
currencyCode
|
||||
}
|
||||
}
|
||||
images {
|
||||
edges {
|
||||
node {
|
||||
...responsiveImage
|
||||
}
|
||||
}
|
||||
}
|
||||
variants {
|
||||
edges {
|
||||
node {
|
||||
entityId
|
||||
defaultImage {
|
||||
...responsiveImage
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
options {
|
||||
edges {
|
||||
node {
|
||||
entityId
|
||||
displayName
|
||||
isRequired
|
||||
values {
|
||||
edges {
|
||||
node {
|
||||
entityId
|
||||
label
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
${responsiveImageFragment}
|
||||
`;
|
@@ -2,7 +2,8 @@ import type {
|
||||
GetAllProductsQuery,
|
||||
GetAllProductsQueryVariables,
|
||||
} from 'lib/bigcommerce/schema';
|
||||
import type { RecursivePartial, RecursiveRequired } from '../types';
|
||||
import type { RecursivePartial, RecursiveRequired } from '../utils/types';
|
||||
import { productInfoFragment } from '../fragments/product';
|
||||
import { getConfig, Images, ProductImageVariables } from '..';
|
||||
|
||||
export const getAllProductsQuery = /* GraphQL */ `
|
||||
@@ -26,80 +27,14 @@ export const getAllProductsQuery = /* GraphQL */ `
|
||||
edges {
|
||||
cursor
|
||||
node {
|
||||
entityId
|
||||
name
|
||||
path
|
||||
brand {
|
||||
name
|
||||
}
|
||||
description
|
||||
prices {
|
||||
price {
|
||||
value
|
||||
currencyCode
|
||||
}
|
||||
salePrice {
|
||||
value
|
||||
currencyCode
|
||||
}
|
||||
}
|
||||
images {
|
||||
edges {
|
||||
node {
|
||||
urlSmall: url(width: $imgSmallWidth, height: $imgSmallHeight)
|
||||
urlMedium: url(
|
||||
width: $imgMediumWidth
|
||||
height: $imgMediumHeight
|
||||
)
|
||||
urlLarge: url(width: $imgLargeWidth, height: $imgLargeHeight)
|
||||
urlXL: url(width: $imgXLWidth, height: $imgXLHeight)
|
||||
}
|
||||
}
|
||||
}
|
||||
variants {
|
||||
edges {
|
||||
node {
|
||||
entityId
|
||||
defaultImage {
|
||||
urlSmall: url(
|
||||
width: $imgSmallWidth
|
||||
height: $imgSmallHeight
|
||||
)
|
||||
urlMedium: url(
|
||||
width: $imgMediumWidth
|
||||
height: $imgMediumHeight
|
||||
)
|
||||
urlLarge: url(
|
||||
width: $imgLargeWidth
|
||||
height: $imgLargeHeight
|
||||
)
|
||||
urlXL: url(width: $imgXLWidth, height: $imgXLHeight)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
options {
|
||||
edges {
|
||||
node {
|
||||
entityId
|
||||
displayName
|
||||
isRequired
|
||||
values {
|
||||
edges {
|
||||
node {
|
||||
entityId
|
||||
label
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
...productInfo
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
${productInfoFragment}
|
||||
`;
|
||||
|
||||
export interface GetAllProductsResult<T> {
|
||||
|
@@ -2,7 +2,8 @@ import type {
|
||||
GetProductQuery,
|
||||
GetProductQueryVariables,
|
||||
} from 'lib/bigcommerce/schema';
|
||||
import type { RecursivePartial, RecursiveRequired } from '../types';
|
||||
import type { RecursivePartial, RecursiveRequired } from '../utils/types';
|
||||
import { productInfoFragment } from '../fragments/product';
|
||||
import { getConfig, Images, ProductImageVariables } from '..';
|
||||
|
||||
export const getProductQuery = /* GraphQL */ `
|
||||
@@ -22,65 +23,14 @@ export const getProductQuery = /* GraphQL */ `
|
||||
node {
|
||||
__typename
|
||||
... on Product {
|
||||
entityId
|
||||
name
|
||||
path
|
||||
brand {
|
||||
name
|
||||
}
|
||||
description
|
||||
prices {
|
||||
price {
|
||||
currencyCode
|
||||
value
|
||||
}
|
||||
salePrice {
|
||||
currencyCode
|
||||
value
|
||||
}
|
||||
}
|
||||
images {
|
||||
edges {
|
||||
node {
|
||||
urlSmall: url(width: $imgSmallWidth, height: $imgSmallHeight)
|
||||
urlMedium: url(
|
||||
width: $imgMediumWidth
|
||||
height: $imgMediumHeight
|
||||
)
|
||||
urlLarge: url(width: $imgLargeWidth, height: $imgLargeHeight)
|
||||
urlXL: url(width: $imgXLWidth, height: $imgXLHeight)
|
||||
}
|
||||
}
|
||||
}
|
||||
variants {
|
||||
edges {
|
||||
node {
|
||||
entityId
|
||||
}
|
||||
}
|
||||
}
|
||||
options {
|
||||
edges {
|
||||
node {
|
||||
entityId
|
||||
displayName
|
||||
isRequired
|
||||
values {
|
||||
edges {
|
||||
node {
|
||||
entityId
|
||||
label
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
...productInfo
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
${productInfoFragment}
|
||||
`;
|
||||
|
||||
export interface GetProductResult<T> {
|
||||
|
Reference in New Issue
Block a user