2.1.0

Bot signal

__mocks__/matrix-js-sdk.js

@@ -24,7 +24,13 @@ export const mockInitCrypto = jest.fn()
 export const mockStartClient = jest.fn(() => {
   return Promise.resolve('value');
 });
-export const mockOnce = jest.fn()
+export const mockOnce = jest
+  .fn()
+  .mockImplementation((event, callback) => {
+    if (event === 'sync') {
+      callback('PREPARED')
+    }
+  })
 export const mockStopClient = jest.fn(() => {
   return Promise.resolve('value');
 });

dist/index.html

@@ -25,7 +25,7 @@
         anonymousDisplayName: 'Anonymous',
         position: 'bottom right',
         size: 'large',
-        maxWaitTime: 6000*3,
+        maxWaitTime: 1000*60*3, // 3 minutes
     }
 
       EmbeddableChatbox.mount(config);

package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "private-safesupport-chatbox",
-  "version": "1.2.2",
+  "version": "2.1.0",
   "lockfileVersion": 1,
   "requires": true,
   "dependencies": {

package.json

@@ -1,6 +1,6 @@
 {
   "name": "private-safesupport-chatbox",
-  "version": "1.2.2",
+  "version": "2.1.0",
   "description": "A secure and private embeddable chatbox that connects to Riot",
   "main": "dist/chatbox.js",
   "scripts": {

public/index.html

@@ -25,7 +25,7 @@
         anonymousDisplayName: 'Anonymous',
         position: 'bottom right',
         size: 'large',
-        maxWaitTime: 6000*3,
+        maxWaitTime: 1000*60*3, // 3 minutes
     }
 
       EmbeddableChatbox.mount(config);

src/components/chatbox.jsx

@@ -166,10 +166,13 @@ class ChatBox extends React.Component {
       await this.state.client.deactivateAccount(auth, true)
       await this.state.client.stopClient()
       await this.state.client.clearStores()
-      this.setState({ client: null })
+      this.setState({ client: null, ready: true }) // no more loading animation
+      window.clearInterval(this.state.waitIntervalId) // no more waiting messages
     }
 
-    this.state.localStorage.clear()
+    if (this.state.localStorage) {
+      this.state.localStorage.clear()
+    }
 
     if (resetState) {
       this.setState(this.initialState)
@@ -458,40 +461,15 @@ class ChatBox extends React.Component {
     const decryptionErrors = {...this.state.decryptionErrors}
     delete decryptionErrors[message.id]
 
-    const isOfflineNotice = message.content.msgtype === "m.notice" && message.content.body === CHAT_IS_OFFLINE_NOTICE
-
-    let newMessage = message
-
-    // when the bot sends a notice that the chat is offline
-    // replace the message with the client-configured message
-    // for now we're treating m.notice and m.text messages the same
-    if (isOfflineNotice) {
-      newMessage = {
-        ...message,
-        content: {
-          ...message.content,
-          body: this.props.chatOfflineMessage
-        }
-      }
-      this.handleChatOffline()
-    }
-
     this.setState({
       messages: {
         ...this.state.messages,
-        [message.id]: newMessage,
+        [message.id]: message,
       },
       decryptionErrors
     })
   }
 
-  handleChatOffline = () => {
-    this.exitChat(false) // close the chat connection but keep chatbox state
-    window.clearInterval(this.state.waitIntervalId) // no more waiting messages
-    window.clearInterval(this.state.waitTimeoutId) // no more waiting messages
-    this.setState({ ready: true }) // no more loading animation
-  }
-
   handleKeyDown = (e) => {
     switch (e.keyCode) {
       case 27:
@@ -546,7 +524,6 @@ class ChatBox extends React.Component {
         this.verifyAllRoomDevices(client, room)
         this.setState({ facilitatorId: sender, ready: true })
         window.clearInterval(this.state.waitIntervalId)
-        window.clearInterval(this.state.waitTimeoutId)
       }
     });
 
@@ -568,6 +545,26 @@ class ChatBox extends React.Component {
         this.setState({ typingStatus: null })
       }
     });
+
+    client.on("event", (event) => {
+      const eventType = event.getType()
+      const content = event.getContent()
+
+      if (eventType === 'm.bot.signal') {
+        this.handleBotSignal(content.signal)
+      }
+    })
+  }
+
+  handleBotSignal = (signal) => {
+    switch (signal) {
+      case 'END_CHAT':
+        this.displayBotMessage({ body: this.props.exitMessage })
+        return this.exitChat(false); // keep chat state
+      case 'CHAT_OFFLINE':
+        this.displayBotMessage({ body: this.props.chatOfflineMessage })
+        return this.exitChat(false); // keep chat state
+    }
   }
 
   componentDidUpdate(prevProps, prevState) {
@@ -624,14 +621,7 @@ class ChatBox extends React.Component {
       }
     }, this.props.waitInterval)
 
