react-shopify-hooks v0.3.2
react-shopify-hooks
Collection of React hooks for interacting with the Shopify API.
Status
Planning. Work on implemtation.
Install
npm install --save react-shopify-hooks
API
ShopifyProvider
<ShopifyProvider
shopName="your-shop-name"
storefrontAccessToken="your-access-token"
>
{children}
</ShopifyProvider>
Context provider for all Shopify hooks. Must be used at the root of your app.
useShopifyProduct
const { product, error } = useShopifyProduct(productId)
product
All product data for the provided product IDerror
Error message if fetching product data failed
useShopifyProductVariant
const { productVariant, error } = useShopifyProductVariant(productId, productVariantId)
Fetches product variant data. Note that the parent product's ID is necessary.
Return Values
productVariant
All product variant data for the provided product variant IDerror
Error message if fetching product variant data failed
useShopifyCustomerAccessToken
const { create, renew, delete } = useShopifyCustomerAccessToken()
Manages customer access token creation, renewal, and deletion.
Return Values
Object with the following properties.
create(email, password)
Create a new customer access token. Returns the token.renew(customerAccessToken)
Renew the customer access token. Returns the renewed token.delete(customerAccessToken)
Permanently delete the customer access token.
useShopifyCheckout
const { checkout, actions, error } = useShopifyCheckout(checkoutId?)
Fetches a checkout using the provided checkout ID and provides actions for that checkout.
If no checkout ID is provided, all actions except createCheckout
will fail.
Example
const ApplyDiscountButton = ({ discountCode }) => {
const {
actions: { discountCodeApply },
} = useShopifyCheckout(myCheckoutId)
return (
<button onClick={() => discountCodeApply(discountCode)}>
Instant savings!
</button>
)
}
Return Values
Object with the following properties.
checkout
All checkout data. Data updates on successful actions.actions
Collection of functions related to the product variantcreateCheckout()
Create a new checkout. Returns the checkout ID.attributesUpdate(attributes)
Update the checkout attributes.customerAssociate(customerAccessToken)
Associate the checkout to a customer.customerDisassociate()
Disssociate the checkout from any customer.discountCodeApply(code)
Apply a discount code to the checkout.discountCodeRemove()
Remove any discount code from the checkout.emailUpdate(email)
Update the checkout's email address.giftCardsAppend(codes)
Append gift card codes to the checkout.giftCardRemove(code)
Remove the gift card code from the checkout.lineItemsReplace(lineItems)
Replace the checkout line items.shippingAddressUpdate(address)
Update the checkout's shipping address.shippingLineUpdate(handle)
Update the checkout's shipping line.
error
Error message if fetching checkout data failed.
useShopifyCustomer
const { customer, actions, error } = useShopifyCustomer(customerAccessToken?)
Fetches a customer using the provided customer access token and provides actions for that customer.
If no customer access token is provided, all actions except createCustomer
,
activateCustomer
, recoverCustomer
, resetCustomer
, and
resetCustomerByUrl
will fail.
Return Values
customer
All customer data for the provided customer access token.actions
Collection of functions related to the customer.createCustomer(email, password)
Create a new customer.activateCustomer(customerId, activationToken, password)
Activate a customer using the provided customer Id, activation token, and password.recoverCustomer(email)
Send a reset password email to the customer.resetCustomer(resetToken, password)
Reset a customer's password with the provided reset token and password.resetCustomerByUrl(resetUrl, password)
Reset a customer's password with the provided reset URL and password.addressCreate(address)
Add an address to the customer.addressDelete(addressId)
Delete a customer's address using the address ID.addressUpdate(id, address)
Update a customer's address using the address ID.addressDefaultAddressUpdate(addressId)
Set a default address for the customer.updateCustomer(attributes)
Update a customer's attributes.
error
Error message if fetching customer data failed