Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Expose Start Checklist #662

Merged
merged 7 commits into from
Dec 18, 2023
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 5 additions & 0 deletions .changeset/lazy-countries-obey.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
'react-use-intercom': minor
---

Expose startChecklist method in useIntercom hook
4 changes: 4 additions & 0 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -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`
Expand Down Expand Up @@ -175,6 +176,7 @@ const HomePage = () => {
showNewMessage,
getVisitorId,
startTour,
startChecklist,
trackEvent,
showArticle,
startSurvey,
Expand All @@ -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', {
Expand All @@ -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
Expand Down
4 changes: 4 additions & 0 deletions packages/react-use-intercom/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -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`
Expand Down Expand Up @@ -175,6 +176,7 @@ const HomePage = () => {
showNewMessage,
getVisitorId,
startTour,
startChecklist,
trackEvent,
showArticle,
startSurvey,
Expand All @@ -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', {
Expand All @@ -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
Expand Down
11 changes: 11 additions & 0 deletions packages/react-use-intercom/src/provider.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -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', () => {
Expand Down Expand Up @@ -260,6 +269,7 @@ export const IntercomProvider: React.FC<
showNewMessage,
getVisitorId,
startTour,
startChecklist,
trackEvent,
showArticle,
startSurvey,
Expand All @@ -277,6 +287,7 @@ export const IntercomProvider: React.FC<
showNewMessage,
getVisitorId,
startTour,
startChecklist,
trackEvent,
showArticle,
startSurvey,
Expand Down
16 changes: 15 additions & 1 deletion packages/react-use-intercom/src/types.ts
Original file line number Diff line number Diff line change
Expand Up @@ -244,6 +244,7 @@ export type IntercomMethod =
| 'trackEvent'
| 'getVisitorId'
| 'startTour'
| 'startChecklist'
| 'showArticle'
| 'showSpace';

Expand Down Expand Up @@ -365,9 +366,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.
Jose10go marked this conversation as resolved.
Show resolved Hide resolved
*
* @see {@link https://developers.intercom.com/installing-intercom/web/methods/#intercomstartchecklist-checklistid}
devrnt marked this conversation as resolved.
Show resolved Hide resolved
*/
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
Expand Down
Loading