diff --git a/example/src/App.tsx b/example/src/App.tsx index 623c18f..4769288 100644 --- a/example/src/App.tsx +++ b/example/src/App.tsx @@ -3,7 +3,7 @@ import React from 'react'; import {ChatWidget, ChatWindow, Papercups} from '@papercups-io/chat-widget'; // NB: during development, replace this with a valid account ID from your dev db -const TEST_ACCOUNT_ID = '2ebbad4c-b162-4ed2-aff5-eaf9ebf469a5'; +const TEST_ACCOUNT_ID = 'b6d3ac2d-fe0b-425b-93f6-327fd67848df'; type Props = {disco?: boolean; displayChatWindow?: boolean}; @@ -162,6 +162,11 @@ const App = ({disco, displayChatWindow}: Props) => { + ); }; diff --git a/example/src/index.tsx b/example/src/index.tsx index 74d1cbe..fb7f52a 100644 --- a/example/src/index.tsx +++ b/example/src/index.tsx @@ -4,4 +4,7 @@ import React from 'react'; import ReactDOM from 'react-dom'; import App from './App'; -ReactDOM.render(, document.getElementById('root')); +ReactDOM.render( + , + document.getElementById('root') +); diff --git a/src/components/ChatWidgetContainer.tsx b/src/components/ChatWidgetContainer.tsx index 92e8d62..f70aa18 100644 --- a/src/components/ChatWidgetContainer.tsx +++ b/src/components/ChatWidgetContainer.tsx @@ -109,6 +109,7 @@ class ChatWidgetContainer extends React.Component { logger: Logger; EVENTS = [ + 'papercups:send_bot_message', 'papercups:open', 'papercups:close', 'papercups:toggle', @@ -383,6 +384,8 @@ class ChatWidgetContainer extends React.Component { const {type, detail} = event; switch (type) { + case 'papercups:send_bot_message': + return this.handleSendBotMessage(detail); case 'papercups:open': return this.handleOpenWidget(); case 'papercups:close': @@ -396,6 +399,11 @@ class ChatWidgetContainer extends React.Component { } }; + handleSendBotMessage = (detail: any) => { + this.handleOpenWidget(); + this.send('papercups:send_bot_message', detail); + }; + postMessageHandlers = (msg: any) => { this.logger.debug('Handling in parent:', msg.data); const iframeUrl = this.getIframeUrl(); diff --git a/src/index.tsx b/src/index.tsx index bef7442..83b65d1 100644 --- a/src/index.tsx +++ b/src/index.tsx @@ -10,10 +10,24 @@ export const identify = () => { console.warn('`Papercups.identify` has not been implemented yet!'); }; +export const sendBotMessage = ({ + message, + signature, +}: { + message: string; + signature: string; +}) => + window.dispatchEvent( + new CustomEvent('papercups:send_bot_message', { + detail: {message, signature}, + }) + ); + export const Papercups = { open, close, toggle, + sendBotMessage, }; export {ChatWidget, ChatWindow};