From f3260f57a4cdee8421ddc814e703ddc18fe526ca Mon Sep 17 00:00:00 2001
From: Mathieu Jaumotte <mathieu.jaumotte@champs-libres.coop>
Date: Thu, 6 May 2021 19:16:07 +0200
Subject: [PATCH] fix display elements order

selectAndSuggested method in store getter, is callable in all components,
and make union of two arrays: suggested and selected

* we need to have selected in last position (required for isChecked method to work well)
* but we want to display selected in first position (for better ux)

then, we use double inversion to obtain good behaviour
---
 .../Resources/public/vuejs/AccompanyingCourse/store/index.js  | 4 ++--
 .../Resources/public/vuejs/_components/AddPersons.vue         | 2 +-
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/store/index.js b/src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/store/index.js
index 2247e078d..4add9bf43 100644
--- a/src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/store/index.js
+++ b/src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/store/index.js
@@ -29,8 +29,8 @@ let getDataPromise = getAccompanyingCourse(id)
                      ).values()
                ];
                let union = [...new Set([
-                  ...state.add_persons.selected, 
-                  ...state.add_persons.suggested,
+                  ...state.add_persons.suggested.slice().reverse(),
+                  ...state.add_persons.selected.slice().reverse(), 
                ])];
                return uniqBy(union, k => k.id);
             }
diff --git a/src/Bundle/ChillPersonBundle/Resources/public/vuejs/_components/AddPersons.vue b/src/Bundle/ChillPersonBundle/Resources/public/vuejs/_components/AddPersons.vue
index efb5ce832..3f4be3297 100644
--- a/src/Bundle/ChillPersonBundle/Resources/public/vuejs/_components/AddPersons.vue
+++ b/src/Bundle/ChillPersonBundle/Resources/public/vuejs/_components/AddPersons.vue
@@ -40,7 +40,7 @@
                   </span>
                </div>
                <person-suggestion 
-                  v-for="item in this.selectedAndSuggested"
+                  v-for="item in this.selectedAndSuggested.slice().reverse()"
                   v-bind:item="item" 
                   v-bind:key="item.id">
                </person-suggestion>