feat: show email subject in conversation search results (#10843)

# Pull Request Template

## Description

This addresses #10842. It exposes `additional_attributes` in the
conversations search endpoint, uses it in
`SearchResultConversationsList` to pass
`conversation.additional_attributes?.mail_subject` down to
`SearchResultConversationItem`, which in turn displays it.

Fixes #10842

## Type of change

Please delete options that are not relevant.

- [ ] Bug fix (non-breaking change which fixes an issue)
- [x] New feature (non-breaking change which adds functionality)
- [ ] Breaking change (fix or feature that would cause existing
functionality not to work as expected)
- [ ] This change requires a documentation update

## How Has This Been Tested?

I have tested this locally by searching for conversations. See this
screenshot where I searched for "noreply":
![Screenshot from 2025-02-05
11-04-54](https://github.com/user-attachments/assets/689e3e99-c20b-48a7-9c3e-35d45ffeafc1)

I would love to add automated tests but I’m not sure how to do that.

## Checklist:

- [x] My code follows the style guidelines of this project
- [x] I have performed a self-review of my code
- [x] I have commented on my code, particularly in hard-to-understand
areas
- [ ] I have made corresponding changes to the documentation
- [x] My changes generate no new warnings
- [ ] I have added tests that prove my fix is effective or that my
feature works
- [ ] New and existing unit tests pass locally with my changes
- [x] Any dependent changes have been merged and published in downstream
modules

---------

Co-authored-by: Sivin Varghese <64252451+iamsivin@users.noreply.github.com>
Co-authored-by: iamsivin <iamsivin@gmail.com>

app/javascript/dashboard/modules/search/components/SearchResultConversationItem.vue

@@ -35,6 +35,10 @@ const props = defineProps({
     type: Number,
     default: 0,
   },
+  emailSubject: {
+    type: String,
+    default: '',
+  },
 });
 
 const navigateTo = computed(() => {
@@ -49,6 +53,28 @@ const navigateTo = computed(() => {
 });
 
 const createdAtTime = dynamicTime(props.createdAt);
+
+const infoItems = computed(() => [
+  {
+    label: 'SEARCH.FROM',
+    value: props.name,
+    show: !!props.name,
+  },
+  {
+    label: 'SEARCH.EMAIL',
+    value: props.email,
+    show: !!props.email,
+  },
+  {
+    label: 'SEARCH.EMAIL_SUBJECT',
+    value: props.emailSubject,
+    show: !!props.emailSubject,
+  },
+]);
+
+const visibleInfoItems = computed(() =>
+  infoItems.value.filter(item => item.show)
+);
 </script>
 
 <template>
@@ -86,26 +112,18 @@ const createdAtTime = dynamicTime(props.createdAt);
           {{ createdAtTime }}
         </span>
       </div>
-      <div class="flex gap-2">
+      <div class="flex flex-wrap gap-x-2 gap-y-1.5">
         <h5
-          v-if="name"
-          class="m-0 text-sm min-w-0 truncate text-n-slate-12 dark:text-n-slate-12"
-        >
-          <span class="text-xs font-norma text-n-slate-11 dark:text-n-slate-11">
-            {{ $t('SEARCH.FROM') }}:
-          </span>
-          {{ name }}
-        </h5>
-        <h5
-          v-if="email"
-          class="m-0 overflow-hidden text-sm text-n-slate-12 dark:text-n-slate-12 truncate"
+          v-for="item in visibleInfoItems"
+          :key="item.label"
+          class="m-0 text-sm min-w-0 text-n-slate-12 dark:text-n-slate-12 truncate"
         >
           <span
             class="text-xs font-normal text-n-slate-11 dark:text-n-slate-11"
           >
-            {{ $t('SEARCH.EMAIL') }}:
+            {{ $t(item.label) }}:
           </span>
-          {{ email }}
+          {{ item.value }}
         </h5>
       </div>
       <slot />