Messenger plugin add and config

gatsby-config.js

@@ -22,10 +22,10 @@ module.exports = {
         name: 'Saburly',
         short_name: 'Saburly',
         start_url: '/',
-        background_color: '#f7f0eb',
-        theme_color: '#a2466c',
+        background_color: '#ffffff',
+        theme_color: '#5763AB',
         display: 'minimal-ui',
-        icon: 'src/images/favicon.png', // This path is relative to the root of the site.
+        icon: 'src/images/favicon.png',
       },
     },
     {

package.json

@@ -25,6 +25,7 @@
     "prismjs": "^1.15.0",
     "react-headroom": "^2.2.2",
     "react-helmet": "^5.2.0",
+    "react-messenger-customer-chat": "^0.6.2",
     "react-responsive-mixin": "^0.4.0",
     "react-reveal": "^1.2.2",
     "react-typed": "^1.0.9",

src/layouts/index.js

@@ -5,6 +5,8 @@ import Helmet from 'react-helmet'
 import Header from '../components/Header'
 import Footer from '../components/Footer'
 import SideMenu from '../components/SideMenu'
+import MessengerCustomerChat from 'react-messenger-customer-chat'
+
 require('typeface-maven-pro')
 require('typeface-lato')
 import '../styles/index.css'
@@ -25,6 +27,11 @@ const Layout = ({ children, data }) => (
       ]}
       link={[{ rel: 'shortcut icon', type: 'image/png', href: `${favicon32}` }]}
     />
+    <MessengerCustomerChat
+      pageId="<PAGE_ID>"
+      appId="<APP_ID>"
+      htmlRef="<REF_STRING>"
+    />
     <div className="side-panel panel">
       <Header />
       {children()}

yarn.lock

@@ -8327,6 +8327,12 @@ react-lifecycles-compat@^3.0.4:
   version "3.0.4"
   resolved "https://registry.yarnpkg.com/react-lifecycles-compat/-/react-lifecycles-compat-3.0.4.tgz#4f1a273afdfc8f3488a8c516bfda78f872352362"
 
+react-messenger-customer-chat@^0.6.2:
+  version "0.6.2"
+  resolved "https://registry.yarnpkg.com/react-messenger-customer-chat/-/react-messenger-customer-chat-0.6.2.tgz#39462c90a951b06fa01d33e37547c47ca715aa63"
+  dependencies:
+    prop-types "^15.6.0"
+
 react-proxy@^3.0.0-alpha.0:
   version "3.0.0-alpha.1"
   resolved "https://registry.yarnpkg.com/react-proxy/-/react-proxy-3.0.0-alpha.1.tgz#4400426bcfa80caa6724c7755695315209fa4b07"