Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/j-mendez/next-intercom
Isomorphic Intercom composer
https://github.com/j-mendez/next-intercom
intercom intercom-client intercom-composer intercom-ssr intercomjs node-intercom
Last synced: 17 days ago
JSON representation
Isomorphic Intercom composer
- Host: GitHub
- URL: https://github.com/j-mendez/next-intercom
- Owner: j-mendez
- License: mit
- Created: 2020-02-07T00:59:04.000Z (almost 5 years ago)
- Default Branch: main
- Last Pushed: 2023-07-19T01:55:42.000Z (over 1 year ago)
- Last Synced: 2024-10-14T06:08:39.097Z (about 1 month ago)
- Topics: intercom, intercom-client, intercom-composer, intercom-ssr, intercomjs, node-intercom
- Language: TypeScript
- Homepage:
- Size: 233 KB
- Stars: 10
- Watchers: 2
- Forks: 5
- Open Issues: 3
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# next-intercom
[](https://circleci.com/gh/j-mendez/next-intercom)[](https://codeclimate.com/github/j-mendez/next-intercom/maintainability)[](https://codecov.io/gh/j-mendez/next-intercom)
create intercom chat composer in any browser or on the server using javascript. Keep messager up across SSR pages. Easy drop in for Next.js
Extra configuration for priority adjustments to keep the main thread unblocked.
## Installation
`yarn install next-intercom`
## How to use
On the client or you can use the script on the server like Next.js using the ssr toggle.
If you're using Next.js you can simply just add the `process.browser` for ssr to render intercom SSR and have it loaded initally.
```typescript
const { loadIntercom, initIntercomWindow } = require("next-intercom");
/*
Generate the intercom script and load the composer
*/
loadIntercom({
appId: "myintercomappid", // default : ''
email: "[email protected]", //default: ''
name: "Some Name", //default: RandomName
ssr: false, // default: false
initWindow: true, // default: true
delay: 0, // default: 0 - usefull for mobile devices to prevent blocking the main thread
});
// If init was set to false initiate the window when needed
initIntercomWindow({ appId: "myintercomappid", email: "[email protected]", api_base: "https://api-iam.intercom.io" }); // api_base is optional: If on EU servers use `https://api.eu.intercom.io`
```
example using on the server
```typescript
const { createIntercomSSR } = require("next-intercom");
// Optiobal appId property unless app was not established: example in nodejs, make sure to globally set fetch to your request type like axios etc
app.get("/intercom", (req, res) =>
createIntercomSSR({
appId: req.query.appId,
})
);
```
Or use in a fetch like manner if needed from the server or clientside. This returns the script for intercom inline for usage.
```typescript
const { createIntercomSSR } = require("next-intercom");
async function fetchIframe() {
const intercomScript = await createIntercomSSR(appId);
return intercomScript;
}
```
Stop intercom and close composer.
```typescript
const { shutdownIntercom } = require("next-intercom");
shutdownIntercom();
```
Add events to Intercom.
```ts
const { updateIntercom } = require("next-intercom");
updateIntercom("onShow", function newEvent() {
console.log("composer opened!");
});
```
Track an Intercom event.
```typescript
const { trackEvent } = require("next-intercom");
var metadata = {
invitee_email: "[email protected]",
invite_code: "ADDAFRIEND",
};
trackEvent("invited-friend", metadata);
```
## About
Simply get started with intercom in your app using javascript.
## Methods
The intercom constructor using window.Intercom('method')
1. boot - load intercom
2. reattach_activator
3. update - update intercom composer data