Need help with react-messenger-customer-chat?
Click the “chat” button below for chat support from the developer who created it, or find similar developers for support.

About the developer

Yoctol
225 Stars 49 Forks MIT License 122 Commits 22 Opened issues

Description

React component for messenger customer chat plugin

Services available

!
?

Need anything else?

Contributors list

# 625
React
Electro...
curry
ESLint
54 commits
# 35,701
JavaScr...
React
messeng...
messeng...
15 commits
# 33,194
messeng...
messeng...
messeng...
TypeScr...
5 commits
# 313,706
React
faceboo...
messeng...
messeng...
2 commits
# 101,246
adafrui...
tinygo
golang
arcgis
1 commit
# 451,986
React
faceboo...
messeng...
messeng...
1 commit

React Messenger Customer Chat

React component for Messenger customer chat plugin

npm Build Status License: MIT

Screenshot

Prerequisite

Whitelist your domain to connect your Facebook Page to your website via the Facebook tool.

  • From UI: Facebook Page Settings > Messenger Platform > Whitelisted Domains
  • From API: Use HTTP API or API client likes messaging-api-messenger

Installation

npm install react-messenger-customer-chat

Usage

import React from 'react';
import ReactDOM from 'react-dom';
import MessengerCustomerChat from 'react-messenger-customer-chat';

ReactDOM.render( , document.getElementById('demo') );

Note: It will handle sdk initialize automatically for you. See more details in Customer Chat Plugin official docs and Customer Chat SDK official docs.

Props

static propTypes = {
  pageId: PropTypes.string.isRequired,
  appId: PropTypes.string.isRequired,

shouldShowDialog: PropTypes.bool, htmlRef: PropTypes.string, minimized: PropTypes.bool, themeColor: PropTypes.string, loggedInGreeting: PropTypes.string, loggedOutGreeting: PropTypes.string, greetingDialogDisplay: PropTypes.oneOf(['show', 'hide', 'fade']), greetingDialogDelay: PropTypes.number, autoLogAppEvents: PropTypes.bool, xfbml: PropTypes.bool, version: PropTypes.string, language: PropTypes.string, debug: PropTypes.bool, onCustomerChatDialogShow: PropTypes.func, onCustomerChatDialogHide: PropTypes.func, };

static defaultProps = { shouldShowDialog: false, htmlRef: undefined, minimized: undefined, themeColor: undefined, loggedInGreeting: undefined, loggedOutGreeting: undefined, greetingDialogDisplay: undefined, greetingDialogDelay: undefined, autoLogAppEvents: true, xfbml: true, version: '2.11', language: 'en_US', debug: false, onCustomerChatDialogShow: undefined, onCustomerChatDialogHide: undefined, };

Related

License

MIT © Yoctol

We use cookies. If you continue to browse the site, you agree to the use of cookies. For more information on our use of cookies please see our Privacy Policy.