From e3b4eb606fdc84cb2399579ff600240e93c4b4fc Mon Sep 17 00:00:00 2001
From: Will Sheldon <114631109+wssheldon@users.noreply.github.com>
Date: Tue, 26 Sep 2023 15:48:32 -0700
Subject: [PATCH] Re-implement ParticipantSelect componenet with v-autocomplete

---
 .../src/incident/ParticipantSelect.vue        | 20 +++++++++++--------
 1 file changed, 12 insertions(+), 8 deletions(-)

diff --git a/src/dispatch/static/dispatch/src/incident/ParticipantSelect.vue b/src/dispatch/static/dispatch/src/incident/ParticipantSelect.vue
index f59b676997ed..af7b319352fb 100644
--- a/src/dispatch/static/dispatch/src/incident/ParticipantSelect.vue
+++ b/src/dispatch/static/dispatch/src/incident/ParticipantSelect.vue
@@ -1,17 +1,18 @@
 <template>
-  <v-combobox
+  <v-autocomplete
     :items="items"
     :label="label"
     :loading="loading"
+    :filter="customFilter"
     :search-input.sync="search"
-    @update:search-input="getFilteredData()"
     chips
     clearable
     deletable-chips
     hide-selected
     item-text="individual.name"
-    no-filter
+    item-value="individual"
     return-object
+    cache-items
     v-model="participant"
   >
     <template #no-data>
@@ -43,7 +44,7 @@
         </v-list-item-content>
       </v-list-item>
     </template>
-  </v-combobox>
+  </v-autocomplete>
 </template>
 
 <script>
@@ -95,9 +96,12 @@ export default {
   },
 
   methods: {
-    loadMore() {
-      this.numItems = this.numItems + 5
-      this.fetchData()
+    customFilter(item, queryText) {
+      const name = item.individual.name.toLowerCase()
+      const email = item.individual.email.toLowerCase()
+      const searchText = queryText.toLowerCase()
+
+      return name.indexOf(searchText) > -1 || email.indexOf(searchText) > -1
     },
     fetchData() {
       this.loading = "error"
@@ -105,7 +109,7 @@ export default {
         q: this.search,
         sortBy: ["name"],
         descending: [false],
-        itemsPerPage: this.numItems,
+        itemsPerPage: -1,
       }
 
       if (this.project) {