diff --git a/src/dispatch/static/dispatch/src/case/priority/CasePrioritySelect.vue b/src/dispatch/static/dispatch/src/case/priority/CasePrioritySelect.vue
index 69986f88807f..fba5cba04eba 100644
--- a/src/dispatch/static/dispatch/src/case/priority/CasePrioritySelect.vue
+++ b/src/dispatch/static/dispatch/src/case/priority/CasePrioritySelect.vue
@@ -1,6 +1,6 @@
 <template>
   <v-select
-    v-model="case_priority"
+    v-model="selectedPriority"
     :items="items"
     item-title="name"
     :menu-props="{ maxHeight: '400' }"
@@ -14,7 +14,7 @@
     <template #item="data">
       <v-list-item v-bind="data.props" :title="null">
         <v-list-item-title>{{ data.item.raw.name }}</v-list-item-title>
-        <v-list-item-subtitle :title="data.item.raw.description">
+        <v-list-item-subtitle>
           {{ data.item.raw.description }}
         </v-list-item-subtitle>
       </v-list-item>
@@ -23,8 +23,6 @@
 </template>
 
 <script>
-import { cloneDeep } from "lodash"
-
 import SearchUtils from "@/search/utils"
 import CasePriorityApi from "@/case/priority/api"
 
@@ -33,12 +31,10 @@ export default {
   props: {
     modelValue: {
       type: Object,
-      default: function () {
-        return {}
-      },
+      default: () => ({}),
     },
     project: {
-      type: [Object],
+      type: Object,
       default: null,
     },
   },
@@ -48,6 +44,7 @@ export default {
       loading: false,
       items: [],
       error: null,
+      lastProjectId: null,
       is_priority_in_project: () => {
         this.validatePriority()
         return this.error
@@ -56,9 +53,16 @@ export default {
   },
 
   computed: {
-    case_priority: {
+    selectedPriority: {
       get() {
-        return cloneDeep(this.modelValue)
+        if (!this.modelValue) return null
+        if (this.modelValue.id) {
+          return this.items.find((item) => item.id === this.modelValue.id) || null
+        }
+        if (this.modelValue.name) {
+          return this.items.find((item) => item.name === this.modelValue.name) || null
+        }
+        return null
       },
       set(value) {
         this.$emit("update:modelValue", value)
@@ -67,7 +71,7 @@ export default {
     },
     show_error() {
       let items_names = this.items.map((item) => item.name)
-      let selected_item = this.case_priority?.name || ""
+      let selected_item = this.selectedPriority?.name || ""
       if (items_names.includes(selected_item) || selected_item == "") {
         return null
       }
@@ -77,15 +81,8 @@ export default {
 
   methods: {
     validatePriority() {
-      let in_project
-      if (this.project?.name) {
-        let project_name = this.project?.name || ""
-        in_project = this.case_priority?.project?.name == project_name
-      } else {
-        let project_id = this.project?.id || 0
-        in_project = this.case_priority?.project?.id == project_id
-      }
-
+      const project_id = this.project?.id || 0
+      const in_project = this.selectedPriority?.project?.id == project_id
       if (in_project) {
         this.error = true
       } else {
@@ -94,7 +91,7 @@ export default {
     },
     fetchData() {
       this.error = null
-      this.loading = "error"
+      this.loading = true
 
       let filterOptions = {
         sortBy: ["view_order"],
@@ -125,23 +122,39 @@ export default {
         enabledFilter
       )
 
-      CasePriorityApi.getAll(filterOptions).then((response) => {
-        this.items = response.data.items
-        this.loading = false
-      })
+      CasePriorityApi.getAll(filterOptions)
+        .then((response) => {
+          this.items = response.data.items
+        })
+        .catch((error) => {
+          console.error("Error fetching case priorities:", error)
+          this.error = "Failed to load case priorities"
+        })
+        .finally(() => {
+          this.loading = false
+        })
+    },
+    resetSelection() {
+      this.$emit("update:modelValue", null)
+    },
+  },
+
+  watch: {
+    project: {
+      handler(newProject) {
+        if (newProject?.id !== this.lastProjectId) {
+          this.lastProjectId = newProject?.id
+          this.resetSelection()
+          this.fetchData()
+        }
+        this.validatePriority()
+      },
+      deep: true,
     },
   },
 
   created() {
     this.fetchData()
-    this.$watch(
-      (vm) => [vm.project],
-      () => {
-        this.fetchData()
-        this.validatePriority()
-        this.$emit("update:modelValue", this.case_priority)
-      }
-    )
   },
 }
 </script>
diff --git a/src/dispatch/static/dispatch/src/case/type/CaseTypeSelect.vue b/src/dispatch/static/dispatch/src/case/type/CaseTypeSelect.vue
index ed521f38cd1a..34f8df53e7cf 100644
--- a/src/dispatch/static/dispatch/src/case/type/CaseTypeSelect.vue
+++ b/src/dispatch/static/dispatch/src/case/type/CaseTypeSelect.vue
@@ -1,6 +1,6 @@
 <template>
   <v-select
-    v-model="case_type"
+    v-model="selectedCaseType"
     :items="items"
     :menu-props="{ maxHeight: '400' }"
     item-title="name"
@@ -30,9 +30,6 @@
         <v-list-item-subtitle> Load More </v-list-item-subtitle>
       </v-list-item>
     </template>
-    <v-col cols="12">
-      <p>Conversation Target: {{ conversation_target }}</p>
-    </v-col>
   </v-select>
 </template>
 
@@ -52,27 +49,24 @@ export default {
       type: Object,
       default: null,
     },
-    hint: {
+    label: {
       type: String,
-      default: () => "Case Type to associate",
+      default: () => "Type",
     },
-    label: {
+    hint: {
       type: String,
-      default: () => "Case Type",
+      default: () => "Case Type to associate",
     },
   },
 
   data() {
     return {
-      conversation_target: null,
       loading: false,
       items: [],
-      search: null,
       more: false,
       numItems: 40,
       error: null,
-      categories: [],
-      selectedCaseType: null,
+      lastProjectId: null,
       is_type_in_project: () => {
         this.validateType()
         return this.error
@@ -81,41 +75,35 @@ export default {
   },
 
   computed: {
-    case_type: {
+    selectedCaseType: {
       get() {
-        return this.selectedCaseType || this.modelValue
+        if (!this.modelValue) return null
+        if (this.modelValue.id) {
+          return this.items.find((item) => item.id === this.modelValue.id) || null
+        }
+        if (this.modelValue.name) {
+          return this.items.find((item) => item.name === this.modelValue.name) || null
+        }
+        return null
       },
       set(value) {
-        this.selectedCaseType = value
         this.$emit("update:modelValue", value)
         this.validateType()
       },
     },
     show_error() {
-      let items_names = this.items.map((item) => item.name)
-      let selected_item = this.case_type?.name || ""
-      if (items_names.includes(selected_item) || selected_item == "") {
-        return null
-      }
-      return "Not a valid case type"
+      return null // Implement any specific error logic here if needed
     },
   },
 
   methods: {
     loadMore() {
-      this.numItems = this.numItems + 5
+      this.numItems += 40
       this.fetchData()
     },
     validateType() {
-      let in_project
-      if (this.project?.name) {
-        let project_name = this.project?.name || ""
-        in_project = this.case_type?.project?.name == project_name
-      } else {
-        let project_id = this.project?.id || 0
-        in_project = this.case_type?.project?.id == project_id
-      }
-
+      const project_id = this.project?.id || 0
+      const in_project = this.selectedCaseType?.project?.id == project_id
       if (in_project) {
         this.error = true
       } else {
@@ -144,86 +132,58 @@ export default {
 
       filterOptions = SearchUtils.createParametersFromTableOptions({ ...filterOptions })
 
-      CaseTypeApi.getAll(filterOptions).then((response) => {
-        // re-sort items by oncall service
-        this.items = []
-        this.categories = []
-        let new_items = {}
-        response.data.items.forEach((item) => {
-          let category = "Team: " + (item.oncall_service?.name || "None")
-          new_items[category] = new_items[category] || []
-          new_items[category].push(item)
+      CaseTypeApi.getAll(filterOptions)
+        .then((response) => {
+          this.items = []
+          let new_items = {}
+          response.data.items.forEach((item) => {
+            let category = "Team: " + (item.oncall_service?.name || "None")
+            new_items[category] = new_items[category] || []
+            new_items[category].push(item)
+          })
+          let keys = Object.keys(new_items)
+          keys.sort((a, b) => {
+            if (a === "Team: None") return 1
+            if (b === "Team: None") return -1
+            return a.localeCompare(b)
+          })
+          keys.forEach((category) => {
+            this.items.push({ category: category })
+            for (let item of new_items[category]) {
+              this.items.push(item)
+            }
+          })
+          this.more = response.data.total > this.items.length
         })
-        let keys = Object.keys(new_items)
-        // ensure Team: None is always at the end
-        keys.sort((a, b) => {
-          if (a === "Team: None") return 1
-          if (b === "Team: None") return -1
-          return a.localeCompare(b)
+        .catch((error) => {
+          console.error("Error fetching case types:", error)
+          this.error = "Failed to load case types"
         })
-        keys.forEach((category) => {
-          this.items.push({ category: category })
-          for (let item of new_items[category]) {
-            this.items.push(item)
-          }
+        .finally(() => {
+          this.loading = false
         })
-
-        this.total = response.data.total
-        this.loading = false
-
-        if (this.items.length < this.total) {
-          this.more = true
-        } else {
-          this.more = false
-        }
-
-        // Set the selected case type if it exists in the fetched items
-        if (this.modelValue && this.modelValue.id) {
-          const selectedItem = this.items.find((item) => item.id === this.modelValue.id)
-          if (selectedItem) {
-            this.selectedCaseType = selectedItem
-          }
-        }
-      })
+    },
+    resetSelection() {
+      this.$emit("update:modelValue", null)
     },
   },
 
   watch: {
-    search(val) {
-      val && val !== this.select && this.fetchData()
-    },
-    modelValue: {
-      handler(newValue) {
-        if (newValue && newValue.id) {
-          const selectedItem = this.items.find((item) => item.id === newValue.id)
-          if (selectedItem) {
-            this.selectedCaseType = selectedItem
-          }
-        } else {
-          this.selectedCaseType = null
+    project: {
+      handler(newProject) {
+        if (newProject?.id !== this.lastProjectId) {
+          this.lastProjectId = newProject?.id
+          this.resetSelection()
+          this.fetchData()
         }
+        this.validateType()
       },
-      immediate: true,
-    },
-    case_type(newCaseType) {
-      if (newCaseType) {
-        this.conversation_target = newCaseType.conversation_target
-      } else {
-        this.conversation_target = null
-      }
+      deep: true,
     },
   },
 
   created() {
     this.fetchData()
-    this.$watch(
-      (vm) => [vm.project],
-      () => {
-        this.fetchData()
-        this.validateType()
-        this.$emit("update:modelValue", this.case_type)
-      }
-    )
   },
 }
 </script>
diff --git a/src/dispatch/static/dispatch/src/incident/priority/IncidentPrioritySelect.vue b/src/dispatch/static/dispatch/src/incident/priority/IncidentPrioritySelect.vue
index d9de9659d804..08ab2d6e0270 100644
--- a/src/dispatch/static/dispatch/src/incident/priority/IncidentPrioritySelect.vue
+++ b/src/dispatch/static/dispatch/src/incident/priority/IncidentPrioritySelect.vue
@@ -39,6 +39,7 @@ export default {
       loading: false,
       items: [],
       error: null,
+      lastProjectId: null,
       is_priority_in_project: () => {
         this.validatePriority()
         return this.error
@@ -123,12 +124,19 @@ export default {
         this.loading = false
       })
     },
+    resetSelection() {
+      this.$emit("update:modelValue", null)
+    },
   },
 
   watch: {
     project: {
-      handler() {
-        this.fetchData()
+      handler(newProject) {
+        if (newProject?.id !== this.lastProjectId) {
+          this.lastProjectId = newProject?.id
+          this.resetSelection()
+          this.fetchData()
+        }
         this.validatePriority()
       },
       deep: true,
diff --git a/src/dispatch/static/dispatch/src/incident/type/IncidentTypeSelect.vue b/src/dispatch/static/dispatch/src/incident/type/IncidentTypeSelect.vue
index 4f936fd174a5..e7e8c62c3d51 100644
--- a/src/dispatch/static/dispatch/src/incident/type/IncidentTypeSelect.vue
+++ b/src/dispatch/static/dispatch/src/incident/type/IncidentTypeSelect.vue
@@ -7,7 +7,7 @@
     :label="label"
     return-object
     :loading="loading"
-    :rules="[is_type_in_project]"
+    :rules="[validationRule]"
   >
     <template #item="{ props, item }">
       <v-list-item v-bind="props" :title="null">
@@ -23,15 +23,15 @@
       </v-list-item>
     </template>
     <template #append-item>
-      <v-list-item v-if="more" @click="loadMore()">
-        <v-list-item-subtitle> Load More </v-list-item-subtitle>
+      <v-list-item v-if="more" @click="loadMore">
+        <v-list-item-subtitle>Load More</v-list-item-subtitle>
       </v-list-item>
     </template>
   </v-select>
 </template>
 
 <script>
-import { cloneDeep } from "lodash"
+import { debounce } from "lodash"
 import SearchUtils from "@/search/utils"
 import IncidentTypeApi from "@/incident/type/api"
 
@@ -59,51 +59,51 @@ export default {
       items: [],
       more: false,
       numItems: 5,
-      error: null,
-      selectedIncidentType: null,
-      is_type_in_project: () => {
-        this.validateType()
-        return this.error
-      },
+      total: 0,
+      lastProjectId: null,
     }
   },
 
-  watch: {
-    modelValue: {
-      immediate: true,
-      handler(newValue) {
-        this.selectedIncidentType = cloneDeep(newValue)
+  computed: {
+    selectedIncidentType: {
+      get() {
+        return this.modelValue || null
+      },
+      set(value) {
+        this.$emit("update:modelValue", value)
       },
     },
-    selectedIncidentType(newValue) {
-      this.$emit("update:modelValue", newValue)
-      this.validateType()
+    isTypeValid() {
+      const project_id = this.project?.id || 0
+      return this.selectedIncidentType?.project?.id == project_id
     },
+    validationRule() {
+      return this.isTypeValid || "Only types in selected project are allowed"
+    },
+  },
+
+  watch: {
     project: {
-      handler() {
-        this.fetchData()
-        this.validateType()
+      handler(newProject) {
+        if (newProject?.id !== this.lastProjectId) {
+          this.lastProjectId = newProject?.id
+          this.clearSelection()
+          this.fetchData()
+        }
       },
     },
   },
 
   methods: {
+    clearSelection() {
+      this.selectedIncidentType = null
+    },
     loadMore() {
-      this.numItems = this.numItems + 5
+      this.numItems += 5
       this.fetchData()
     },
-    validateType() {
-      const project_id = this.project?.id || 0
-      const in_project = this.selectedIncidentType?.project?.id == project_id
-      if (in_project) {
-        this.error = true
-      } else {
-        this.error = "Only types in selected project are allowed"
-      }
-    },
-    fetchData() {
-      this.error = null
-      this.loading = "error"
+    fetchData: debounce(function () {
+      this.loading = true
 
       let filterOptions = {
         sortBy: ["name"],
@@ -112,30 +112,27 @@ export default {
       }
 
       if (this.project) {
-        filterOptions = {
-          ...filterOptions,
-          filters: {
-            project: [this.project],
-            enabled: ["true"],
-          },
+        filterOptions.filters = {
+          project: [this.project],
+          enabled: ["true"],
         }
       }
 
-      filterOptions = SearchUtils.createParametersFromTableOptions({ ...filterOptions })
+      filterOptions = SearchUtils.createParametersFromTableOptions(filterOptions)
 
-      IncidentTypeApi.getAll(filterOptions).then((response) => {
-        this.items = response.data.items
-
-        this.total = response.data.total
-        this.loading = false
-
-        if (this.items.length < this.total) {
-          this.more = true
-        } else {
-          this.more = false
-        }
-      })
-    },
+      IncidentTypeApi.getAll(filterOptions)
+        .then((response) => {
+          this.items = response.data.items
+          this.total = response.data.total
+          this.more = this.items.length < this.total
+        })
+        .catch((error) => {
+          console.error("Error fetching incident types:", error)
+        })
+        .finally(() => {
+          this.loading = false
+        })
+    }, 300),
   },
 
   created() {