feat: Add pending message on dashboard (#1547)

app/javascript/dashboard/helper/commons.js

@@ -1,5 +1,8 @@
-/* eslint no-console: 0 */
 /* eslint no-param-reassign: 0 */
+
+import getUuid from 'widget/helpers/uuid';
+import { MESSAGE_STATUS, MESSAGE_TYPE } from 'shared/constants/messages';
+
 export default () => {
   if (!Array.prototype.last) {
     Object.assign(Array.prototype, {
@@ -26,3 +29,41 @@ export const getTypingUsersText = (users = []) => {
   const rest = users.length - 1;
   return `${user.name} and ${rest} others are typing`;
 };
+
+export const createPendingMessage = data => {
+  const timestamp = Math.floor(new Date().getTime() / 1000);
+  const tempMessageId = getUuid();
+  const pendingMessage = {
+    ...data,
+    content: data.message,
+    id: tempMessageId,
+    echo_id: tempMessageId,
+    status: MESSAGE_STATUS.PROGRESS,
+    created_at: timestamp,
+    message_type: MESSAGE_TYPE.OUTGOING,
+    conversation_id: data.conversationId,
+  };
+  return pendingMessage;
+};
+
+export const createPendingAttachment = data => {
+  const [conversationId, { isPrivate = false }] = data;
+  const timestamp = Math.floor(new Date().getTime() / 1000);
+  const tempMessageId = getUuid();
+  const pendingMessage = {
+    id: tempMessageId,
+    echo_id: tempMessageId,
+    status: MESSAGE_STATUS.PROGRESS,
+    created_at: timestamp,
+    message_type: MESSAGE_TYPE.OUTGOING,
+    conversation_id: conversationId,
+    attachments: [
+      {
+        id: tempMessageId,
+      },
+    ],
+    private: isPrivate,
+    content: null,
+  };
+  return pendingMessage;
+};

app/javascript/dashboard/helper/specs/commons.spec.js

@@ -1,4 +1,8 @@
-import { getTypingUsersText } from '../commons';
+import {
+  getTypingUsersText,
+  createPendingMessage,
+  createPendingAttachment,
+} from '../commons';
 
 describe('#getTypingUsersText', () => {
   it('returns the correct text is there is only one typing user', () => {
@@ -24,3 +28,70 @@ describe('#getTypingUsersText', () => {
     ).toEqual('Pranav and 3 others are typing');
   });
 });
+
+describe('#createPendingMessage', () => {
+  const message = {
+    message: 'hi',
+  };
+  it('returns the pending message with expected new keys', () => {
+    expect(createPendingMessage(message)).toHaveProperty(
+      'content',
+      'id',
+      'status',
+      'echo_id',
+      'status',
+      'created_at',
+      'message_type',
+      'conversation_id'
+    );
+  });
+
+  it('returns the pending message with status progress', () => {
+    expect(createPendingMessage(message)).toMatchObject({
+      status: 'progress',
+    });
+  });
+
+  it('returns the pending message with same id and echo_id', () => {
+    const pending = createPendingMessage(message);
+    expect(pending).toMatchObject({
+      echo_id: pending.id,
+    });
+  });
+});
+
+describe('#createPendingAttachment', () => {
+  const message = [1, { isPrivate: false }];
+  it('returns the pending message with expected new keys', () => {
+    expect(createPendingAttachment(message)).toHaveProperty(
+      'content',
+      'id',
+      'status',
+      'echo_id',
+      'status',
+      'created_at',
+      'message_type',
+      'conversation_id',
+      'attachments',
+      'private'
+    );
+  });
+
+  it('returns the pending message with status progress', () => {
+    expect(createPendingAttachment(message)).toMatchObject({
+      status: 'progress',
+    });
+  });
+
+  it('returns the pending message with same id and echo_id', () => {
+    const pending = createPendingAttachment(message);
+    expect(pending).toMatchObject({
+      echo_id: pending.id,
+    });
+  });
+
+  it('returns the pending message to have one attachment', () => {
+    const pending = createPendingAttachment(message);
+    expect(pending.attachments.length).toBe(1);
+  });
+});