From 0c914c9f9f076f7f9a6306f3ac66095eca01a296 Mon Sep 17 00:00:00 2001
From: Boris Waaub <boriswaaub@Mac-Studio-de-Boris.local>
Date: Tue, 21 May 2024 17:32:40 +0200
Subject: [PATCH] Remove "remove_addressee" history line

---
 .../components/ActionToolbarComponent.vue     |   4 +-
 .../components/AddCommentComponent.vue        |   2 +-
 .../components/AddresseeSelectorComponent.vue | 168 ++++++++++--------
 .../TicketHistoryAddresseeComponent.vue       |   6 +-
 .../components/TicketHistoryListComponent.vue |   5 +-
 .../vuejs/TicketApp/store/modules/ticket.ts   |  46 +++--
 6 files changed, 128 insertions(+), 103 deletions(-)

diff --git a/src/Bundle/ChillTicketBundle/src/Resources/public/vuejs/TicketApp/components/ActionToolbarComponent.vue b/src/Bundle/ChillTicketBundle/src/Resources/public/vuejs/TicketApp/components/ActionToolbarComponent.vue
index d1f103b66..c9c228dc9 100644
--- a/src/Bundle/ChillTicketBundle/src/Resources/public/vuejs/TicketApp/components/ActionToolbarComponent.vue
+++ b/src/Bundle/ChillTicketBundle/src/Resources/public/vuejs/TicketApp/components/ActionToolbarComponent.vue
@@ -148,7 +148,9 @@ export default defineComponent({
                 : ({} as Motive)
         );
         const content = ref("" as Comment["content"]);
-        const addressees = ref([] as Array<UserGroupOrUser>);
+        const addressees = ref(
+            ticket.value.currentAddressees as Array<UserGroupOrUser>
+        );
 
         async function submitAction() {
             try {
diff --git a/src/Bundle/ChillTicketBundle/src/Resources/public/vuejs/TicketApp/components/AddCommentComponent.vue b/src/Bundle/ChillTicketBundle/src/Resources/public/vuejs/TicketApp/components/AddCommentComponent.vue
index e98e2771a..4099ff41f 100644
--- a/src/Bundle/ChillTicketBundle/src/Resources/public/vuejs/TicketApp/components/AddCommentComponent.vue
+++ b/src/Bundle/ChillTicketBundle/src/Resources/public/vuejs/TicketApp/components/AddCommentComponent.vue
@@ -13,7 +13,7 @@
 </template>
 
 <script lang="ts">
-import { PropType, defineComponent, ref, watch } from "vue";
+import { defineComponent, ref, watch } from "vue";
 
 import CKEditor from "@ckeditor/ckeditor5-vue";
 import ClassicEditor from "../../../../../../../ChillMainBundle/Resources/public/module/ckeditor5";
diff --git a/src/Bundle/ChillTicketBundle/src/Resources/public/vuejs/TicketApp/components/AddresseeSelectorComponent.vue b/src/Bundle/ChillTicketBundle/src/Resources/public/vuejs/TicketApp/components/AddresseeSelectorComponent.vue
index 36e6d64a6..56388e41a 100644
--- a/src/Bundle/ChillTicketBundle/src/Resources/public/vuejs/TicketApp/components/AddresseeSelectorComponent.vue
+++ b/src/Bundle/ChillTicketBundle/src/Resources/public/vuejs/TicketApp/components/AddresseeSelectorComponent.vue
@@ -1,73 +1,68 @@
 <template>
     <div class="row">
-        <div class="col-12 col-lg-6 col-md-6 mb-2 text-center">
-            <span class="m-1">
-                <input
-                    type="radio"
-                    class="btn-check"
-                    name="options-outlined"
-                    id="level-none"
-                    autocomplete="off"
-                    :value="{}"
-                    v-model="userGroupLevel"
-                />
-                <label :class="`btn btn-outline-primary`" for="level-none">
-                    Aucun
-                </label>
-            </span>
-            <span
-                v-for="userGroupItem in userGroups.filter(
-                    (userGroup) => userGroup.excludeKey == 'level'
-                )"
-                :key="userGroupItem.id"
-                class="m-1"
-            >
-                <input
-                    type="radio"
-                    class="btn-check"
-                    name="options-outlined"
-                    :id="`level-${userGroupItem.id}`"
-                    autocomplete="off"
-                    :value="userGroupItem"
-                    v-model="userGroupLevel"
-                />
-                <label
-                    :class="`btn btn-${userGroupItem.id}`"
-                    :for="`level-${userGroupItem.id}`"
-                    :style="getUserGroupBtnColor(userGroupItem)"
+        <div class="col-12 col-lg-6 col-md-6 text-center">
+            <div class="mb-2">
+                <span
+                    v-for="userGroupItem in userGroups.filter(
+                        (userGroup) => userGroup.excludeKey == 'level'
+                    )"
+                    :key="userGroupItem.id"
+                    class="m-1"
                 >
-                    {{ userGroupItem.label.fr }}
-                </label>
-            </span>
-        </div>
-        <div class="col-12 col-lg-6 col-md-6 mb-2 text-center">
-            <span
-                v-for="userGroupItem in userGroups.filter(
-                    (userGroup) => userGroup.excludeKey == ''
-                )"
-                :key="userGroupItem.id"
-                class="m-1"
-            >
-                <input
-                    type="checkbox"
-                    class="btn-check"
-                    name="options-outlined"
-                    :id="`user-group-${userGroupItem.id}`"
-                    autocomplete="off"
-                    :value="userGroupItem"
-                    v-model="userGroup"
-                />
-                <label
-                    :class="`btn btn-${userGroupItem.id}`"
-                    :for="`user-group-${userGroupItem.id}`"
-                    :style="getUserGroupBtnColor(userGroupItem)"
+                    <input
+                        type="radio"
+                        class="btn-check"
+                        name="options-outlined"
+                        :id="`level-${userGroupItem.id}`"
+                        autocomplete="off"
+                        :value="userGroupItem"
+                        v-model="userGroupLevel"
+                        @click="
+                            Object.values(userGroupLevel).includes(
+                                userGroupItem.id
+                            )
+                                ? (userGroupLevel = {})
+                                : (userGroupLevel = userGroupItem)
+                        "
+                    />
+                    <label
+                        :class="`btn btn-${userGroupItem.id}`"
+                        :for="`level-${userGroupItem.id}`"
+                        :style="getUserGroupBtnColor(userGroupItem)"
+                    >
+                        {{ userGroupItem.label.fr }}
+                    </label>
+                </span>
+            </div>
+            <div class="mb-2">
+                <span
+                    v-for="userGroupItem in userGroups.filter(
+                        (userGroup) => userGroup.excludeKey == ''
+                    )"
+                    :key="userGroupItem.id"
+                    class="m-1"
                 >
