feat: Add a view for unattended conversations (#5890)

Co-authored-by: Pranav Raj S <pranav@chatwoot.com>

app/finders/conversation_finder.rb

@@ -56,7 +56,6 @@ class ConversationFinder
     filter_by_team if @team
     filter_by_labels if params[:labels]
     filter_by_query if params[:q]
-    filter_by_reply_status
   end
 
   def set_inboxes
@@ -76,12 +75,9 @@ class ConversationFinder
   end
 
   def find_all_conversations
-    if params[:conversation_type] == 'mention'
-      conversation_ids = current_account.mentions.where(user: current_user).pluck(:conversation_id)
-      @conversations = current_account.conversations.where(id: conversation_ids)
-    else
     @conversations = current_account.conversations.where(inbox_id: @inbox_ids)
-    end
+    filter_by_conversation_type if params[:conversation_type]
+    @conversations
   end
 
   def filter_by_assignee_type
@@ -96,8 +92,15 @@ class ConversationFinder
     @conversations
   end
 
-  def filter_by_reply_status
+  def filter_by_conversation_type
-    @conversations = @conversations.where(first_reply_created_at: nil) if params[:reply_status] == 'unattended'
+    case @params[:conversation_type]
+    when 'mention'
+      conversation_ids = current_account.mentions.where(user: current_user).pluck(:conversation_id)
+      @conversations = @conversations.where(id: conversation_ids)
+    when 'unattended'
+      @conversations = @conversations.where(first_reply_created_at: nil)
+    end
+    @conversations
   end
 
   def filter_by_query

app/javascript/dashboard/components/ChatList.vue

@@ -335,10 +335,8 @@ export default {
         status: this.activeStatus,
         page: this.currentPage + 1,
         labels: this.label ? [this.label] : undefined,
-        teamId: this.teamId ? this.teamId : undefined,
+        teamId: this.teamId || undefined,
-        conversationType: this.conversationType
+        conversationType: this.conversationType || undefined,
-          ? this.conversationType
-          : undefined,
         folders: this.hasActiveFolders ? this.savedFoldersValue : undefined,
       };
     },
@@ -355,6 +353,9 @@ export default {
       if (this.conversationType === 'mention') {
         return this.$t('CHAT_LIST.MENTION_HEADING');
       }
+      if (this.conversationType === 'unattended') {
+        return this.$t('CHAT_LIST.UNATTENDED_HEADING');
+      }
       if (this.hasActiveFolders) {
         return this.activeFolder.name;
       }

app/javascript/dashboard/components/layout/config/sidebarItems/conversations.js

@@ -16,6 +16,8 @@ const conversations = accountId => ({
     'conversation_through_mentions',
     'folder_conversations',
     'conversations_through_folders',
+    'conversation_unattended',
+    'conversation_through_unattended',
   ],
   menuItems: [
     {
@@ -33,6 +35,13 @@ const conversations = accountId => ({
       toState: frontendURL(`accounts/${accountId}/mentions/conversations`),
       toStateName: 'conversation_mentions',
     },
+    {
+      icon: 'mail-unread',
+      label: 'UNATTENDED_CONVERSATIONS',
+      key: 'conversation_unattended',
+      toState: frontendURL(`accounts/${accountId}/unattended/conversations`),
+      toStateName: 'conversation_unattended',
+    },
   ],
 });
 

app/javascript/dashboard/helper/URLHelper.js

@@ -56,6 +56,8 @@ export const conversationUrl = ({
     url = `accounts/${accountId}/custom_view/${foldersId}/conversations/${id}`;
   } else if (conversationType === 'mention') {
     url = `accounts/${accountId}/mentions/conversations/${id}`;
+  } else if (conversationType === 'unattended') {
+    url = `accounts/${accountId}/unattended/conversations/${id}`;
   }
   return url;
 };

app/javascript/dashboard/i18n/locale/en/chatlist.json

@@ -8,6 +8,7 @@
     },
     "TAB_HEADING": "Conversations",
     "MENTION_HEADING": "Mentions",
+    "UNATTENDED_HEADING": "Unattended",
     "SEARCH": {
       "INPUT": "Search for People, Chats, Saved Replies .."
     },

app/javascript/dashboard/i18n/locale/en/settings.json

@@ -177,6 +177,7 @@
     "CONVERSATIONS": "Conversations",
     "ALL_CONVERSATIONS": "All Conversations",
     "MENTIONED_CONVERSATIONS": "Mentions",
+    "UNATTENDED_CONVERSATIONS": "Unattended",
     "REPORTS": "Reports",
     "SETTINGS": "Settings",
     "CONTACTS": "Contacts",

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

@@ -121,5 +121,25 @@ export default {
         conversationType: 'mention',
       }),
     },
