Improve performance of share indicators

changelog/unreleased/enhancement-share-indicators-performance

@@ -0,0 +1,6 @@
+Enhancement: Improve performance of share indicators
+
+We've improved the performance of share indicators when loading resource tables as well as when adding or removing shares.
+
+https://github.com/owncloud/web/issues/7038
+https://github.com/owncloud/web/pull/7188

packages/web-app-files/src/services/folder/legacy/loaderPersonal.ts

@@ -39,20 +39,17 @@ export class FolderLoaderLegacyPersonal implements FolderLoader {
         resources = resources.map(buildResource)
 
         const currentFolder = resources.shift()
+        yield store.dispatch('Files/loadSharesTree', {
+          client,
+          path: currentFolder.path
+        })
 
         store.commit('Files/LOAD_FILES', {
           currentFolder,
-          files: resources
+          files: resources,
+          loadIndicators: true
         })
 
-        // load indicators
-        ;(() => {
-          store.dispatch('Files/loadIndicators', {
-            client: client,
-            currentFolder: currentFolder.path
-          })
-        })()
-
         // fetch user quota
         ;(async () => {
           const user = await client.users.getUser(router.currentRoute.params.storageId)

packages/web-app-files/src/services/folder/spaces/loaderPersonal.ts

@@ -36,19 +36,17 @@ export class FolderLoaderSpacesPersonal implements FolderLoader {
 
         const currentFolder = resources.shift()
 
+        yield store.dispatch('Files/loadSharesTree', {
+          client: clientService.owncloudSdk,
+          path: currentFolder.path
+        })
+
         store.commit('Files/LOAD_FILES', {
           currentFolder,
-          files: resources
+          files: resources,
+          loadIndicators: true
         })
 
-        // load indicators
-        ;(() => {
-          store.dispatch('Files/loadIndicators', {
-            client: clientService.owncloudSdk,
-            currentFolder: currentFolder.path
-          })
-        })()
-
         // fetch user quota
         ;(async () => {
           const user = await clientService.owncloudSdk.users.getUser(ref.user.id)

packages/web-app-files/src/services/folder/spaces/loaderProject.ts

@@ -65,16 +65,17 @@ export class FolderLoaderSpacesProject implements FolderLoader {
       }
 
       const currentFolder = resources.shift()
+      yield store.dispatch('Files/loadSharesTree', {
+        client: clientService.owncloudSdk,
+        path: currentFolder.path
+      })
 
       ref.LOAD_FILES({
         currentFolder,
-        files: resources
-      })
-      ref.loadIndicators({
-        client: ref.$client,
-        currentFolder: currentFolder?.path,
-        storageId: space.id
+        files: resources,
+        loadIndicators: true
       })
+
       ref.UPSERT_SPACE(space)
 
       if (!sameRoute) {

packages/web-app-files/src/store/actions.js

@@ -730,7 +730,7 @@ export default {
     // TODO: when we refactor the shares tree we want to modify shares tree nodes incrementally during adding and removing shares, not loading everything new from the backend.
     commit('SHARESTREE_PRUNE_OUTSIDE_PATH', dirname(currentFolder))
     await dispatch('loadSharesTree', { client, path: currentFolder, storageId })
-    commit('LOAD_INDICATORS')
+    commit('LOAD_INDICATORS', currentFolder)
   },
 
   loadAvatars({ commit, rootGetters }, { resource }) {

packages/web-app-files/src/store/mutations.js

@@ -53,8 +53,15 @@ export default {
   CLEAR_SPACES(state) {
     state.spaces = []
   },
-  LOAD_FILES(state, { currentFolder, files }) {
+  LOAD_FILES(state, { currentFolder, files, loadIndicators = false }) {
     state.currentFolder = currentFolder
+
+    if (loadIndicators) {
+      for (const file of files) {
+        file.indicators = getIndicators(file, state.sharesTree)
+      }
+    }
+
     state.files = files
   },
   SET_CURRENT_FOLDER(state, currentFolder) {
@@ -238,8 +245,9 @@ export default {
     state.versions = versions
   },
 
-  LOAD_INDICATORS(state) {
-    for (const resource of state.files) {
+  LOAD_INDICATORS(state, path) {
+    const files = state.files.filter((f) => f.path.startsWith(path))
+    for (const resource of files) {
       const indicators = getIndicators(resource, state.sharesTree)
 
       if (!indicators.length && !resource.indicators.length) {

packages/web-app-files/tests/unit/views/spaces/Project.spec.js

@@ -144,7 +144,7 @@ describe('Spaces project view', () => {
         })
       })
 
-      const wrapper = getMountedWrapper([], { id: 1 })
+      const wrapper = getMountedWrapper([Files['/'][0]], { id: 1 })
       await wrapper.vm.loadResourcesTask.last
 
       expect(wrapper.find(selectors.spaceImage).exists()).toBeFalsy()
@@ -285,7 +285,8 @@ function getMountedWrapper(spaceResources = [], spaceItem = null, imageContent =
           },
           actions: {
             loadIndicators: jest.fn(),
-            loadCurrentFileOutgoingShares: jest.fn()
+            loadCurrentFileOutgoingShares: jest.fn(),
+            loadSharesTree: jest.fn()
           },
           getters: {
             activeFiles: () => spaceResources,