website logo
Navigate through spaces
⌘K
OVERVIEW
ORDER MANAGEMENT (OMS)
SHIPPING - SETUP
Shipping Methods
Shipping Zones
Shipping Method Setup Examples
TAXES - Setup
Tax Automation with Stripe Tax
Tax Automation with Avalara
CONTENT MANAGEMENT (CMS)
DATA
CUSTOMER LIFETIME REVENUE
Customer Lifetime Revenue Explanation
Customer Lifetime Revenue and Purchase Likelihood
Recency Frequency and Monetary
CLR and RFM Data Table Glossary
RFM and CLR in the Hub
LOOKER
Modifying a Dashboard
Timestamp differences between Looker, OMS and Shopify
How to create custom calculations in Looker
Looker and Shopify data models
Custom fields
How to 'Save and Schedule' reports
Creating Custom Reports or Look
Looks vs Dashboards
Login Looker FAQ
Looker Glossary
SEGMENT EVENT TRACKING
What are event tracking
Adding Tracking
What is the Tracking Plan?
The Chord Tracking Plan
The Shopify Tracking Plan
Event Tracking FAQ
EVENT UPDATES PAGE
Email Subscription Payment Event Update
Product Feed Setup
Getting Segment to Production
Consent Management
Installing in Next.js
Installing in Gatsby
Integrations
👩‍💻Developer Tools
Using Chord with Shopify
Docs powered by archbee 

useSubscription

16min

This page's documentation only applies to Chord's Next.js starter prior to the release of the React. The Next.js starter now uses the React SDK and does not use the methods documented on this page. Check out the React SDK Reference for complete documentation, and the React SDK Migration Guidefor details on how to upgrade.

The useSubscription hook returns the current loaded subscription and functions for managing the subscription.

Example

JS
|
import { useSubscription } from '~/hooks/actions'

export default () => {  
  const { subscription } = useSubscription()
  
  return (    
    <p>Your subscription will be renewed on {subscription.actionableDate}</p>  
  )
}

JS
|
import { useSubscription } from '~/hooks/actions'

// inside a function component
const { subscripion, loadSubscription } = useSubscription()


Returns

The useSubscription hook returns an object with these properties:

Property

Description

subscription

An object representing a subscription. You will need to explicitly call loadSubscription before this object will be populated.

loadSubscription

A function that loads the subscription.

skipSubscription

A function that skips the next subscription delivery.

cancelSubscription

A function that cancels the subscription.

pauseSubscription

A function that pauses the subscription.

resumeSubscription

A function that resumes the subscription.

updateSubscription

A function that updates the subscription.

Functions

loadSubscription

The loadSubscription function loads information about the subscription from the Chord API.

Arguments:

loadSubscription(subscriptionId)

Argument

Type

Description

subscriptionId

Number

The id of the subscription to load.

Returns:

Promise<Subscription>: A Promise that resolves with the subscription.

Example:

JS
|
import { useSubscription } from '~/hooks/actions'

export default subscriptionId => {  
  const { subscription, loadSubscription } = useSubscription()
  
  useEffect(() => {    
    loadSubscription(subscriptionId)  
  }, [])
  
  return (    
    <p>Your subscription will be renewed on {subscription.actionableDate}</p>
  )
}


skipSubscription

The skipSubscription function calls the Chord API to skip the next subscription delivery.

Arguments:

None.

Returns:

Promise<Subscription>: A Promise that resolves with the subscription.

Example:

JS
|
import { useSubscription } from '~/hooks/actions'

export default subscriptionId => {  
  const { subscription, skipSubscription } = useSubscription()
  
  useEffect(() => {    
    skipSubscription()
  }, [])
  
  return (    
    <p>Your subscription will be renewed on {subscription.actionableDate}</p>  
  )
}


cancelSubscription

The cancelSubscription function calls the Chord API to cancel a subscription.

Arguments:

None.

Returns:

Promise<Subscription>: A Promise that resolves with the subscription.

Example:

JS
|
import { useSubscription } from '~/hooks/actions'