+
+    {
+      path: frontendURL('accounts/:accountId/unattended/conversations'),
+      name: 'conversation_unattended',
+      roles: ['administrator', 'agent'],
+      component: ConversationView,
+      props: () => ({ conversationType: 'unattended' }),
+    },
+    {
+      path: frontendURL(
+        'accounts/:accountId/unattended/conversations/:conversationId'
+      ),
+      name: 'conversation_through_unattended',
+      roles: ['administrator', 'agent'],
+      component: ConversationView,
+      props: route => ({
+        conversationId: route.params.conversationId,
+        conversationType: 'unattended',
+      }),
+    },
   ],
 };

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

@@ -7,6 +7,7 @@ import { createPendingMessage } from 'dashboard/helper/commons';
 import {
   buildConversationList,
   isOnMentionsView,
+  isOnUnattendedView,
 } from './helpers/actionHelpers';
 import messageReadActions from './actions/messageReadActions';
 // actions
@@ -230,6 +231,7 @@ const actions = {
     if (
       !hasAppliedFilters &&
       !isOnMentionsView(rootState) &&
+      !isOnUnattendedView(rootState) &&
       isMatchingInboxFilter
     ) {
       commit(types.ADD_CONVERSATION, conversation);
@@ -243,6 +245,12 @@ const actions = {
     }
   },
 
+  addUnattended({ dispatch, rootState }, conversation) {
+    if (isOnUnattendedView(rootState)) {
+      dispatch('updateConversation', conversation);
+    }
+  },
+
   updateConversation({ commit, dispatch }, conversation) {
     const {
       meta: { sender },

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

@@ -5,33 +5,54 @@ export const findPendingMessageIndex = (chat, message) => {
   );
 };
 
-const filterByStatus = (chatStatus, filterStatus) =>
+export const filterByStatus = (chatStatus, filterStatus) =>
   filterStatus === 'all' ? true : chatStatus === filterStatus;
 
+export const filterByInbox = (shouldFilter, inboxId, chatInboxId) => {
+  const isOnInbox = Number(inboxId) === chatInboxId;
+  return inboxId ? isOnInbox && shouldFilter : shouldFilter;
+};
+
+export const filterByTeam = (shouldFilter, teamId, chatTeamId) => {
+  const isOnTeam = Number(teamId) === chatTeamId;
+  return teamId ? isOnTeam && shouldFilter : shouldFilter;
+};
+
+export const filterByLabel = (shouldFilter, labels, chatLabels) => {
+  const isOnLabel = labels.every(label => chatLabels.includes(label));
+  return labels.length ? isOnLabel && shouldFilter : shouldFilter;
+};
+export const filterByUnattended = (
+  shouldFilter,
+  conversationType,
+  firstReplyOn
+) => {
+  return conversationType === 'unattended'
+    ? !firstReplyOn && shouldFilter
+    : shouldFilter;
+};
+
 export const applyPageFilters = (conversation, filters) => {
-  const { inboxId, status, labels = [], teamId } = filters;
+  const { inboxId, status, labels = [], teamId, conversationType } = filters;
   const {
     status: chatStatus,
     inbox_id: chatInboxId,
     labels: chatLabels = [],
     meta = {},
+    first_reply_created_at: firstReplyOn,
   } = conversation;
   const team = meta.team || {};
   const { id: chatTeamId } = team;
 
   let shouldFilter = filterByStatus(chatStatus, status);
-  if (inboxId) {
+  shouldFilter = filterByInbox(shouldFilter, inboxId, chatInboxId);
-    const filterByInbox = Number(inboxId) === chatInboxId;
+  shouldFilter = filterByTeam(shouldFilter, teamId, chatTeamId);
-    shouldFilter = shouldFilter && filterByInbox;
+  shouldFilter = filterByLabel(shouldFilter, labels, chatLabels);
-  }
+  shouldFilter = filterByUnattended(
-  if (teamId) {
+    shouldFilter,
-    const filterByTeam = Number(teamId) === chatTeamId;
+    conversationType,
-    shouldFilter = shouldFilter && filterByTeam;
+    firstReplyOn
-  }
+  );
-  if (labels.length) {
-    const filterByLabels = labels.every(label => chatLabels.includes(label));
-    shouldFilter = shouldFilter && filterByLabels;
-  }
 
   return shouldFilter;
 };

app/javascript/dashboard/store/modules/conversations/helpers/actionHelpers.js

@@ -22,6 +22,14 @@ export const isOnMentionsView = ({ route: { name: routeName } }) => {
   return MENTION_ROUTES.includes(routeName);
 };
 
+export const isOnUnattendedView = ({ route: { name: routeName } }) => {
+  const UNATTENDED_ROUTES = [
+    'conversation_unattended',
+    'conversation_through_unattended',
+  ];
+  return UNATTENDED_ROUTES.includes(routeName);
+};
+
 export const buildConversationList = (
   context,
   requestPayload,

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

@@ -1,6 +1,10 @@
 import {
   findPendingMessageIndex,
   applyPageFilters,
+  filterByInbox,
+  filterByTeam,
+  filterByLabel,
+  filterByUnattended,
 } from '../../conversations/helpers';
 
 const conversationList = [
@@ -119,3 +123,52 @@ describe('#applyPageFilters', () => {
     });
   });
 });
