Merge pull request #10363 from owncloud/remove-file-versions-from-store

refactor: remove file versions from vuex files store module

packages/web-app-files/src/components/SideBar/Details/FileDetails.vue

@@ -124,22 +124,17 @@
 <script lang="ts">
 import { storeToRefs } from 'pinia'
 import { computed, defineComponent, inject, Ref, ref, unref, watch } from 'vue'
-import { mapGetters } from 'vuex'
 import {
   ImageDimension,
   useAuthStore,
   useUserStore,
   useCapabilityStore,
-  useConfigStore
+  useConfigStore,
+  useClientService
 } from '@ownclouders/web-pkg'
 import upperFirst from 'lodash-es/upperFirst'
 import { ShareTypes } from '@ownclouders/web-client/src/helpers/share'
-import {
-  useClientService,
-  useStore,
-  usePreviewService,
-  useGetMatchingSpace
-} from '@ownclouders/web-pkg'
+import { useStore, usePreviewService, useGetMatchingSpace } from '@ownclouders/web-pkg'
 import { getIndicators } from '@ownclouders/web-pkg'
 import {
   formatDateFromHTTP,
@@ -192,17 +187,13 @@ export default defineComponent({
     const authStore = useAuthStore()
     const { publicLinkContextReady } = storeToRefs(authStore)
 
-    const loadData = async () => {
-      const calls = []
-      if (unref(resource).type === 'file' && !unref(publicLinkContextReady)) {
-        calls.push(
-          store.dispatch('Files/loadVersions', {
-            client: clientService.webdav,
-            fileId: unref(resource).id
-          })
-        )
+    const versions = ref<Resource[]>([])
+    const loadVersions = async (fileId: Resource['fileId']) => {
+      try {
+        versions.value = await clientService.webdav.listFileVersions(fileId)
+      } catch (e) {
+        console.error(e)
       }
-      await Promise.all(calls.map((p) => p.catch((e) => e)))
     }
 
     const isPreviewEnabled = computed(() => {
@@ -260,8 +251,11 @@ export default defineComponent({
       resource,
       () => {
         if (unref(resource)) {
-          loadData()
           loadPreviewTask.perform(unref(resource))
+
+          if (!unref(resource).isFolder && !unref(publicLinkContextReady)) {
+            loadVersions(unref(resource).fileId)
+          }
         }
       },
       { immediate: true }
@@ -289,12 +283,11 @@ export default defineComponent({
       sharedAncestorRoute,
       formatDateRelative,
       contextualHelper,
-      showWebDavDetails
+      showWebDavDetails,
+      versions
     }
   },
   computed: {
-    ...mapGetters('Files', ['versions']),
-
     hasContent() {
       return (
         this.hasTimestamp ||

packages/web-app-files/src/components/SideBar/Versions/FileVersions.vue

@@ -63,7 +63,7 @@ import {
   useDownloadFile,
   useStore
 } from '@ownclouders/web-pkg'
-import { computed, defineComponent, inject, Ref, unref, watch } from 'vue'
+import { computed, defineComponent, inject, Ref, ref, unref, watch } from 'vue'
 import { isShareSpaceResource, Resource, SpaceResource } from '@ownclouders/web-client/src/helpers'
 import { SharePermissions } from '@ownclouders/web-client/src/helpers/share'
 import { useTask } from 'vue-concurrency'
@@ -87,15 +87,13 @@ export default defineComponent({
     const space = inject<Ref<SpaceResource>>('space')
     const resource = inject<Ref<Resource>>('resource')
 
-    const versions = computed(() => {
-      return store.getters['Files/versions']
-    })
-
+    const versions = ref<Resource[]>([])
     const fetchVersionsTask = useTask(function* () {
-      yield store.dispatch('Files/loadVersions', {
-        client: clientService.webdav,
-        fileId: unref(resource).fileId
-      })
+      try {
+        versions.value = yield clientService.webdav.listFileVersions(unref(resource).fileId)
+      } catch (e) {
+        console.error(e)
+      }
     })
     const areVersionsLoading = computed(() => {
       return !fetchVersionsTask.last || fetchVersionsTask.isRunning

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

@@ -7,7 +7,6 @@ import {
   Resource,
   SpaceResource
 } from '@ownclouders/web-client/src/helpers'
-import { WebDAV } from '@ownclouders/web-client/src/webdav'
 import { ClientService, LoadingTaskCallbackArguments } from '@ownclouders/web-pkg'
 import { Language } from 'vue3-gettext'
 import { eventBus } from '@ownclouders/web-pkg'
@@ -160,16 +159,6 @@ export default {
       )
     }
   },
-  async loadVersions(context, { client, fileId }: { client: WebDAV; fileId: Resource['fileId'] }) {
-    let response
-    try {
-      response = await client.listFileVersions(fileId)
-    } catch (e) {
-      console.error(e)
-      response = []
-    }
-    context.commit('SET_VERSIONS', response)
-  },
   loadAvatars(
     { commit },
     {

packages/web-app-files/src/store/getters.ts

@@ -32,9 +32,6 @@ export default {
       spaces: spaceCount
     }
   },
-  versions: (state) => {
-    return state.versions
-  },
   areHiddenFilesShown: (state) => {
     return state.areHiddenFilesShown
   },

packages/web-app-files/src/store/state.ts

@@ -3,7 +3,6 @@ export default {
   files: [],
   selectedIds: [],
   latestSelectedId: null,
-  versions: [],
 
   /**
    * View settings

packages/web-app-files/tests/unit/components/FilesList/ResourceDetails.spec.ts

@@ -53,6 +53,7 @@ describe('ResourceDetails component', () => {
         })
       })
     }
+    mocks.$clientService.webdav.listFileVersions.mockResolvedValue([])
     const storeOptions = { ...defaultStoreMockOptions }
     const store = createStore(storeOptions)
 
@@ -82,6 +83,7 @@ describe('ResourceDetails component', () => {
           mocks,
           plugins: [...defaultPlugins(), store],
           provide: {
+            ...mocks,
             space,
             resource: file
           }

packages/web-app-files/tests/unit/components/SideBar/Details/FileDetails.spec.ts

@@ -141,9 +141,10 @@ describe('Details SideBar Panel', () => {
     })
   })
   describe('versions', () => {
-    it('show if given for files on a private page', () => {
+    it('show if given for files on a private page', async () => {
       const resource = getResourceMock()
       const { wrapper } = createWrapper({ resource, versions: ['1'] })
+      await wrapper.vm.$nextTick()
       expect(wrapper.find(selectors.versionsInfo).exists()).toBeTruthy()
     })
     it('do not show for folders on a private page', () => {
@@ -203,7 +204,6 @@ function createWrapper({
   tagsEnabled = true
 } = {}) {
   const storeOptions = defaultStoreMockOptions
-  storeOptions.modules.Files.getters.versions.mockReturnValue(versions)
   storeOptions.modules.runtime.modules.ancestorMetaData.getters.ancestorMetaData.mockReturnValue(
     ancestorMetaData
   )
@@ -213,6 +213,7 @@ function createWrapper({
   const publicLocation = createLocationPublic('files-public-link')
   const currentRoute = isPublicLinkContext ? publicLocation : spacesLocation
   const mocks = defaultComponentMocks({ currentRoute: mock<RouteLocation>(currentRoute as any) })
+  mocks.$clientService.webdav.listFileVersions.mockResolvedValue(versions)
   const capabilities = { files: { tags: tagsEnabled } }
   return {
     wrapper: mount(FileDetails, {

packages/web-app-files/tests/unit/components/SideBar/Versions/FileVersions.spec.ts

@@ -177,12 +177,6 @@ function getMountedWrapper({
   loadingStateDelay = 0
 } = {}) {
   const storeOptions = defaultStoreMockOptions
-  storeOptions.modules.Files.getters.versions.mockImplementation(() => versions)
-  storeOptions.modules.Files.actions.loadVersions.mockImplementation(() => {
-    if (loadingStateDelay > 0) {
-      return new Promise((res) => setTimeout(res, loadingStateDelay))
-    }
-  })
   const store = createStore(storeOptions)
   const downloadFile = jest.fn()
   jest.mocked(useDownloadFile).mockReturnValue({ downloadFile })
@@ -191,6 +185,13 @@ function getMountedWrapper({
     downloadFile
   }
   mocks.$clientService.webdav.getFileInfo.mockResolvedValue(mock<Resource>({ id: '1' }))
+  mocks.$clientService.webdav.listFileVersions.mockImplementation(() => {
+    if (loadingStateDelay > 0) {
+      return new Promise((res) => setTimeout(() => res(versions), loadingStateDelay))
+    }
+    return new Promise((res) => res(versions))
+  })
+
   return {
     wrapper: mountType(FileVersions, {
       global: {

packages/web-test-helpers/src/mocks/store/filesModuleMockOptions.ts

@@ -10,8 +10,7 @@ export const filesModuleMockOptions = {
       currentFolder: jest.fn(),
       files: jest.fn(() => []),
       activeFiles: jest.fn(),
-      selectedFiles: jest.fn(() => []),
-      versions: jest.fn(() => [])
+      selectedFiles: jest.fn(() => [])
     },
     mutations: {
       SET_FILE_SELECTION: jest.fn(),
@@ -34,7 +33,6 @@ export const filesModuleMockOptions = {
     actions: {
       deleteFiles: jest.fn(),
       loadIndicators: jest.fn(),
-      loadVersions: jest.fn(),
       clearTrashBin: jest.fn(),
       removeFilesFromTrashbin: jest.fn(),
       resetFileSelection: jest.fn(),