commerce/components/product/helpers.ts

import type { Product } from '@commerce/types'

export type SelectedOptions = {
  size: string | null
  color: string | null
}

export function getVariant(product: Product, opts: SelectedOptions) {
  const variant = product.variants.find((variant) => {
    return Object.entries(opts).every(([key, value]) =>
      value
        ? variant.options.find((option) => {
            if (
              option.__typename === 'MultipleChoiceOption' &&
              option.displayName.toLowerCase() === key.toLowerCase()
            ) {
              return option.values.find((v) => v.label.toLowerCase() === value)
            }
          })
        : !variant.options.find(
            (v) => v.displayName.toLowerCase() === key.toLowerCase()
          )
    )
  })
  return variant
}