[Draft] Client side bot messages

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) => {
       <button onClick={Papercups.open}>Open</button>
       <button onClick={Papercups.close}>Close</button>
       <button onClick={Papercups.toggle}>Toggle</button>
+      <button
+        onClick={() => Papercups.sendBotMessage({message: 'a', signature: 'b'})}
+      >
+        sendMsg
+      </button>
     </>
   );
 };

example/src/index.tsx

@@ -4,4 +4,7 @@ import React from 'react';
 import ReactDOM from 'react-dom';
 import App from './App';
 
-ReactDOM.render(<App />, document.getElementById('root'));
+ReactDOM.render(
+  <App displayChatWindow={true} />,
+  document.getElementById('root')
+);

src/components/ChatWidgetContainer.tsx

@@ -109,6 +109,7 @@ class ChatWidgetContainer extends React.Component<Props, State> {
   logger: Logger;
 
   EVENTS = [
+    'papercups:send_bot_message',
     'papercups:open',
     'papercups:close',
     'papercups:toggle',
@@ -383,6 +384,8 @@ class ChatWidgetContainer extends React.Component<Props, State> {
     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<Props, State> {
     }
   };
 
+  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();

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};