feature: adding api_base option (#96)

* feature: adding api_base option

* chore: optional attribute

* chore: update docs of api base prop in provider

* test: add cypress test for api base

* test: add integration test for api base

* chore(deps-dev): bump @testing-library/react from 10.4.9 to 11.0.0

Bumps [@testing-library/react](https://github.com/testing-library/react-testing-library) from 10.4.9 to 11.0.0.
- [Release notes](https://github.com/testing-library/react-testing-library/releases)
- [Changelog](https://github.com/testing-library/react-testing-library/blob/master/CHANGELOG.md)
- [Commits](testing-library/react-testing-library@v10.4.9...v11.0.0)

Signed-off-by: dependabot-preview[bot] <support@dependabot.com>

* chore(deps-dev): bump @testing-library/react from 11.0.0 to 11.0.2

Bumps [@testing-library/react](https://github.com/testing-library/react-testing-library) from 11.0.0 to 11.0.2.
- [Release notes](https://github.com/testing-library/react-testing-library/releases)
- [Changelog](https://github.com/testing-library/react-testing-library/blob/master/CHANGELOG.md)
- [Commits](testing-library/react-testing-library@v11.0.0...v11.0.2)

Signed-off-by: dependabot-preview[bot] <support@dependabot.com>

* chore(deps-dev): bump husky from 4.2.5 to 4.3.0

Bumps [husky](https://github.com/typicode/husky) from 4.2.5 to 4.3.0.
- [Release notes](https://github.com/typicode/husky/releases)
- [Changelog](https://github.com/typicode/husky/blob/master/CHANGELOG.md)
- [Commits](typicode/husky@v4.2.5...v4.3.0)

Signed-off-by: dependabot-preview[bot] <support@dependabot.com>

* chore(deps-dev): bump @testing-library/react from 11.0.2 to 11.0.4

Bumps [@testing-library/react](https://github.com/testing-library/react-testing-library) from 11.0.2 to 11.0.4.
- [Release notes](https://github.com/testing-library/react-testing-library/releases)
- [Changelog](https://github.com/testing-library/react-testing-library/blob/master/CHANGELOG.md)
- [Commits](testing-library/react-testing-library@v11.0.2...v11.0.4)

Signed-off-by: dependabot-preview[bot] <support@dependabot.com>

* chore(deps-dev): bump cypress from 5.1.0 to 5.2.0

Bumps [cypress](https://github.com/cypress-io/cypress) from 5.1.0 to 5.2.0.
- [Release notes](https://github.com/cypress-io/cypress/releases)
- [Commits](cypress-io/cypress@v5.1.0...v5.2.0)

Signed-off-by: dependabot-preview[bot] <support@dependabot.com>

* chore(deps-dev): bump typescript from 4.0.2 to 4.0.3

Bumps [typescript](https://github.com/Microsoft/TypeScript) from 4.0.2 to 4.0.3.
- [Release notes](https://github.com/Microsoft/TypeScript/releases)
- [Commits](microsoft/TypeScript@v4.0.2...v4.0.3)

Signed-off-by: dependabot-preview[bot] <support@dependabot.com>

* feat: add api base prop in provider

* chore(deps-dev): bump tsdx from 0.13.3 to 0.14.0

Bumps [tsdx](https://github.com/formium/tsdx) from 0.13.3 to 0.14.0.
- [Release notes](https://github.com/formium/tsdx/releases)
- [Commits](jaredpalmer/tsdx@v0.13.3...v0.14.0)

Signed-off-by: dependabot-preview[bot] <support@dependabot.com>

* test: update jest config

* chore: make api base an optional prop

* chore: update docs of api base prop in provider

* test: add cypress test for api base

* test: add integration test for api base

Co-authored-by: devrnt <devrient.jonas@gmail.com>
Co-authored-by: dependabot-preview[bot] <27856297+dependabot-preview[bot]@users.noreply.github.com>

Author: 3 people

cypress/integration/provider.ts

@@ -60,3 +60,16 @@ describe('provider with events', () => {
     cy.get('[data-cy=onHideText]').should('have.text', 'hide was called');
   });
 });
+
+describe('provider with `apiBase`', () => {
+  it('should set `api_base` if provided', () => {
+    cy.visit('/providerApi');
+
+    cy.get('p').should('be.visible');
+
+    cy.window().should('have.deep.property', 'intercomSettings', {
+      app_id: 'jcabc7e3',
+      api_base: 'https://jcabc7e3.intercom-messenger.com',
+    });
+  });
+});

example/app.tsx

@@ -6,6 +6,7 @@ import {
   ProviderPage,
   UseIntercomPage,
   ProviderEventsPage,
+  ProviderApiPage,
   UseIntercomTourPage,
 } from './modules';
 
@@ -43,6 +44,7 @@ const App = () => {
         <Router>
           <Route path="/provider" component={ProviderPage} />
           <Route path="/providerEvents" component={ProviderEventsPage} />
+          <Route path="/providerApi" component={ProviderApiPage} />
           <Route path="/useIntercom" component={UseIntercomPage} />
           <Route path="/useIntercomTour" component={UseIntercomTourPage} />
           <Route path="/" exact>

example/modules/provider/index.ts

@@ -1,2 +1,3 @@
 export { default as ProviderPage } from './provider';
 export { default as ProviderEventsPage } from './providerEvents';
+export { default as ProviderApiPage } from './providerApi';

example/modules/provider/providerApi.tsx

@@ -0,0 +1,17 @@
+import * as React from 'react';
+
+import { IntercomProvider } from '../../../.';
+
+const Provider = () => {
+  return (
+    <IntercomProvider
+      appId="jcabc7e3"
+      apiBase="https://jcabc7e3.intercom-messenger.com"
+      autoBoot
+    >
+      <p>Intercom children</p>
+    </IntercomProvider>
+  );
+};
+
+export default Provider;

src/contextTypes.ts

@@ -7,7 +7,7 @@ export type IntercomContextValues = {
    * @remarks This is useful in situations like a one-page Javascript based application
    * where the user may not be logged in when the page loads.
    * @param props the standard optional intercom props
-   * 
+   *
    * @see {@link https://developers.intercom.com/installing-intercom/docs/intercom-javascript#section-intercomboot-intercomsettings}
 
    */
@@ -21,7 +21,7 @@ export type IntercomContextValues = {
    * given device or computer  will keep these conversations in the Messenger for one week.
    *
    * @remarks This method will effectively clear out any user data that you have been passing through the JS API.
-   
+
    * @see {@link https://developers.intercom.com/installing-intercom/docs/intercom-javascript#section-intercomshutdown}
    */
   shutdown: () => void;
@@ -153,4 +153,12 @@ export type IntercomProviderProps = {
    * @remarks can be used for multistaged environments
    */
   shouldInitialize?: boolean;
+
+  /**
+   * If you need to route your Messenger requests through a different endpoint than the default
+   *
+   * @remarks Generally speaking, this is not needed.
+   * Format https://${INTERCOM_APP_ID}.intercom-messenger.com
+   */
+  apiBase?: string;
 };

src/provider.tsx

@@ -1,12 +1,11 @@
 import * as React from 'react';
-
-import * as logger from './logger';
 import IntercomAPI from './api';
-import initialize from './initialize';
 import IntercomContext from './context';
 import { IntercomContextValues, IntercomProviderProps } from './contextTypes';
-import { IntercomProps, RawIntercomBootProps } from './types';
+import initialize from './initialize';
+import * as logger from './logger';
 import { mapIntercomPropsToRawIntercomProps } from './mappers';
+import { IntercomProps, RawIntercomBootProps } from './types';
 import { isEmptyObject, isSSR } from './utils';
 
 export const IntercomProvider = ({
@@ -17,6 +16,7 @@ export const IntercomProvider = ({
   onShow,
   onUnreadCountChange,
   shouldInitialize = !isSSR,
+  apiBase,
   ...rest
 }: IntercomProviderProps) => {
   if (!isEmptyObject(rest))
@@ -29,6 +29,8 @@ export const IntercomProvider = ({
     );
 
   const memoizedAppId = React.useRef(appId);
+  const memoizedApiBase = React.useRef(apiBase);
+
   const isBooted = React.useRef(autoBoot);
   const memoizedShouldInitialize = React.useRef(shouldInitialize);
 
@@ -41,8 +43,14 @@ export const IntercomProvider = ({
       IntercomAPI('onUnreadCountChange', onUnreadCountChange);
 
     if (autoBoot) {
-      IntercomAPI('boot', { app_id: memoizedAppId.current });
-      window.intercomSettings = { app_id: memoizedAppId.current };
+      IntercomAPI('boot', {
+        app_id: memoizedAppId.current,
+        ...(memoizedApiBase.current && { api_base: memoizedApiBase.current }),
+      });
+      window.intercomSettings = {
+        app_id: memoizedAppId.current,
+        ...(memoizedApiBase.current && { api_base: memoizedApiBase.current }),
+      };
     }
   }
 
@@ -83,6 +91,7 @@ export const IntercomProvider = ({
 
     const metaData: RawIntercomBootProps = {
       app_id: memoizedAppId.current,
+      ...(memoizedApiBase.current && { api_base: memoizedApiBase.current }),
       ...(props && mapIntercomPropsToRawIntercomProps(props)),
     };
 

src/types.ts

@@ -244,7 +244,10 @@ export type IntercomMethod =
 
 export type RawIntercomProps = RawMessengerAttributes & RawDataAttributes;
 
-export type RawIntercomBootProps = { app_id: string } & RawIntercomProps;
+export type RawIntercomBootProps = {
+  app_id: string;
+  api_base?: string;
+} & RawIntercomProps;
 
 export type IntercomProps = MessengerAttributes & DataAttributes;
 

test/intercomProvider.test.tsx

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { render } from '@testing-library/react';
+import { act, render } from '@testing-library/react';
 import { renderHook } from '@testing-library/react-hooks';
 
 import config from '../config';
@@ -49,4 +49,27 @@ describe('IntercomProvider', () => {
 
     expect(mockOnShow).not.toBeCalled();
   });
+
+  test('should set `window.intercomSettings.apiBase` on autoBoot', () => {
+    const apiBase = `https://${INTERCOM_APP_ID}.intercom-messenger.com`;
+
+    const { result } = renderHook(() => useIntercom(), {
+      wrapper: ({ children }) => (
+        <IntercomProvider appId={INTERCOM_APP_ID} apiBase={apiBase}>
+          {children}
+        </IntercomProvider>
+      ),
+    });
+
+    const { boot } = result.current;
+
+    act(() => {
+      boot();
+    });
+
+    expect(window.intercomSettings).toEqual({
+      app_id: INTERCOM_APP_ID,
+      api_base: apiBase,
+    });
+  });
 });