aleph-im · hoh · Jan 31, 2023 · Jan 26, 2023 · Jan 30, 2023 · Jan 30, 2023
diff --git a/src/components/NftSnapshot.vue b/src/components/NftSnapshot.vue
@@ -220,12 +220,8 @@ export default {
       }
       return 0
     },
-    total_used () {
-      let value = 0
-      for (let item of this.stored) {
-        value = value + item.content.size
-      }
-      return value / (1024 ** 2)
+    total_used (state) {
+      return state.stored_total / (1024 ** 2)
     },
     to_store_size () {
       let size = 0

diff --git a/src/helpers/utilities.js b/src/helpers/utilities.js
@@ -40,3 +40,26 @@ export function convertTimestamp (timestamp) {
 export function ellipseAddress (address, width = 10) {
   return `${address.slice(0, width)}...${address.slice(-width)}`
 }
+
+/**
+ * Use to copy an element from on array to the other based on a key.
+ * Transforms a O(n^2) into a O(2n) operation
+ *
+ * @param {Array} origin An array to copy value from
+ * @param {Function} originAccessor A function that retrieves a key in `origin`
+ * @param {Array} destination The copy destination
+ * @param {Function} destinationAccessor A function that retrieves a key in `replaceTo`
+ * @param {Function} joinCallback A function that takes a value with the same key from `origin` and `destination` and outputs an object
+ */
+export function joinArrays (origin, originAccessor, destination, destinationAccessor, joinCallback) {
+  const hashMap = new Map()
+  for (const item of origin) {
+    const hashMapKey = originAccessor(item)
+    hashMap.set(hashMapKey, item)
+  }
+
+  return destination.map((x, i) => {
+    const hashMapKey = destinationAccessor(x)
+    return joinCallback(hashMap.get(hashMapKey), x, hashMapKey, i)
+  })
+}
diff --git a/src/layouts/MainLayout.vue b/src/layouts/MainLayout.vue
@@ -201,11 +201,7 @@ export default {
       return 0
     },
     total_used (state) {
-      let value = 0
-      for (let item of state.stored) {
-        value = value + item.content?.size
-      }
-      return value / (1024 ** 2)
+      return state.stored_total / (1024 ** 2)
     }
   }),
   watch: {

diff --git a/src/pages/IPFSPin.vue b/src/pages/IPFSPin.vue
@@ -180,16 +180,13 @@ export default {
       return 0
     },
     total_used (state) {
-      let value = 0
-      for (let item of state.stored) {
-        value = value + item.content.size
-      }
-      return value / (1024 ** 2)
+      return state.stored_total / (1024 ** 2)
     },
     displayed_stores (state) {
       let ipfs_stores = this.stored.filter(
         item => item.content?.item_type === 'ipfs'
       )
+
       if (this.tab === 'active') {
         return ipfs_stores.filter(
           item => (

diff --git a/src/pages/NFTStorage.vue b/src/pages/NFTStorage.vue
@@ -103,11 +103,7 @@ export default {
       return 0
     },
     total_used (state) {
-      let value = 0
-      for (let item of state.stored) {
-        value = value + item.content.size
-      }
-      return value / (1024 ** 2)
+      return state.stored_total / (1024 ** 2)
     }
   }),
   components: {

diff --git a/src/store/index.js b/src/store/index.js
@@ -7,6 +7,8 @@ import {
 } from '../services/balances'
 import { decrypt_content } from '../services/encryption.js'
 import { get_erc20_balance } from '../services/erc20.js'
+import axios from 'axios'
+import { joinArrays } from 'src/helpers/utilities'
 
 var providers = require('ethers').providers
 
@@ -45,6 +47,7 @@ export default new Vuex.Store({
     nodes: [],
     resource_nodes: [],
     stored: [],
+    stored_total: 0,
     mb_per_aleph: 3,
     balance_info: {
       ALEPH: 0
@@ -90,8 +93,9 @@ export default new Vuex.Store({
     set_resource_nodes (state, nodes) {
       state.resource_nodes = nodes
     },
-    set_stored (state, stored) {
-      state.stored = stored
+    set_stored (state, { files, total }) {
+      state.stored = files
+      state.stored_total = total
     },
     update_note (state, new_note) {
       for (const note of state.notes) {
@@ -305,16 +309,40 @@ export default new Vuex.Store({
     },
     async update_stored ({ state, commit }) {
       if (state.account !== null) {
-        let items = await messages.get_messages(
-          {
-            message_type: 'STORE',
-            addresses: [state.account.address],
-            pagination: 1000,
-            api_server: state.api_server,
-            channel: 'PINNING'
-          })
+        let total_size
+        let items = await messages.get_messages({
+          message_type: 'STORE',
+          addresses: [state.account.address],
+          pagination: 1000,
+          api_server: state.api_server,
+          channel: 'PINNING'
+        })
+
+        let files = items?.messages || []
+
+        try {
+          // Postgres API
+          const { data } = await axios.get(`${state.api_server}/api/v0/addresses/${state.account.address}/files?pagination=1000`)
+          total_size = data?.total_size
 
-        if (items.messages) { commit('set_stored', items.messages) }
+          const getItemHash = x => x.item_hash
+          const replacementCallback = (from, to) => ({
+            ...to,
+            content: {
+              ...to.content,
+              size: from.size || 0
+            }
+          })
+          files = joinArrays(data.files, getItemHash, files, getItemHash, replacementCallback)
+        } catch (error) {
+          console.log('Files API is not yet implemented on the node')
+        }
+        if (items.messages) {
+          commit('set_stored', {
+            files,
+            total: total_size || items.messages.reduce((ac, cv) => (ac += cv?.content?.size || 0), 0)
+          })
+        }
       }
     }
     // async update_pages({ state, commit }) {