-                    {{ userGroupItem.label.fr }}
-                </label>
-            </span>
+                    <input
+                        type="checkbox"
+                        class="btn-check"
+                        name="options-outlined"
+                        :id="`user-group-${userGroupItem.id}`"
+                        autocomplete="off"
+                        :value="userGroupItem"
+                        v-model="userGroup"
+                    />
+                    <label
+                        :class="`btn btn-${userGroupItem.id}`"
+                        :for="`user-group-${userGroupItem.id}`"
+                        :style="getUserGroupBtnColor(userGroupItem)"
+                    >
+                        {{ userGroupItem.label.fr }}
+                    </label>
+                </span>
+            </div>
         </div>
 
-        <div class="col-12 col-lg-6 col-md-6 mb-2 text-center">
+        <div class="col-12 col-lg-6 col-md-6 mb-2 mb-2 text-center">
             <add-persons
                 :options="addPersonsOptions"
                 key="add-person-ticket"
@@ -76,11 +71,11 @@
                 ref="addPersons"
                 @addNewPersons="addNewEntity"
             />
-        </div>
-        <div class="col-12 col-lg-6 col-md-6 mb-2 mb-2 text-center">
-            <span class="badge text-bg-light m-1" v-for="user in users">
-                {{ user.username }}
-            </span>
+            <div class="mb-2">
+                <span class="badge text-bg-light m-1" v-for="user in users">
+                    {{ user.username }}
+                </span>
+            </div>
         </div>
     </div>
 </template>
