Merge branch 'develop' into chore/improve-conversation-snooze

2026-02-26 00:15:29 +05:30
parent a87f07619c 9fab70aebf
commit 193933be46
14 changed files with 100 additions and 164 deletions
@@ -158,21 +158,7 @@ const isAnyDropdownActive = computed(() => {

 const handleContactSearch = value => {
  showContactsDropdown.value = true;
-  const query = typeof value === 'string' ? value.trim() : '';
-  const hasAlphabet = Array.from(query).some(char => {
-    const lower = char.toLowerCase();
-    const upper = char.toUpperCase();
-    return lower !== upper;
-  });
-  const isEmailLike = /^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(query);
-
-  const keys = ['email', 'phone_number', 'name'].filter(key => {
-    if (key === 'phone_number' && hasAlphabet) return false;
-    if (key === 'name' && isEmailLike) return false;
-    return true;
-  });
-
-  emit('searchContacts', { keys, query: value });
+  emit('searchContacts', value);
 };

 const handleDropdownUpdate = (type, value) => {
@@ -187,12 +173,12 @@ const handleDropdownUpdate = (type, value) => {

 const searchCcEmails = value => {
  showCcEmailsDropdown.value = true;
-  emit('searchContacts', { keys: ['email'], query: value });
+  emit('searchContacts', value);
 };

 const searchBccEmails = value => {
  showBccEmailsDropdown.value = true;
-  emit('searchContacts', { keys: ['email'], query: value });
+  emit('searchContacts', value);
 };

 const setSelectedContact = async ({ value, action, ...rest }) => {
@@ -44,14 +44,16 @@ const bccEmailsArray = computed(() =>
 );

 const contactEmailsList = computed(() => {
-  return props.contacts?.map(({ name, id, email }) => ({
-    id,
-    label: email,
-    email,
-    thumbnail: { name: name, src: '' },
-    value: id,
-    action: 'email',
-  }));
+  return props.contacts
+    ?.filter(contact => contact.email)
+    .map(({ name, id, email }) => ({
+      id,
+      label: email,
+      email,
+      thumbnail: { name: name, src: '' },
+      value: id,
+      action: 'email',
+    }));
 });

 // Handle updates from TagInput and convert array back to string
@@ -176,32 +176,14 @@ export const prepareWhatsAppMessagePayload = ({
  };
 };

-export const generateContactQuery = ({ keys = ['email'], query }) => {
-  return {
-    payload: keys.map(key => {
-      const filterPayload = {
-        attribute_key: key,
-        filter_operator: 'contains',
-        values: [query],
-        attribute_model: 'standard',
-      };
-      if (keys.findIndex(k => k === key) !== keys.length - 1) {
-        filterPayload.query_operator = 'or';
-      }
-      return filterPayload;
-    }),
-  };
-};
-
 // API Calls
-export const searchContacts = async ({ keys, query }) => {
+export const searchContacts = async query => {
+  const trimmed = typeof query === 'string' ? query.trim() : '';
+  if (!trimmed) return [];
+
  const {
    data: { payload },
-  } = await ContactAPI.filter(
-    undefined,
-    'name',
-    generateContactQuery({ keys, query })
-  );
+  } = await ContactAPI.search(trimmed);
  const camelCasedPayload = camelcaseKeys(payload, { deep: true });
  // Filter contacts that have either phone_number or email
  const filteredPayload = camelCasedPayload?.filter(
@@ -336,70 +336,6 @@ describe('composeConversationHelper', () => {
    });
  });

-  describe('generateContactQuery', () => {
-    it('generates correct query structure for contact search', () => {
-      const query = 'test@example.com';
-      const expected = {
-        payload: [
-          {
-            attribute_key: 'email',
-            filter_operator: 'contains',
-            values: [query],
-            attribute_model: 'standard',
-          },
-        ],
-      };
-
-      expect(helpers.generateContactQuery({ keys: ['email'], query })).toEqual(
-        expected
-      );
-    });
-
-    it('handles empty query', () => {
-      const expected = {
-        payload: [
-          {
-            attribute_key: 'email',
-            filter_operator: 'contains',
-            values: [''],
-            attribute_model: 'standard',
-          },
-        ],
-      };
-
-      expect(
-        helpers.generateContactQuery({ keys: ['email'], query: '' })
-      ).toEqual(expected);
-    });
-
-    it('handles mutliple keys', () => {
-      const expected = {
-        payload: [
-          {
-            attribute_key: 'email',
-            filter_operator: 'contains',
-            values: ['john'],
-            attribute_model: 'standard',
-            query_operator: 'or',
-          },
-          {
-            attribute_key: 'phone_number',
-            filter_operator: 'contains',
-            values: ['john'],
-            attribute_model: 'standard',
-          },
-        ],
-      };
-
-      expect(
-        helpers.generateContactQuery({
-          keys: ['email', 'phone_number'],
-          query: 'john',
-        })
-      ).toEqual(expected);
-    });
-  });
-
  describe('API calls', () => {
    describe('searchContacts', () => {
      it('searches contacts and returns camelCase results', async () => {
@@ -413,14 +349,11 @@ describe('composeConversationHelper', () => {
          },
        ];

-        ContactAPI.filter.mockResolvedValue({
+        ContactAPI.search.mockResolvedValue({
          data: { payload: mockPayload },
        });

-        const result = await helpers.searchContacts({
-          keys: ['email'],
-          query: 'john',
-        });
+        const result = await helpers.searchContacts('john');

        expect(result).toEqual([
          {
@@ -432,16 +365,7 @@ describe('composeConversationHelper', () => {
          },
        ]);

-        expect(ContactAPI.filter).toHaveBeenCalledWith(undefined, 'name', {
-          payload: [
-            {
-              attribute_key: 'email',
-              filter_operator: 'contains',
-              values: ['john'],
-              attribute_model: 'standard',
-            },
-          ],
-        });
+        expect(ContactAPI.search).toHaveBeenCalledWith('john');
      });

      it('searches contacts and returns only contacts with email or phone number', async () => {
@@ -469,14 +393,11 @@ describe('composeConversationHelper', () => {
          },
        ];

-        ContactAPI.filter.mockResolvedValue({
+        ContactAPI.search.mockResolvedValue({
          data: { payload: mockPayload },
        });

-        const result = await helpers.searchContacts({
-          keys: ['email'],
-          query: 'john',
-        });
+        const result = await helpers.searchContacts('john');

        // Should only return contacts with either email or phone number
        expect(result).toEqual([
@@ -496,20 +417,11 @@ describe('composeConversationHelper', () => {
          },
        ]);

-        expect(ContactAPI.filter).toHaveBeenCalledWith(undefined, 'name', {
-          payload: [
-            {
-              attribute_key: 'email',
-              filter_operator: 'contains',
-              values: ['john'],
-              attribute_model: 'standard',
-            },
-          ],
-        });
+        expect(ContactAPI.search).toHaveBeenCalledWith('john');
      });

      it('handles empty search results', async () => {
-        ContactAPI.filter.mockResolvedValue({
+        ContactAPI.search.mockResolvedValue({
          data: { payload: [] },
        });

@@ -536,7 +448,7 @@ describe('composeConversationHelper', () => {
          },
        ];

-        ContactAPI.filter.mockResolvedValue({
+        ContactAPI.search.mockResolvedValue({
          data: { payload: mockPayload },
        });

@@ -955,10 +955,8 @@ watch(conversationFilters, (newVal, oldVal) => {
        ref="virtualListRef"
        v-slot="{ item, index }"
        :data="conversationList"
-        :overscan="10"
      >
        <ConversationItem
-          :key="item.id"
          :source="item"
          :label="label"
          :team-id="teamId"
@@ -50,7 +50,6 @@ export default {

 <template>
  <ConversationCard
-    :key="source.id"
    :active-label="label"
    :team-id="teamId"
    :folders-id="foldersId"
@@ -24,6 +24,10 @@ export default {
      type: [String, Date, Number],
      default: '',
    },
+    conversationId: {
+      type: [String, Number],
+      default: '',
+    },
  },
  data() {
    return {
@@ -74,6 +78,15 @@ export default {
    createdAtTimestamp() {
      this.createdAtTimeAgo = dynamicTime(this.createdAtTimestamp);
    },
+    conversationId() {
+      // Reset display values and timer when the row is recycled to a different conversation.
+      this.lastActivityAtTimeAgo = dynamicTime(this.lastActivityTimestamp);
+      this.createdAtTimeAgo = dynamicTime(this.createdAtTimestamp);
+      if (this.isAutoRefreshEnabled) {
+        clearTimeout(this.timer);
+        this.createTimer();
+      }
+    },
  },
  mounted() {
    if (this.isAutoRefreshEnabled) {
@@ -111,7 +124,6 @@ export default {
    v-tooltip.top="{
      content: tooltipText,
      delay: { show: 1000, hide: 0 },
-      hideOnClick: true,
    }"
    class="ml-auto leading-4 text-xxs text-n-slate-10 hover:text-n-slate-11"
  >
@@ -1,5 +1,5 @@
 <script setup>
-import { computed, ref } from 'vue';
+import { computed, ref, watch } from 'vue';
 import { useRouter } from 'vue-router';
 import { useStore, useMapGetter } from 'dashboard/composables/store';
 import { getLastMessage } from 'dashboard/helper/conversationHelper';
@@ -50,10 +50,21 @@ const store = useStore();

 const hovered = ref(false);
 const showContextMenu = ref(false);
-const contextMenu = ref({
-  x: null,
-  y: null,
-});
+const contextMenu = ref({ x: null, y: null });
+
+// Reset UI state when conversation changes at same index (no :key, instance reused on reorder)
+// This prevents context menu/hover state from leaking to a different conversation
+// Emit contextMenuToggle(false) to sync parent state if menu was open during recycling
+const resetState = () => {
+  if (showContextMenu.value) {
+    emit('contextMenuToggle', false);
+  }
+  hovered.value = false;
+  showContextMenu.value = false;
+  contextMenu.value = { x: null, y: null };
+};
+
+watch(() => props.chat.id, resetState);

 const currentChat = useMapGetter('getSelectedChat');
 const inboxesList = useMapGetter('inboxes/getInboxes');
@@ -352,6 +363,7 @@ const deleteConversation = () => {
          <TimeAgo
            :last-activity-timestamp="chat.timestamp"
            :created-at-timestamp="chat.created_at"
+            :conversation-id="chat.id"
          />
        </span>
        <span
@@ -36,7 +36,6 @@ export default {
    v-tooltip="{
      content: tooltipText,
      delay: { show: 1500, hide: 0 },
-      hideOnClick: true,
    }"
    class="shrink-0 rounded-sm inline-flex items-center justify-center w-3.5 h-3.5"
    :class="{
@@ -119,10 +119,7 @@ const debouncedSearch = debounce(async query => {
  }

  try {
-    const contacts = await searchContacts({
-      keys: ['name', 'email', 'phone_number'],
-      query,
-    });
+    const contacts = await searchContacts(query);

    // Add selected contact to top if not already in results
    const allContacts = selectedContact.value