Interfaces
Interface: UseProduct

﻿react-autonomy﻿.UseProduct
UseProduct contains the data and methods returned by the useProduct﻿
hook.
Properties
createStockRequest
• createStockRequest: (options: CreateStockRequest﻿) => Promise<void>
Type declaration
▸ (options): Promise<void>
The createStockRequest adds the customer to a product variant wait list
in the OMS. When the variant is marked back in stock, customers on the wait
list will automatically receive an email notification.
﻿
JS
import { useProduct } from '@chordcommerce/react-autonomy'

const NotifyWhenBackInStockButton = ({ email, product }) => {
  const { createStockRequest } = useProduct()

  const onClick = () => createStockRequest({ email, product })

  return <button onClick={onClick}>Notify</button>
}
import { useProduct } from '@chordcommerce/react-autonomy'

const NotifyWhenBackInStockButton = ({ email, product }) => {
  const { createStockRequest } = useProduct()

  const onClick = () => createStockRequest({ email, product })

  return <button onClick={onClick}>Notify</button>
}
﻿
Parameters
Name
Type
options
﻿CreateStockRequest﻿﻿
Returns
Promise<void>
A Promise that resolves when the stock request has been created.
Defined in
﻿packages/react-autonomy/src/hooks/use-product.ts:88﻿
﻿
getPrice
• getPrice: (input: VariantPriceInput﻿) => Promise<VariantPrice﻿>
Type declaration
▸ (input): Promise<VariantPrice﻿>
The getPrice method returns the price (including discount if applicable)
for a produuct's variant by providing a SKU.
﻿
JS
import { useProduct, useCart } from '@chordcommerce/react-autonomy'
import { useState, useEffect } from 'react'

const BuyNowButton = ({ sku }) => {
  const { getPrice } = useProduct()
  const { addToCart } = useCart()
  const [price, setPrice] = useState()

  useEffect(() => {
    getPrice({ sku }).then(data => {
      setPrice(data)
    })
  }, [getPrice, sku])

  return (
    <>
      <div><>{price.price}</div>
      <div><>{price.discountPrice}</div>
    </>
  )
}
import { useProduct, useCart } from '@chordcommerce/react-autonomy'
import { useState, useEffect } from 'react'

const BuyNowButton = ({ sku }) => {
  const { getPrice } = useProduct()
  const { addToCart } = useCart()
  const [price, setPrice] = useState()

  useEffect(() => {
    getPrice({ sku }).then(data => {
      setPrice(data)
    })
  }, [getPrice, sku])

  return (
    <>
      <div><>{price.price}</div>
      <div><>{price.discountPrice}</div>
    </>
  )
}
﻿
Parameters
Name
Type
input
﻿VariantPriceInput﻿﻿
Returns
Promise<VariantPrice﻿>
A Promise that resolves with the price of the SKU.
Defined in
﻿packages/react-autonomy/src/hooks/use-product.ts:158﻿
﻿
getStockAvailability
• getStockAvailability: (input: VariantStockAvailabilityInput﻿) => Promise<VariantStockAvailability﻿>
Type declaration
▸ (input): Promise<VariantStockAvailability﻿>
The getStockAvailability method returns the stock availability for
a produuct's variant by providing a SKU.
﻿
JS
import { useProduct, useCart } from '@chordcommerce/react-autonomy'
import { useState, useEffect } from 'react'

const BuyNowButton = ({ sku }) => {
  const { getStockAvailability } = useProduct()
  const { addToCart } = useCart()
  const [inStock, setInStock] = useState(false)

  useEffect(() => {
    getStockAvailability({ sku }).then(availability => {
      setInStock(availability.inStock)
    })
  }, [getStockAvailability, sku])

  return (
    <button
      onClick={() => addToCart({ sku, quantity: 1 })}
      disabled={!inStock}
    >
      Buy Now!
    </button>
  )
}
import { useProduct, useCart } from '@chordcommerce/react-autonomy'
import { useState, useEffect } from 'react'

const BuyNowButton = ({ sku }) => {
  const { getStockAvailability } = useProduct()
  const { addToCart } = useCart()
  const [inStock, setInStock] = useState(false)

  useEffect(() => {
    getStockAvailability({ sku }).then(availability => {
      setInStock(availability.inStock)
    })
  }, [getStockAvailability, sku])

  return (
    <button
      onClick={() => addToCart({ sku, quantity: 1 })}
      disabled={!inStock}
    >
      Buy Now!
    </button>
  )
}
﻿
Parameters
Name
Type
input
﻿VariantStockAvailabilityInput﻿﻿
Returns
Promise<VariantStockAvailability﻿>
A Promise that resolves with the stock availability of the SKU.
Defined in
﻿packages/react-autonomy/src/hooks/use-product.ts:123﻿
Name	Type
options	CreateStockRequest
Name	Type
input	VariantPriceInput
Name	Type
input	VariantStockAvailabilityInput
Updated 25 Mar 2024
Interface: UseOrders
Interface: UseSubscription