+
+describe('#filterByInbox', () => {
+  it('returns true if conversation has inbox filter active', () => {
+    const inboxId = '1';
+    const chatInboxId = 1;
+    expect(filterByInbox(true, inboxId, chatInboxId)).toEqual(true);
+  });
+  it('returns false if inbox filter is not active', () => {
+    const inboxId = '1';
+    const chatInboxId = 13;
+    expect(filterByInbox(true, inboxId, chatInboxId)).toEqual(false);
+  });
+});
+
+describe('#filterByTeam', () => {
+  it('returns true if conversation has team and team filter is active', () => {
+    const [teamId, chatTeamId] = ['1', 1];
+    expect(filterByTeam(true, teamId, chatTeamId)).toEqual(true);
+  });
+  it('returns false if team filter is not active', () => {
+    const [teamId, chatTeamId] = ['1', 12];
+    expect(filterByTeam(true, teamId, chatTeamId)).toEqual(false);
+  });
+});
+
+describe('#filterByLabel', () => {
+  it('returns true if conversation has labels and labels filter is active', () => {
+    const labels = ['dev', 'cs'];
+    const chatLabels = ['dev', 'cs', 'sales'];
+    expect(filterByLabel(true, labels, chatLabels)).toEqual(true);
+  });
+  it('returns false if conversation has not all labels', () => {
+    const labels = ['dev', 'cs', 'sales'];
+    const chatLabels = ['cs', 'sales'];
+    expect(filterByLabel(true, labels, chatLabels)).toEqual(false);
+  });
+});
+
+describe('#filterByUnattended', () => {
+  it('returns true if conversation type is unattended and has no first reply', () => {
+    expect(filterByUnattended(true, 'unattended', undefined)).toEqual(true);
+  });
+  it('returns false if conversation type is not unattended and has no first reply', () => {
+    expect(filterByUnattended(false, 'mentions', undefined)).toEqual(false);
+  });
+  it('returns true if conversation type is unattended and has first reply', () => {
+    expect(filterByUnattended(true, 'mentions', 123)).toEqual(true);
+  });
+});

app/javascript/shared/components/FluentIcon/dashboard-icons.json

