From 78c12212c6f4541221a0cc3270481df070b41983 Mon Sep 17 00:00:00 2001
From: Fabio Manganiello <fabio@manganiello.tech>
Date: Wed, 10 May 2023 02:26:06 +0200
Subject: [PATCH] [#260] A simple entities caching mechanism using the browser
 storage.

---
 .../src/components/panels/Entities/Index.vue  | 38 ++++++++++++++++---
 1 file changed, 33 insertions(+), 5 deletions(-)

diff --git a/platypush/backend/http/webapp/src/components/panels/Entities/Index.vue b/platypush/backend/http/webapp/src/components/panels/Entities/Index.vue
index 73f55b441..738072888 100644
--- a/platypush/backend/http/webapp/src/components/panels/Entities/Index.vue
+++ b/platypush/backend/http/webapp/src/components/panels/Entities/Index.vue
@@ -252,8 +252,9 @@ export default {
       await this.request('entities.scan', args)
     },
 
-    async sync() {
-      this.loading = true
+    async sync(setLoading=true) {
+      if (setLoading)
+        this.loading = true
 
       try {
         this.entities = (await this.request('entities.get')).reduce((obj, entity) => {
@@ -270,8 +271,10 @@ export default {
         }, {})
 
         this.selector.selectedEntities = this.entityGroups.id
+        this.refreshEntitiesCache()
       } finally {
-        this.loading = false
+        if (setLoading)
+          this.loading = false
       }
     },
 
@@ -362,6 +365,23 @@ export default {
         this.modalVisible = false
       }
     },
+
+    loadCachedEntities() {
+      const cachedEntities = localStorage.getItem('entities')
+      if (cachedEntities) {
+        this.entities = JSON.parse(cachedEntities)
+        return true
+      }
+
+      return false
+    },
+
+    refreshEntitiesCache() {
+      if (this.loading)
+        return
+
+      window.localStorage.setItem('entities', JSON.stringify(this.entities))
+    },
   },
 
   async mounted() {
@@ -377,8 +397,16 @@ export default {
       'platypush.message.event.entities.EntityDeleteEvent'
     )
 
-    await this.sync()
-    await this.refresh()
+    if (!this.loadCachedEntities()) {
+      await this.sync()
+      await this.refresh()
+    } else {
+      this.refresh()
+      this.sync(false).then(() => this.refresh())
+    }
+
+    // Refresh the entities cache every 10 seconds
+    setInterval(() => this.refreshEntitiesCache(), 10000)
   },
 
   unmounted() {