docs
  1. SCAYLE Resource Center
  2. Onboarding Guide
  3. Onboarding: frontend
  4. Products Query

Products Query

Query products from the database

bapiClient.products.query

What is this endpoint for?

This endpoint is your go-to when you need to run queries on the Storefront API database using a set of specific criteria. You'll find yourself using this mostly on the /search page.

The endpoint allows for the following configurable criteria:

export interface ProductsSearchEndpointParameters {
    where?: ProductSearchQuery;
    sort?: ProductSortConfig;
    campaignKey?: string;
    with?: ProductWith;
    pagination?: {
        page?: number;
        perPage?: number;
    };
    includeSellableForFree?: boolean;
    includeSoldOut?: boolean;
    pricePromotionKey?: string;
    minProductId?: number;
}

export declare enum APISortOption {
    Price = "price",
    DateAdded = "new",
    Reduction = "reduction"
}
export declare enum APISortOrder {
    Ascending = "asc",
    Descending = "desc"
}
export interface ProductSortConfig {
    by?: APISortOption;
    direction?: APISortOrder;
    score?: "category_scores" | "brand_scores";
    channel?: string;
    sortingKey?: string;
}

Dev-to-Dev Hint

Get the best out of this endpoint with the useFacet composable from SFC. Here's a quick example of how it's done:

const {
      products,
      fetchingProducts,
      pagination,
      filters,
      fetchProducts: _fetchProducts,
      fetchingProductCount,
      fetchProductCount,
      productCountData,
    } = useFacet('useSearchFacet', {
      with: {
        product: {
          attributes: {
            withKey: [
              'color',
              'brand',
              'name',
              'geschlecht',
              'jerseyVariant',
              'kaeufergruppe',
              'neuManuellGruppiert',
              'sustainability',
              'sustainabilityCertificates',
              'sustainabilityIcons',
              'sustainabilityMaterials',
              'nachhaltigkeit',
              'jerseyModell',
              'sourceProduct',
            ],
          },
          advancedAttributes: {
            withKey: ['customizableProduct'],
          },
          variants: {
            attributes: {
              withKey: ['price'],
            },
          },
          images: {
            attributes: {
              withKey: [
                'imageType',
                'imageView',
                'imageBackground',
                'imageKind',
              ],
            },
          },
          priceRange: true,
          lowestPriorPrice: true,
        },
      },
    })

Example

Here’s an example of using the search term Maske on the search page, with date_newest as the sort criteria:

await _fetchProducts({
    "page": 1,
    "perPage": 24,
    "with": {
        "attributes": {
            "withKey": [
                "color",
                "brand",
                "name",
                "geschlecht",
                "jerseyVariant",
                "kaeufergruppe",
                "neuManuellGruppiert",
                "sustainability",
                "sustainabilityCertificates",
                "sustainabilityIcons",
                "sustainabilityMaterials",
                "nachhaltigkeit",
                "jerseyModell",
                "sourceProduct"
            ]
        },
        "advancedAttributes": {
            "withKey": [
                "customizableProduct"
            ]
        },
        "variants": {
            "attributes": {
                "withKey": [
                    "price"
                ]
            }
        },
        "images": {
            "attributes": {
                "withKey": [
                    "imageType",
                    "imageView",
                    "imageBackground",
                    "imageKind"
                ]
            }
        },
        "priceRange": true,
        "lowestPriorPrice": true
    },
    "category": "/",
    "where": {
        "attributes": [
            {
                "key": "includeInSearch",
                "type": "attributes",
                "values": [
                    1918,
                    1208
                ]
            }
        ],
        "term": "maske",
        "whitelistAttributes": [
            {
                "key": "includeInSearch",
                "type": "attributes",
                "values": [
                    1918,
                    1208
                ]
            }
        ]
    },
    "sort": {
        "by": "new",
        "name": "date_newest",
        "query": "date-newest"
    },
    "pricePromotionKey": ""
}

Next Steps

Search in SCAYLE Panel.