Merge branch '1828-1829-fix-bugs-empty-motive-list-and-suggestion-caller' into 'ticket-app-master'

FIX: Frontend: La liste des motifs reste vide et Frontend: l'appelant apparait deux fois dans les suggestions

See merge request Chill-Projet/chill-bundles!917

src/Bundle/ChillTicketBundle/src/Resources/public/vuejs/TicketApp/components/Motive/MotiveSelectorComponent.vue

@@ -60,7 +60,7 @@
 </template>
 
 <script setup lang="ts">
-import { computed, ref, watch } from "vue";
+import { computed, ref } from "vue";
 import VueMultiselect from "vue-multiselect";
 
 // Types
@@ -127,41 +127,31 @@ type MotiveOptions = Motive & {
   breadcrumb: string[];
 };
 
-const motiveOptions: MotiveOptions[] = [];
+const searchQuery = ref<string>("");
-const options = ref<MotiveOptions[]>([]);
 const isLoading = ref<boolean>(false);
 
-function search(query: string) {
+const allMotiveOptions = computed<MotiveOptions[]>(() => {
-  isLoading.value = true;
+  const result: MotiveOptions[] = [];
-  options.value = motiveOptions.filter((m) =>
-    m.breadcrumb.some((crumb) =>
-      crumb.toLowerCase().includes(query.trim().toLowerCase()),
-    ),
-  );
-  isLoading.value = false;
-}
 
-function processMotiveRecursively(
+  const processMotiveRecursively = (
     motive: Motive,
     isChild = false,
     level = 0,
     parentBreadcrumb: string[] = [],
-) {
+  ) => {
     const hasChildren = motive.children && motive.children.length > 0;
     const displayLabel = localizeString(motive.label);
     const breadcrumb = [...parentBreadcrumb, displayLabel];
 
     if (props.allowParentSelection || !hasChildren) {
-    const optionValue = {
+      result.push({
         ...motive,
         isChild,
         isParent: hasChildren,
         level,
         breadcrumb,
         displayLabel,
-    };
+      });
-    motiveOptions.push(optionValue);
-    options.value.push(optionValue);
     }
 
     if (hasChildren) {
@@ -169,23 +159,31 @@ function processMotiveRecursively(
         processMotiveRecursively(childMotive, true, level + 1, breadcrumb);
       });
     }
-}
+  };
 
-function fillOptions() {
+  props.motives.forEach((motive) => {
-  motiveOptions.length = 0;
+    processMotiveRecursively(motive);
-  options.value.length = 0;
-  props.motives.forEach((parentMotive) => {
-    processMotiveRecursively(parentMotive, false, 0, []);
   });
-}
 
-watch(
+  return result;
-  () => props.motives,
+});
-  () => {
+
-    fillOptions();
+const options = computed<MotiveOptions[]>(() => {
-  },
+  if (!searchQuery.value.trim()) {
-  { deep: true },
+    return allMotiveOptions.value;
-);
+  }
+  return allMotiveOptions.value.filter((m) =>
+    m.breadcrumb.some((crumb) =>
+      crumb.toLowerCase().includes(searchQuery.value.trim().toLowerCase()),
+    ),
+  );
+});
+
+function search(query: string) {
+  isLoading.value = true;
+  searchQuery.value = query;
+  isLoading.value = false;
+}
 </script>
 
 <style lang="scss" scoped>

src/Bundle/ChillTicketBundle/src/Resources/public/vuejs/TicketApp/store/modules/persons.ts

@@ -72,7 +72,7 @@ export const modulePersons: Module<State, RootState> = {
           "GET",
           `/api/1.0/ticket/ticket/${ticketId}/suggest-person`,
         );
-        if (caller) {
+        if (caller && !result.some((person) => person.id === caller.id)) {
           result.push(caller);
         }
         commit("setPersons", result);