Merge pull request #662 from Jose10go/main

Expose Start Checklist

.changeset/lazy-countries-obey.md

@@ -0,0 +1,5 @@
+---
+'react-use-intercom': minor
+---
+
+Expose startChecklist method in useIntercom hook

README.md

@@ -144,6 +144,7 @@ Used to retrieve all methods bundled with Intercom. These are based on the offic
 | showNewMessage  | (content?: string) => void                 | shows the Messenger as if a new conversation was just created. If `content` is passed, it will fill in the message composer         |
 | getVisitorId    | () => string                               | gets the visitor id                                                                                                                 |
 | startTour       | (tourId: number) => void                   | starts a tour based on the `tourId`                                                                                                 |
+| startChecklist       | (checklistId: number) => void                   | starts a checklist based on the `checklistId`                                                                                                 |
 | trackEvent      | (event: string, metaData?: object) => void | submits an `event` with optional `metaData`      
 | showArticle      | (articleId: string) => void | opens the Messenger with the specified article by `articleId`
 | startSurvey      | (surveyId: number) => void | Trigger a survey in the Messenger by `surveyId`
@@ -177,6 +178,7 @@ const HomePage = () => {
     showNewMessage,
     getVisitorId,
     startTour,
+    startChecklist,
     trackEvent,
     showArticle,
     startSurvey,
@@ -189,6 +191,7 @@ const HomePage = () => {
   const handleNewMessagesWithContent = () => showNewMessage('content');
   const handleGetVisitorId = () => console.log(getVisitorId());
   const handleStartTour = () => startTour(123);
+  const handleStartChecklist= () => startChecklist(456);
   const handleTrackEvent = () => trackEvent('invited-friend');
   const handleTrackEventWithMetaData = () =>
     trackEvent('invited-frind', {
@@ -215,6 +218,7 @@ const HomePage = () => {
       </button>
       <button onClick={handleGetVisitorId}>Get visitor id</button>
       <button onClick={handleStartTour}>Start tour</button>
+      <button onClick={handleStartChecklist}>Start checklist</button>
       <button onClick={handleTrackEvent}>Track event</button>
       <button onClick={handleTrackEventWithMetaData}>
         Track event with metadata

packages/react-use-intercom/README.md

@@ -144,6 +144,7 @@ Used to retrieve all methods bundled with Intercom. These are based on the offic
 | showNewMessage  | (content?: string) => void                 | shows the Messenger as if a new conversation was just created. If `content` is passed, it will fill in the message composer         |
 | getVisitorId    | () => string                               | gets the visitor id                                                                                                                 |
 | startTour       | (tourId: number) => void                   | starts a tour based on the `tourId`                                                                                                 |
+| startChecklist       | (checklistId: number) => void                   | starts a checklist based on the `checklistId`                                                                                                 |
 | trackEvent      | (event: string, metaData?: object) => void | submits an `event` with optional `metaData`      
 | showArticle      | (articleId: string) => void | opens the Messenger with the specified article by `articleId`
 | startSurvey      | (surveyId: number) => void | Trigger a survey in the Messenger by `surveyId`
@@ -175,6 +176,7 @@ const HomePage = () => {
     showNewMessage,
     getVisitorId,
     startTour,
+    startChecklist,
     trackEvent,
     showArticle,
     startSurvey,
@@ -187,6 +189,7 @@ const HomePage = () => {
   const handleNewMessagesWithContent = () => showNewMessage('content');
   const handleGetVisitorId = () => console.log(getVisitorId());
   const handleStartTour = () => startTour(123);
+  const handleStartChecklist = () => startChecklist(456);
   const handleTrackEvent = () => trackEvent('invited-friend');
   const handleTrackEventWithMetaData = () =>
     trackEvent('invited-frind', {
@@ -213,6 +216,7 @@ const HomePage = () => {
       </button>
       <button onClick={handleGetVisitorId}>Get visitor id</button>
       <button onClick={handleStartTour}>Start tour</button>
+      <button onClick={handleStartChecklist}>Start checklist</button>
       <button onClick={handleTrackEvent}>Track event</button>
       <button onClick={handleTrackEventWithMetaData}>
         Track event with metadata

packages/react-use-intercom/src/provider.tsx

@@ -209,6 +209,15 @@ export const IntercomProvider: React.FC<
     [ensureIntercom],
   );
 
+  const startChecklist = React.useCallback(
+    (checklistId: number) => {
+      ensureIntercom('startChecklist', () => {
+        IntercomAPI('startChecklist', checklistId);
+      });
+    },
+    [ensureIntercom],
+  );
+
   const trackEvent = React.useCallback(
     (event: string, metaData?: object) => {
       ensureIntercom('trackEvent', () => {
@@ -268,6 +277,7 @@ export const IntercomProvider: React.FC<
       showNewMessage,
       getVisitorId,
       startTour,
+      startChecklist,
       trackEvent,
       showArticle,
       startSurvey,
@@ -286,6 +296,7 @@ export const IntercomProvider: React.FC<
     showNewMessage,
     getVisitorId,
     startTour,
+    startChecklist,
     trackEvent,
     showArticle,
     startSurvey,

packages/react-use-intercom/src/types.ts

@@ -244,6 +244,7 @@ export type IntercomMethod =
   | 'trackEvent'
   | 'getVisitorId'
   | 'startTour'
+  | 'startChecklist'
   | 'showArticle'
   | 'showSpace'
   | 'showNews';
@@ -366,9 +367,22 @@ export type IntercomContextValues = {
    * the “Use tour everywhere” section must be turned on.
    * If you're calling this API using an invalid tour id, nothing will happen.
    *
-   * @see {@link https://developers.intercom.com/installing-intercom/docs/intercom-javascript#section-intercomstarttour-tourid}
+   * @see {@link https://developers.intercom.com/installing-intercom/docs/intercom-javascript#intercomstarttour-tourid}
    */
   startTour: (tourId: number) => void;
+  /**
+   * Triggers a checklist based on an action a user or visitor takes in your site or application,
+   * You need to call this method with the id of the checklist you wish to show.
+   *
+   * The id of the checklist can be found in the “Aditional ways to share your checklist” section
+   * of the tour editor.
+   *
+   * @remarks Please note that checklists shown via this API must be published.
+   * If you're calling this API using an invalid tour id, nothing will happen.
+   *
+   * @see {@link https://developers.intercom.com/installing-intercom/web/methods/#intercomstartchecklist-checklistid}
+   */
+  startChecklist: (checklistId: number) => void;
   /**
    * Submits an event, this will associate the event with the currently
    * tracked visitor, lead or user and send it to Intercom