-    const waitTimeoutId = window.setTimeout(() => {
+    this.setState({ waitIntervalId })
-      if (!this.state.facilitatorId && !this.state.ready) {
-        this.displayBotMessage({ body: this.props.chatUnavailableMessage })
-        this.handleChatOffline()
-      }
-    }, this.props.maxWaitTime)
-
-    this.setState({ waitIntervalId, waitTimeoutId })
   }
 
   handleRejectTerms = () => {

src/components/chatbox.test.js

@@ -115,9 +115,7 @@ describe('Chatbox', () => {
     expect(createClient).toHaveBeenCalled()
     expect(mockInitCrypto).toHaveBeenCalled()
     expect(mockStartClient).toHaveBeenCalled()
-    expect(mockCreateRoom).toHaveBeenCalled()
+    expect(mockOnce).toHaveBeenCalled()
-    expect(mockSetPowerLevel).toHaveBeenCalled()
-    expect(mockOn).toHaveBeenCalled()
   })
 
   test('rejecting terms should not start chat', async () => {
@@ -146,6 +144,10 @@ describe('Chatbox', () => {
 
     acceptButton.simulate('click')
 
+    await waitForExpect(() => {
+      expect(mockOnce).toHaveBeenCalled()
+    });
+
     await waitForExpect(() => {
       expect(mockCreateRoom).toHaveBeenCalled()
     });
@@ -169,7 +171,7 @@ describe('Chatbox', () => {
   })
 
 
-  test('decryption failure should lead to a new unencrypted chat', async () => {
+  test('decryption failure should handle the message event and save the event ID in state', async () => {
     const chatbox = mount(<Chatbox {...testConfig} />)
     const dock = chatbox.find('button.dock')
     const instance = chatbox.instance()
@@ -183,25 +185,25 @@ describe('Chatbox', () => {
     acceptButton.simulate('click')
 
     await waitForExpect(() => {
-      expect(mockCreateRoom).toHaveBeenCalled()
+      expect(mockOnce).toHaveBeenCalled()
     });
 
-    jest.spyOn(instance, 'initializeUnencryptedChat')
+    jest.spyOn(instance, 'handleMessageEvent')
-    instance.handleDecryptionError()
+
+    instance.handleDecryptionError({
+      getId: () => 'test_event_id',
+      getType: () => 'm.message',
+      getSender: () => 'sender',
+      getRoomId: () => 'room id',
+      getContent: () => ({ body: 'test msg' }),
+      getTs: () => '123',
+    })
 
     await waitForExpect(() => {
-      expect(mockLeave).toHaveBeenCalled()
+      expect(instance.handleMessageEvent).toHaveBeenCalled()
-    });
+    })
 
-    await waitForExpect(() => {
+    expect(chatbox.state().decryptionErrors).toEqual({ 'test_event_id': true })
-      expect(mockStopClient).toHaveBeenCalled()
-    });
-
-    await waitForExpect(() => {
-      expect(mockClearStores).toHaveBeenCalled()
-    });
-
-    expect(instance.initializeUnencryptedChat).toHaveBeenCalled()
   })
 
   test('creating an unencrypted chat', async () => {

src/outputs/component.js

@@ -0,0 +1,3 @@
+import Chatbox from '../components/chatbox';
+
+export default Chatbox;

src/setupTests.js

@@ -0,0 +1,3 @@
+import { configure } from 'enzyme';
+import Adapter from 'enzyme-adapter-react-16';
+configure({ adapter: new Adapter() });

webpack.config.js

@@ -94,4 +94,15 @@ module.exports = [{
     publicPath: '/',
     filename: 'bookmarklet.js',
   },
+}, {
+  ...defaultConfig,
+  entry: './src/outputs/component.js',
+  output: {
+    path: distDir,
+    publicPath: '/',
+    filename: 'component.js',
+    library: 'Chatbox',
+    libraryExport: 'default',
+    libraryTarget: 'commonjs2',
+  },
 }];