@@ -95,6 +95,7 @@
   "location-outline": "M5.843 4.568a8.707 8.707 0 1 1 12.314 12.314l-1.187 1.174c-.875.858-2.01 1.962-3.406 3.312a2.25 2.25 0 0 1-3.128 0l-3.491-3.396c-.439-.431-.806-.794-1.102-1.09a8.707 8.707 0 0 1 0-12.314Zm11.253 1.06A7.207 7.207 0 1 0 6.904 15.822L8.39 17.29a753.98 753.98 0 0 0 3.088 3 .75.75 0 0 0 1.043 0l3.394-3.3c.47-.461.863-.85 1.18-1.168a7.207 7.207 0 0 0 0-10.192ZM12 7.999a3.002 3.002 0 1 1 0 6.004 3.002 3.002 0 0 1 0-6.003Zm0 1.5a1.501 1.501 0 1 0 0 3.004 1.501 1.501 0 0 0 0-3.003Z",
   "lock-closed-outline": "M12 2a4 4 0 0 1 4 4v2h1.75A2.25 2.25 0 0 1 20 10.25v9.5A2.25 2.25 0 0 1 17.75 22H6.25A2.25 2.25 0 0 1 4 19.75v-9.5A2.25 2.25 0 0 1 6.25 8H8V6a4 4 0 0 1 4-4Zm5.75 7.5H6.25a.75.75 0 0 0-.75.75v9.5c0 .414.336.75.75.75h11.5a.75.75 0 0 0 .75-.75v-9.5a.75.75 0 0 0-.75-.75Zm-5.75 4a1.5 1.5 0 1 1 0 3 1.5 1.5 0 0 1 0-3Zm0-10A2.5 2.5 0 0 0 9.5 6v2h5V6A2.5 2.5 0 0 0 12 3.5Z",
   "mail-inbox-all-outline": "M6.25 3h11.5a3.25 3.25 0 0 1 3.245 3.066L21 6.25v11.5a3.25 3.25 0 0 1-3.066 3.245L17.75 21H6.25a3.25 3.25 0 0 1-3.245-3.066L3 17.75V6.25a3.25 3.25 0 0 1 3.066-3.245L6.25 3Zm2.075 11.5H4.5v3.25a1.75 1.75 0 0 0 1.606 1.744l.144.006h11.5a1.75 1.75 0 0 0 1.744-1.607l.006-.143V14.5h-3.825a3.752 3.752 0 0 1-3.475 2.995l-.2.005a3.752 3.752 0 0 1-3.632-2.812l-.043-.188Zm9.425-10H6.25a1.75 1.75 0 0 0-1.744 1.606L4.5 6.25V13H9a.75.75 0 0 1 .743.648l.007.102a2.25 2.25 0 0 0 4.495.154l.005-.154a.75.75 0 0 1 .648-.743L15 13h4.5V6.25a1.75 1.75 0 0 0-1.607-1.744L17.75 4.5Zm-11 5h10.5a.75.75 0 0 1 .102 1.493L17.25 11H6.75a.75.75 0 0 1-.102-1.493L6.75 9.5h10.5-10.5Zm0-3h10.5a.75.75 0 0 1 .102 1.493L17.25 8H6.75a.75.75 0 0 1-.102-1.493L6.75 6.5h10.5-10.5Z",
+  "mail-unread-outline": "M16 6.5H5.25a1.75 1.75 0 0 0-1.744 1.606l-.004.1L11 12.153l6.03-3.174a3.489 3.489 0 0 0 2.97.985v6.786a3.25 3.25 0 0 1-3.066 3.245L16.75 20H5.25a3.25 3.25 0 0 1-3.245-3.066L2 16.75v-8.5a3.25 3.25 0 0 1 3.066-3.245L5.25 5h11.087A3.487 3.487 0 0 0 16 6.5Zm2.5 3.399-7.15 3.765a.75.75 0 0 1-.603.042l-.096-.042L3.5 9.9v6.85a1.75 1.75 0 0 0 1.606 1.744l.144.006h11.5a1.75 1.75 0 0 0 1.744-1.607l.006-.143V9.899ZM19.5 4a2.5 2.5 0 1 1 0 5 2.5 2.5 0 0 1 0-5Z",
   "mail-outline": "M5.25 4h13.5a3.25 3.25 0 0 1 3.245 3.066L22 7.25v9.5a3.25 3.25 0 0 1-3.066 3.245L18.75 20H5.25a3.25 3.25 0 0 1-3.245-3.066L2 16.75v-9.5a3.25 3.25 0 0 1 3.066-3.245L5.25 4h13.5-13.5ZM20.5 9.373l-8.15 4.29a.75.75 0 0 1-.603.043l-.096-.042L3.5 9.374v7.376a1.75 1.75 0 0 0 1.606 1.744l.144.006h13.5a1.75 1.75 0 0 0 1.744-1.607l.006-.143V9.373ZM18.75 5.5H5.25a1.75 1.75 0 0 0-1.744 1.606L3.5 7.25v.429l8.5 4.473 8.5-4.474V7.25a1.75 1.75 0 0 0-1.607-1.744L18.75 5.5Z",
   "map-outline": "m9.203 4 .047-.002.046.001a.73.73 0 0 1 .067.007l.016.004c.086.014.17.044.252.092l.051.034 5.07 3.565L19.82 4.14a.75.75 0 0 1 1.174.51l.007.104v10.632a.75.75 0 0 1-.238.548l-.08.066-5.5 3.866a.744.744 0 0 1-.828.023L9.25 16.297l-5.07 3.565a.75.75 0 0 1-1.174-.51l-.007-.104V8.616a.75.75 0 0 1 .238-.548l.08-.066 5.5-3.866a.762.762 0 0 1 .2-.101l.122-.028.064-.008Zm10.298 2.197-4 2.812v8.799l4-2.812v-8.8ZM8.5 6.193l-4 2.812v8.8l4-2.813V6.193Zm1.502 0v8.8l4 2.811V9.005l-4-2.812Z",
   "megaphone-outline": "M21.907 5.622c.062.208.093.424.093.641V17.74a2.25 2.25 0 0 1-2.891 2.156l-5.514-1.64a4.002 4.002 0 0 1-7.59-1.556L6 16.5l-.001-.5-2.39-.711A2.25 2.25 0 0 1 2 13.131V10.87a2.25 2.25 0 0 1 1.61-2.156l15.5-4.606a2.25 2.25 0 0 1 2.797 1.515ZM7.499 16.445l.001.054a2.5 2.5 0 0 0 4.624 1.321l-4.625-1.375Zm12.037-10.9-15.5 4.605a.75.75 0 0 0-.536.72v2.261a.75.75 0 0 0 .536.72l15.5 4.607a.75.75 0 0 0 .964-.72V6.264a.75.75 0 0 0-.964-.719Z",