@@ -122,12 +117,26 @@ export default defineComponent({
     emits: ["update:modelValue"],
 
     setup(props, ctx) {
-        // Cant use UserGroupOrUser[] because of TS2367
-        // TS2367: This comparison appears to be unintentional because the types '"user" | "chill_main_user_group"' and '"user_group"' have no overlap.
-        const addressees = ref(props.modelValue as any[]);
-        const userGroupLevel = ref({} as UserGroupOrUser);
-        const userGroup = ref([] as UserGroupOrUser[]);
-        const users = ref([] as User[]);
+        const addressees = ref(props.modelValue as UserGroupOrUser[]);
+        const userGroups = props.modelValue.filter(
+            (addressee) => addressee.type == "user_group"
+        ) as UserGroup[];
+
+        const userGroupLevel = ref(
+            userGroups.filter(
+                (userGroup) => userGroup.excludeKey == "level"
+            )[0] as UserGroup | {}
+        );
+        const userGroup = ref(
+            userGroups.filter((userGroup) => userGroup.excludeKey == "") as
+                | UserGroup[]
+                | []
+        );
+        const users = ref(
+            props.modelValue.filter((addressee) => addressee.type == "user") as
+                | User[]
+                | []
+        );
         const addPersons = ref();
 
         const { t } = useI18n();
@@ -167,16 +176,19 @@ export default defineComponent({
         watch(userGroupLevel, (userGroupLevelAdd, userGroupLevelRem) => {
             if (userGroupLevelRem) {
                 addressees.value.splice(
-                    addressees.value.indexOf(userGroupLevelRem),
+                    addressees.value.indexOf(userGroupLevelRem as UserGroup),
                     1
                 );
             }
-            addressees.value.push(userGroupLevelAdd);
+            addressees.value.push(userGroupLevelAdd as UserGroup);
             ctx.emit("update:modelValue", addressees.value);
         });
 
         watch(userGroup, (userGroupAdd) => {
-            addressees.value = addressees.value.filter(
+            const userGroups = addressees.value.filter(
+                (addressee) => addressee.type === "user_group"
+            ) as UserGroup[];
+            addressees.value = userGroups.filter(
                 (addressee) => addressee.excludeKey !== ""
             );
             addressees.value = [...addressees.value, ...userGroupAdd];
diff --git a/src/Bundle/ChillTicketBundle/src/Resources/public/vuejs/TicketApp/components/TicketHistoryAddresseeComponent.vue b/src/Bundle/ChillTicketBundle/src/Resources/public/vuejs/TicketApp/components/TicketHistoryAddresseeComponent.vue
index 234dfb26f..21de182dd 100644
--- a/src/Bundle/ChillTicketBundle/src/Resources/public/vuejs/TicketApp/components/TicketHistoryAddresseeComponent.vue
+++ b/src/Bundle/ChillTicketBundle/src/Resources/public/vuejs/TicketApp/components/TicketHistoryAddresseeComponent.vue
@@ -1,7 +1,7 @@
 <template>
-    <div class="col-12" >
-        <i class="fa fa-paper-plane" v-if="event_type === 'add_addressee'"></i>
-        <i class="fa fa-paper-plane-o" v-else></i>
+    <div class="col-12">
+        <i class="fa fa-paper-plane"></i>
+
         <span class="mx-1" v-if="addressee.type == 'user_group'">
             {{
                 $t(`history.${event_type}_user_group`, {
diff --git a/src/Bundle/ChillTicketBundle/src/Resources/public/vuejs/TicketApp/components/TicketHistoryListComponent.vue b/src/Bundle/ChillTicketBundle/src/Resources/public/vuejs/TicketApp/components/TicketHistoryListComponent.vue
index 8c301178f..fb10f8cb2 100644
--- a/src/Bundle/ChillTicketBundle/src/Resources/public/vuejs/TicketApp/components/TicketHistoryListComponent.vue
+++ b/src/Bundle/ChillTicketBundle/src/Resources/public/vuejs/TicketApp/components/TicketHistoryListComponent.vue
@@ -42,7 +42,10 @@
                 v-for="addressee in history_line"
                 :key="history_line.indexOf(addressee)"
             >
-                <ticket-history-addressee-component :addresseeHistory="addressee.data" :event_type="addressee.event_type"/>
+                <ticket-history-addressee-component
+                    :addresseeHistory="addressee.data"
+                    :event_type="addressee.event_type"
+                />
             </div>
         </template>
     </div>
diff --git a/src/Bundle/ChillTicketBundle/src/Resources/public/vuejs/TicketApp/store/modules/ticket.ts b/src/Bundle/ChillTicketBundle/src/Resources/public/vuejs/TicketApp/store/modules/ticket.ts
index f3db197c2..d44f7401a 100644
--- a/src/Bundle/ChillTicketBundle/src/Resources/public/vuejs/TicketApp/store/modules/ticket.ts
+++ b/src/Bundle/ChillTicketBundle/src/Resources/public/vuejs/TicketApp/store/modules/ticket.ts
@@ -7,37 +7,45 @@ export interface State {
     ticket: Ticket;
 }
 
-export const moduleTicket: Module<State, RootState> ={
+export const moduleTicket: Module<State, RootState> = {
     state: () => ({
         ticket: {} as Ticket,
     }),
     getters: {
         getTicket(state) {
             return state.ticket;
-          },
+        },
         getDistinctAddressesHistory(state) {
-            const addresseeHistory = state.ticket.history.reduce((result, item) => {
-                const { datetime } = item.at;
-                if (!["add_addressee","remove_addressee"].includes(item.event_type)) {
-                    result[datetime] = item
+            const addresseeHistory = state.ticket.history.reduce(
+                (result, item) => {
+                    const { datetime } = item.at;
+                    if (
+                        !["add_addressee", "remove_addressee"].includes(
+                            item.event_type
+                        )
+                    ) {
+                        result[datetime] = item;
+                        return result;
+                    }
+
+                    if (!result[datetime]) {
+                        result[datetime] = [];
+                    }
+
+                    if (item.event_type === "add_addressee") {
+                        result[datetime].push(item);
+                    }
                     return result;
-                }
-
-                if (!result[datetime]) {
-                    result[datetime] = [];
-                }
-                result[datetime].push(item);
-                return result;
-            }, {} as any);
+                },
+                {} as any
+            );
             return Object.values(addresseeHistory) as Array<Ticket["history"]>;
-        }
-
+        },
     },
     mutations: {
         setTicket(state, ticket) {
             state.ticket = ticket;
-        }
-    },
-    actions: {
+        },
     },
+    actions: {},
 };