Bug: Fix conversation not loading from the links in email (#602)

Bug: Load conversation from links

.gitignore

@@ -52,4 +52,6 @@ coverage
 
 # ignore packages
 node_modules
-package-lock.json
+package-lock.json
+
+*.dump

app/controllers/api/v1/conversations/messages_controller.rb

@@ -1,8 +1,18 @@
 class Api::V1::Conversations::MessagesController < Api::BaseController
-  before_action :set_conversation, only: [:create]
+  before_action :set_conversation, only: [:index, :create]
+
+  def index
+    @messages = message_finder.perform
+  end
 
   def create
     mb = Messages::Outgoing::NormalBuilder.new(current_user, @conversation, params)
     @message = mb.perform
   end
+
+  private
+
+  def message_finder
+    @message_finder ||= MessageFinder.new(@conversation, params)
+  end
 end

app/controllers/api/v1/conversations_controller.rb

@@ -7,9 +7,7 @@ class Api::V1::ConversationsController < Api::BaseController
     @conversations_count = result[:count]
   end
 
-  def show
-    @messages = messages_finder.perform
-  end
+  def show; end
 
   def toggle_status
     @status = @conversation.toggle_status
@@ -34,8 +32,4 @@ class Api::V1::ConversationsController < Api::BaseController
   def conversation_finder
     @conversation_finder ||= ConversationFinder.new(current_user, params)
   end
-
-  def messages_finder
-    @message_finder ||= MessageFinder.new(@conversation, params)
-  end
 end

app/javascript/dashboard/api/inbox/message.js

@@ -15,7 +15,7 @@ class MessageApi extends ApiClient {
   }
 
   getPreviousMessages({ conversationId, before }) {
-    return axios.get(`${this.url}/${conversationId}`, {
+    return axios.get(`${this.url}/${conversationId}/messages`, {
       params: { before },
     });
   }

app/javascript/dashboard/routes/dashboard/conversation/ConversationView.vue

@@ -58,6 +58,7 @@ export default {
     this.initialize();
     this.$watch('$store.state.route', () => this.initialize());
     this.$watch('chatList.length', () => {
+      this.fetchConversation();
       this.setActiveChat();
     });
   },
@@ -81,13 +82,28 @@ export default {
           break;
         default:
           this.$store.dispatch('setActiveInbox', null);
+          this.$store.dispatch('clearSelectedState');
           break;
       }
     },
 
-    setActiveChat() {
+    fetchConversation() {
+      if (!this.conversationId) {
+        return;
+      }
+      const chat = this.findConversation();
+      if (!chat) {
+        this.$store.dispatch('getConversation', this.conversationId);
+      }
+    },
+    findConversation() {
       const conversationId = parseInt(this.conversationId, 10);
       const [chat] = this.chatList.filter(c => c.id === conversationId);
+      return chat;
+    },
+
+    setActiveChat() {
+      const chat = this.findConversation();
       if (!chat) return;
       this.$store.dispatch('setActiveChat', chat).then(() => {
         bus.$emit('scrollToMessage');

app/javascript/dashboard/routes/dashboard/conversation/conversation.routes.js

@@ -28,7 +28,7 @@ export default {
       roles: ['administrator', 'agent'],
       component: ConversationView,
       props: route => {
-        return { conversationId: route.params.conversation_id };
+        return { inboxId: 0, conversationId: route.params.conversation_id };
       },
     },
     {

app/javascript/dashboard/store/modules/conversations/actions.js

@@ -7,6 +7,15 @@ import FBChannel from '../../../api/channel/fbChannel';
 
 // actions
 const actions = {
+  getConversation: async ({ commit }, conversationId) => {
+    try {
+      const response = await ConversationApi.show(conversationId);
+      commit(types.default.ADD_CONVERSATION, response.data);
+    } catch (error) {
+      // Ignore error
+    }
+  },
+
   fetchAllConversations: async ({ commit, dispatch }, params) => {
     commit(types.default.SET_LIST_LOADING_STATUS);
     try {

app/javascript/dashboard/store/modules/conversations/getters.js

@@ -33,12 +33,13 @@ const getters = {
   getChatListLoadingStatus: ({ listLoadingStatus }) => listLoadingStatus,
   getAllMessagesLoaded(_state) {
     const [chat] = getSelectedChatConversation(_state);
-    return chat.allMessagesLoaded === undefined
+    return !chat || chat.allMessagesLoaded === undefined
       ? false
       : chat.allMessagesLoaded;
   },
   getUnreadCount(_state) {
     const [chat] = getSelectedChatConversation(_state);
+    if (!chat) return [];
     return chat.messages.filter(
       chatMessage =>
         chatMessage.created_at * 1000 > chat.agent_last_seen_at * 1000 &&

app/javascript/dashboard/store/modules/specs/conversations/actions.spec.js

@@ -0,0 +1,24 @@
+import axios from 'axios';
+import actions from '../../conversations/actions';
+import * as types from '../../../mutation-types';
+
+const commit = jest.fn();
+global.axios = axios;
+jest.mock('axios');
+
+describe('#actions', () => {
+  describe('#getConversation', () => {
+    it('sends correct actions if API is success', async () => {
+      axios.get.mockResolvedValue({ data: { id: 1, meta: {} } });
+      await actions.getConversation({ commit }, 1);
+      expect(commit.mock.calls).toEqual([
+        [types.default.ADD_CONVERSATION, { id: 1, meta: {} }],
+      ]);
+    });
+    it('sends correct actions if API is error', async () => {
+      axios.get.mockRejectedValue({ message: 'Incorrect header' });
+      await actions.getConversation({ commit });
+      expect(commit.mock.calls).toEqual([]);
+    });
+  });
+});

app/views/api/v1/conversations/messages/index.json.jbuilder

@@ -0,0 +1,20 @@
+json.meta do
+  json.labels @conversation.label_list
+  json.additional_attributes @conversation.additional_attributes
+  json.contact_id @conversation.contact_id
+end
+
+json.payload do
+  json.array! @messages do |message|
+    json.id message.id
+    json.content message.content
+    json.inbox_id message.inbox_id
+    json.conversation_id message.conversation.display_id
+    json.message_type message.message_type_before_type_cast
+    json.created_at message.created_at.to_i
+    json.private message.private
+    json.source_id message.source_id
+    json.attachment message.attachment.push_event_data if message.attachment
+    json.sender message.user.push_event_data if message.user
+  end
+end

app/views/api/v1/conversations/show.json.jbuilder

@@ -1,20 +1 @@
-json.meta do
-  json.labels @conversation.label_list
-  json.additional_attributes @conversation.additional_attributes
-  json.contact_id @conversation.contact_id
-end
-
-json.payload do
-  json.array! @messages do |message|
-    json.id message.id
-    json.content message.content
-    json.inbox_id message.inbox_id
-    json.conversation_id message.conversation.display_id
-    json.message_type message.message_type_before_type_cast
-    json.created_at message.created_at.to_i
-    json.private message.private
-    json.source_id message.source_id
-    json.attachment message.attachment.push_event_data if message.attachment
-    json.sender message.user.push_event_data if message.user
-  end
-end
+json.partial! 'api/v1/conversations/partials/conversation.json.jbuilder', conversation: @conversation

config/routes.rb

@@ -73,8 +73,8 @@ Rails.application.routes.draw do
       end
 
       resources :conversations, only: [:index, :show] do
-        scope module: :conversations do # for nested controller
-          resources :messages, only: [:create]
+        scope module: :conversations do
+          resources :messages, only: [:index, :create]
           resources :assignments, only: [:create]
           resources :labels, only: [:create, :index]
         end

spec/controllers/api/v1/conversations/messages_controller_spec.rb

@@ -31,4 +31,29 @@ RSpec.describe 'Conversation Messages API', type: :request do
       end
     end
   end
+
+  describe 'GET /api/v1/conversations/:id/messages' do
+    let(:conversation) { create(:conversation, account: account) }
+
+    context 'when it is an unauthenticated user' do
+      it 'returns unauthorized' do
+        get "/api/v1/conversations/#{conversation.display_id}/messages"
+
+        expect(response).to have_http_status(:unauthorized)
+      end
+    end
+
+    context 'when it is an authenticated user' do
+      let(:agent) { create(:user, account: account, role: :agent) }
+
+      it 'shows the conversation' do
+        get "/api/v1/conversations/#{conversation.display_id}/messages",
+            headers: agent.create_new_auth_token,
+            as: :json
+
+        expect(response).to have_http_status(:success)
+        expect(JSON.parse(response.body, symbolize_names: true)[:meta][:contact_id]).to eq(conversation.contact_id)
+      end
+    end
+  end
 end

spec/controllers/api/v1/conversations_controller_spec.rb

@@ -51,7 +51,7 @@ RSpec.describe 'Conversations API', type: :request do
             as: :json
 
         expect(response).to have_http_status(:success)
-        expect(JSON.parse(response.body, symbolize_names: true)[:meta][:contact_id]).to eq(conversation.contact_id)
+        expect(JSON.parse(response.body, symbolize_names: true)[:id]).to eq(conversation.display_id)
       end
     end
   end