ask user confirmation to leave filtered features detail view & display return button after edition

src/components/Feature/Detail/FeatureHeader.vue

@@ -4,6 +4,20 @@
       <div class="content">
         {{ currentFeature.title || currentFeature.feature_id }}
         <div class="ui icon right floated compact buttons">
+          <router-link
+            v-if="displayToListButton"
+            id="feature-detail-to-features-list"
+            :to="{
+              name: 'liste-signalements',
+              params: { slug: $route.params.slug },
+            }"
+            custom
+          >
+            <div class="ui button tiny-margin teal">
+              <i class="ui icon arrow right" />
+              Retour à la liste des signalements
+            </div>
+          </router-link>
           <span
             v-if="featuresCount"
             id="feature-count"
@@ -129,6 +143,10 @@ export default {
       type: Object,
       default: () => {},
     },
+    displayToListButton: {
+      type: Boolean,
+      default: false,
+    },
   },
 
   computed: {
@@ -185,4 +203,8 @@ export default {
 #next-feature {
   margin-right: .5rem !important;
 }
+#feature-detail-to-features-list {
+  line-height: 0;
+  margin-right: 5px;
+}
 </style>
\ No newline at end of file

src/store/modules/feature.store.js

@@ -193,7 +193,6 @@ const feature = {
                 slug_signal: featureId,
                 message: routeName === 'editer-signalement' ? 'Le signalement a été mis à jour' : 'Le signalement a été crée'
               },
-              query: router.history.current.query,
             });
             dispatch('projects/GET_ALL_PROJECTS', null, { root:true }); //* & refresh project list
           });

src/views/Feature/FeatureDetail.vue

@@ -10,6 +10,7 @@
             :features-count="featuresCount"
             :slug-signal="slugSignal"
             :feature-type="featureType"
+            :display-to-list-button="displayToListButton"
             @setIsCancelling="isCanceling = true"
             @tofeature="pushNgo"
           />
@@ -118,6 +119,30 @@ export default {
     FeatureComments
   },
 
+  beforeRouteEnter (to, from, next) {
+    // if the user edited the feature, coming from filtered features details browsing,
+    // display a button to turn back to the list view, in order to start again from the list
+    // because order changes after edition, depending the sort criteria
+    // in beforeRouteEnter, the component is not mounted and this doesn't exist yet, thus we store the value in window object
+    window.displayToListButton = false; // reinitialisation of the value
+    if (from.query.offset !== undefined) { // if a queryset for filtered features is stored in the route from
+      window.displayToListButton = true; // toggle the value to display the button
+    }
+    next(); // continue page loading
+  },
+
+  beforeRouteLeave (to, from, next) {
+    if (// In case of filtered listed featuers, if the user wants to edit a feature,
+      from.query.offset >= 0 &&
+        to.name === 'editer-signalement' &&
+        !this.confirmLeave() // warn the user that features order might change
+    ){
+      next(false);
+    } else {// Navigate to next view
+      next();
+    }
+  },
+
   data() {
     return {
       attachments: [],
@@ -139,6 +164,7 @@ export default {
       featuresCount: null,
       isCanceling: false,
       slugSignal: '',
+      displayToListButton: false,
     };
   },
 
@@ -170,6 +196,8 @@ export default {
 
   mounted() {
     this.initPage();
+    // when this is available, set the value with previously stored value in windows to pass it as a prop
+    this.displayToListButton = window.displayToListButton;
   },
 
   beforeDestroy() {
@@ -232,6 +260,10 @@ export default {
       this.DISCARD_LOADER();
     },
 
+    confirmLeave() {
+      return window.confirm('Vous allez quittez la vue signalement filtré, l\'ordre des signalements pourrait changer après édition d\'un signalement.');
+    },
+
     async pushNgo(newEntry) {
       this.$router.push(newEntry); //* update the params or queries in the route/url
       await this.getPageInfo();

src/views/Project/ProjectDetail.vue

@@ -75,17 +75,21 @@
               ref="map"
             />
 
-            <div
+            <router-link
               id="features-list"
-              class="ui button fluid teal"
-              @click="$router.push({
+              :to="{
                 name: 'liste-signalements',
                 params: { slug: slug },
-              })"
+              }"
+              custom
             >
-              <i class="ui icon arrow right" />
-              Voir tous les signalements
-            </div>
+              <div
+                class="ui button fluid teal"
+              >
+                <i class="ui icon arrow right" />
+                Voir tous les signalements
+              </div>
+            </router-link>
 
             <div 
               id="popup"