usePrice throws error with Typescript

[vicasas]

Using the usePrice hook doing destructuring to use price basePrice and discount this throws a Typescript error.

const { price, basePrice, discount } = usePrice({
    amount: product.offerPrice,
    baseAmount: product.price,
    currencyCode: 'CLP',
  })

const basePrice: any Property 'basePrice' does not exist on type '{ price: string; basePrice: string | null; discount: string | null; } | { price: string; }'.ts(2339)

[mauriciofragajr]

export default function usePrice(
  data?: {
    amount: number
    baseAmount?: number
    currencyCode: string
  } | null
) {
  const { amount, baseAmount, currencyCode } = data ?? {}
  const { locale } = useCommerce()
  const value = useMemo(() => {
    if (typeof amount !== 'number' || !currencyCode) return ''

    return baseAmount
      ? formatVariantPrice({ amount, baseAmount, currencyCode, locale })
      : formatPrice({ amount, currencyCode, locale })
  }, [amount, baseAmount, currencyCode])

  return typeof value === 'string' ? { price: value } : value
}

[vicasas]

@mauriciofragajr I do not understand. The error occurs precisely because of that function, since it returns two different objects and when typesript destructuring is used, it does not understand what the function returns.

[okbel]

We're going to check it! Thanks for reporting.

[leerob]

Hey there! Thank you for opening this issue. We have decided to take Next.js Commerce in a new direction and will be closing out current PRs and issues due to this change. Please see this PR for more details: https://github.com/vercel/commerce/pull/966