prevent huge data amounts, separate sources

src/store/index.js

@@ -11,17 +11,42 @@ import Vuex from 'vuex';
 Vue.use (Vuex);
 
 export default new Vuex.Store ({
-  state:     { log: [] },
+  state:     { log: {} },
   mutations: {
     set_log (state, log) {
       state.log = log;
     }
   },
+  getters: {
+    log (state) {
+      return (source) => {
+        if (typeof state.log[source] === 'undefined')
+          return [];
+        return state.log[source];
+      };
+    }
+  },
   actions:   {
-    async get_log ({ commit }, { app_id }) {
-      const log = await fetch ('/log', { headers: { app_id } })
-        .then ((res) => res.json ());
-      commit ('set_log', log);
+    async get_log ({ commit }, { app_id, sources }) {
+      const logs = {};
+      for (const source of sources) {
+        // eslint-disable-next-line no-await-in-loop
+        const log = await fetch ('/log', {
+          headers: {
+            app_id,
+            offset: source.offset,
+            limit:  source.limit
+          }
+        })
+          .then ((res) => res.json ())
+          .then ((json) => json.map ((entry) => {
+            entry.data = JSON.parse (entry.data);
+            return entry;
+          }));
+        logs[source.name] = log;
+      }
+
+      commit ('set_log', logs);
     }
   },
   modules: {}