display info message if offline

src/views/Project/FeaturesListAndMap.vue

@@ -180,6 +180,17 @@ export default {
     },
   },
 
+
+  watch: {
+    isOnline(newValue, oldValue) {
+      if (newValue != oldValue && !newValue) {
+        this.DISPLAY_MESSAGE({
+          comment: 'Les signalements du projet non mis en cache ne sont pas accessibles en mode déconnecté',
+        });
+      }
+    },
+  },
+
   mounted() {
     if (!this.project) {
       // Chargements des features et infos projet en cas d'arrivée directe sur la page ou de refresh
@@ -199,6 +210,9 @@ export default {
   },
 
   methods: {
+    ...mapMutations([
+      'DISPLAY_MESSAGE',
+    ]),
     ...mapActions('feature', [
       'DELETE_FEATURE',
     ]),
@@ -246,7 +260,7 @@ export default {
               this.UPDATE_CHECKED_FEATURES(newCheckedFeatures);
               this.modifyStatus(newStatus);
             } else {
-              this.$store.commit('DISPLAY_MESSAGE', {
+              this.DISPLAY_MESSAGE({
                 comment: `Le signalement ${feature.title} n'a pas pu être modifié`,
                 level: 'negative'
               });
@@ -256,7 +270,7 @@ export default {
         }
       } else {
         this.fetchPagedFeatures();
-        this.$store.commit('DISPLAY_MESSAGE', {
+        this.DISPLAY_MESSAGE({
           comment: 'Tous les signalements ont été modifié avec succès.',
           level: 'positive'
         });
@@ -387,7 +401,12 @@ export default {
     },
 
     fetchPagedFeatures(newUrl) {
-      if (!this.isOnline) return;
+      if (!navigator.onLine) {
+        this.DISPLAY_MESSAGE({
+          comment: 'Les signalements du projet non mis en cache ne sont pas accessibles en mode déconnecté',
+        });
+        return;
+      }
       let url = `${this.API_BASE_URL}projects/${this.projectSlug}/feature-paginated/?limit=${this.pagination.pagesize}&offset=${this.pagination.start}`;
       //* if receiving next & previous url (// todo : might be not used anymore, to check)
       if (newUrl && typeof newUrl === 'string') {