export default subscriptionId => {  
  const { subscription, cancelSubscription } = useSubscription()
  
  useEffect(() => {    
    cancelSubscription()  
  }, [])
  
  return <p>Your subscription was canceled</p>
}


pauseSubscription

ThepauseSubscription function calls the Chord API to pause a subscription.

Paused subscriptions will not be processed until manuallyresumedor theactionableDateis reached.

Arguments:

pauseSubscription(options)

Argument

Type

Description

options?.actionableDate?

String

(Optional): A date string representing when the subscription should resume. The minimum date is the next day. If actionableDate is omitted, the subscription will be paused indefinitely.

Returns:

Promise<Subscription>: A Promise that resolves with the subscription.

Example:

JS
|
import { useSubscription } from '~/hooks/actions'

export default () => {  
  const { pauseSubscription } = useSubscription(subscription.id)  
  const onSubmit = async data => {
    try {
      let response = await pauseSubscription({
        'actionableDate': '2030-08-18'
      })
      console.log(response)
    } catch (error) {
      console.error(error) 
    }
  }
}


resumeSubscription

TheresumeSubscriptionfunction calls the Chord API to resume a subscription.

Paused subscriptions will not be processed until manuallyresumedor theactionableDateis reached.

Arguments:

resumeSubscription(options)

Argument

Type

Description

options?.actionableDate?

String

(Optional): A date string representing when the subscription should resume. The minimum date is the next day. If actionableDate is omitted, the subscription will be resumed the next day.

Returns:

Promise<Subscription>: A Promise that resolves with the subscription.

Example:

JS
|
import { useSubscription } from '~/hooks/actions'

export default () => {  
  const { resumeSubscription } = useSubscription(subscription.id)  
  const onSubmit = async data => {
    try {
      let response = await resumeSubscription({
        'actionableDate': '2030-08-18'
      })
      console.log(response)
    } catch (error) {
      console.error(error) 
    }
  }
}


updateSubscription

TheupdateSubscription function calls the Chord API to update a subscription.

Arguments:

updateSubscription(options)

Argument

Type

Description

options.actionableDate?

String

(Optional): A date string representing when the subscription should resume. The minimum date is the next day. If actionableDate is omitted, the subscription will be resumed the next day.

options.billAddressAttributes?

Object

(Optional) An object representing the billing address. All fields need to be sent even if only a single field is updated.

options.endDate?

String | Null

(Optional) A string representing the end date of the subscription. If null, the subscription will renew indefinitely.

options.shipAddressAttributes?

Object

(Optional) An object representing the shipping address. All fields need to be sent even if only a single field is updated.

options.intervalLength?

Number

(Optional): The number of units. Example: if the subscription should be delivered every three months, this would be 3.

options.intervalUnit?

"day" | "week" | "month" | "year"

(Optional): The interval unit. Example: if the subscription should be delivered every three months, this would be month.

Returns:

Promise<Subscription>: A Promise that resolves with the subscription.

Example:

JS
|
import { useSubscription } from '~/hooks/actions'

export default () => {  
  const { updateSubscription } = useSubscription(subscription.id)  
  const onSubmit = async data => {
    try {
      let response = await updateSubscription({
        'shipAddressAttributes': data.addressAttributes,
        'billAddressAttributes': data.addressAttributes,
        'intervalUnits': 'month',
        'intervalLength': 2, 
        'endDate': '2021/12/31',
        'actionableDate': '2030-08-18'
      })
      console.log(response)
    } catch (error) {
      console.error(error) 
    }
  }
}

/*
  Default Form Values:
  
  const address = subscription['shipAddress']
  const addressAttributes = {
    name: address.name,
    address1: address.address1,
    address2: address.address2,
    city: address.city,
    state_name: address.state.abbr,
    country_iso: address.country.iso,
    zipcode: address.zipcode
  }
*/




Updated 03 Mar 2023
Did this page help you?
Yes
No
PREVIOUS
useProduct
NEXT
useSubscriptions
Docs powered by archbee 
TABLE OF CONTENTS
Example
Returns
Functions
loadSubscription
skipSubscription
cancelSubscription
pauseSubscription
resumeSubscription
updateSubscription