Attributes normalizer

Attributes are Unified Data Layer representation of BigCommerce options. The normalizeAttribute function maps the variant's or cart item option into an SfAttribute.

Parameters

Name	Type	Default value	Description
`context`	`NormalizerContext`		Context which contains e.g. `currency`
`option`	`ProductVariantOptionValue` or `CartItemBase["options"][0]`		BigCommerce ProductVariant.

Extending

The SfAttribute is returned as a part of SfProduct, SfOrder and SfCart. If you want to extend the SfAttribute with custom fields, you should use the addCustomFields API.

import { normalizers } from "@vsf-enterprise/unified-api-bigcommerce";

export const unifiedApiExtension = createUnifiedExtension({
  normalizers: {
    addCustomFields: [
      {
        normalizeAttribute: (context, option) => {
          const normalizedAttribute = normalizers.normalizeAttribute(context, option);
          
          if (normalizedAttribute) {
            return {
              someNewField: "someValue",
            };
          }
          
          return null;
        },
      },
    ],
  },
  config: {
    ...
  },
});

Source

Please note that the normalizeAttribute has a different type - ProductVariantOptionValue or CartItemBase["options"][0] depending on the context in which it is used. We use a type guard to determine the type of the option.

attributes.ts

import type { ProductVariantOptionValue } from "@vsf-enterprise/bigcommerce-api";
import { defineNormalizer } from "../defineNormalizer";
import type { NormalizeAttributeInput } from "../types";

const isProductVariantOptionValue = (
  option: NormalizeAttributeInput,
): option is ProductVariantOptionValue => {
  return (option as ProductVariantOptionValue).option_display_name !== undefined;
};

export const normalizeAttribute = defineNormalizer.normalizeAttribute((context, option) => {
  if (isProductVariantOptionValue(option)) {
    return {
      name: option.option_display_name,
      value: option.id.toString(),
      valueLabel: option.label,
      label: option.option_display_name,
    };
  }

  if (!option.nameId || !option.valueId) {
    return null;
  }

  return {
    name: option.nameId.toString(),
    value: option.valueId.toString(),
    valueLabel: option.value || option.valueId.toString(),
    label: option.name || option.nameId.toString(),
  };
});