app/listeners/reporting_event_listener.rb

@@ -36,9 +36,9 @@ class ReportingEventListener < BaseListener
       event_start_time: conversation.created_at,
       event_end_time: message.created_at
     )
-    # rubocop:disable Rails/SkipsModelValidations
+
-    conversation.update_columns(first_reply_created_at: message.created_at)
+    conversation.update(first_reply_created_at: message.created_at)
-    # rubocop:enable Rails/SkipsModelValidations
+
     reporting_event.save!
   end
 end

app/models/conversation.rb

@@ -219,7 +219,7 @@ class Conversation < ApplicationRecord
 
   def notify_conversation_updation
     return unless previous_changes.keys.present? && (previous_changes.keys & %w[team_id assignee_id status snoozed_until
-                                                                                custom_attributes label_list]).present?
+                                                                                custom_attributes label_list first_reply_created_at]).present?
 
     dispatcher_dispatch(CONVERSATION_UPDATED, previous_changes)
   end

app/presenters/conversations/event_data_presenter.rb

@@ -14,6 +14,7 @@ class Conversations::EventDataPresenter < SimpleDelegator
       custom_attributes: custom_attributes,
       snoozed_until: snoozed_until,
       unread_count: unread_incoming_messages.count,
+      first_reply_created_at: first_reply_created_at,
       **push_timestamps
     }
   end

app/views/api/v1/conversations/partials/_conversation.json.jbuilder

@@ -38,5 +38,6 @@ json.muted conversation.muted?
 json.snoozed_until conversation.snoozed_until
 json.status conversation.status
 json.timestamp conversation.last_activity_at.to_i
+json.first_reply_created_at conversation.first_reply_created_at.to_i
 json.unread_count conversation.unread_incoming_messages.count
 json.last_non_activity_message conversation.messages.non_activity_messages.first.try(:push_event_data)

spec/controllers/api/v1/accounts/conversations_controller_spec.rb

@@ -53,7 +53,7 @@ RSpec.describe 'Conversations API', type: :request do
 
         get "/api/v1/accounts/#{account.id}/conversations",
             headers: agent_1.create_new_auth_token,
-            params: { reply_status: 'unattended' },
+            params: { conversation_type: 'unattended' },
             as: :json
 
         expect(response).to have_http_status(:success)

spec/finders/conversation_finder_spec.rb

@@ -136,5 +136,15 @@ describe ::ConversationFinder do
         expect(result[:conversations].length).to be 25
       end
     end
+
+    context 'with unattended' do
+      let(:params) { { status: 'open', assignee_type: 'me', conversation_type: 'unattended' } }
+
+      it 'returns unattended conversations' do
+        create_list(:conversation, 25, account: account, inbox: inbox, assignee: user_1)
+        result = conversation_finder.perform
+        expect(result[:conversations].length).to be 25
+      end
+    end
   end
 end

spec/models/conversation_spec.rb

@@ -455,6 +455,7 @@ RSpec.describe Conversation, type: :model do
         channel: 'Channel::WebWidget',
         snoozed_until: conversation.snoozed_until,
         custom_attributes: conversation.custom_attributes,
+        first_reply_created_at: nil,
         contact_last_seen_at: conversation.contact_last_seen_at.to_i,
         agent_last_seen_at: conversation.agent_last_seen_at.to_i,
         unread_count: 0

spec/presenters/conversations/event_data_presenter_spec.rb

@@ -27,6 +27,7 @@ RSpec.describe Conversations::EventDataPresenter do
         timestamp: conversation.last_activity_at.to_i,
         snoozed_until: conversation.snoozed_until,
         custom_attributes: conversation.custom_attributes,
+        first_reply_created_at: nil,
         contact_last_seen_at: conversation.contact_last_seen_at.to_i,
         agent_last_seen_at: conversation.agent_last_seen_at.to_i,
         unread_count: 0