feat: Add assign agent option in macro (#5821)

Co-authored-by: fayazara <fayazara@gmail.com>

app/javascript/dashboard/routes/dashboard/conversation/Macros/MacroPreview.vue

@@ -15,6 +15,7 @@ import {
   resolveActionName,
   resolveTeamIds,
   resolveLabels,
+  resolveAgents,
 } from 'dashboard/routes/dashboard/settings/macros/macroHelper';
 import { mapGetters } from 'vuex';
 
@@ -40,6 +41,7 @@ export default {
     ...mapGetters({
       labels: 'labels/getLabels',
       teams: 'teams/getTeams',
+      agents: 'agents/getAgents',
     }),
   },
   methods: {
@@ -47,6 +49,7 @@ export default {
       const actionsMap = {
         assign_team: resolveTeamIds(this.teams, params),
         add_label: resolveLabels(this.labels, params),
+        assign_best_agent: resolveAgents(this.agents, params),
         mute_conversation: null,
         snooze_conversation: null,
         resolve_conversation: null,

app/javascript/dashboard/routes/dashboard/settings/macros/MacroEditor.vue

@@ -42,6 +42,7 @@ export default {
       uiFlags: 'macros/getUIFlags',
       labels: 'labels/getLabels',
       teams: 'teams/getTeams',
+      agents: 'agents/getAgents',
     }),
     macroId() {
       return this.$route.params.macroId;
@@ -50,6 +51,7 @@ export default {
   watch: {
     $route: {
       handler() {
+        this.fetchDropdownData();
         if (this.$route.params.macroId) {
           this.fetchMacro();
         } else {
@@ -60,11 +62,13 @@ export default {
     },
   },
   methods: {
-    fetchMacro() {
-      this.mode = 'EDIT';
+    fetchDropdownData() {
       this.$store.dispatch('agents/get');
       this.$store.dispatch('teams/get');
       this.$store.dispatch('labels/get');
+    },
+    fetchMacro() {
+      this.mode = 'EDIT';
       this.manifestMacro();
     },
     async manifestMacro() {

app/javascript/dashboard/routes/dashboard/settings/macros/MacroNode.vue

@@ -70,6 +70,7 @@ export default {
     ...mapGetters({
       labels: 'labels/getLabels',
       teams: 'teams/getTeams',
+      agents: 'agents/getAgents',
     }),
     actionData: {
       get() {

app/javascript/dashboard/routes/dashboard/settings/macros/constants.js

@@ -4,6 +4,11 @@ export const MACRO_ACTION_TYPES = [
     label: 'Assign a team',
     inputType: 'multi_select',
   },
+  {
+    key: 'assign_best_agent',
+    label: 'Assign an agent',
+    inputType: 'multi_select',
+  },
   {
     key: 'add_label',
     label: 'Add a label',

app/javascript/dashboard/routes/dashboard/settings/macros/macroHelper.js

@@ -32,6 +32,15 @@ export const resolveLabels = (labels, ids) => {
     .join(', ');
 };
 
+export const resolveAgents = (agents, ids) => {
+  return ids
+    .map(id => {
+      const agent = agents.find(i => i.id === id);
+      return agent ? agent.name : '';
+    })
+    .join(', ');
+};
+
 export const getFileName = (id, actionType, files) => {
   if (!id || !files) return '';
   if (actionType === 'send_attachment') {