Load spaces in store and adapt search

owncloud · May 3, 2022 · 356bfe9 · 356bfe9
1 parent f0ed9bd
commit 356bfe9
Show file tree

Hide file tree

Showing 16 changed files with 128 additions and 46 deletions.
diff --git a/packages/web-app-files/src/components/FilesList/ResourceTable.vue b/packages/web-app-files/src/components/FilesList/ResourceTable.vue
@@ -50,7 +50,7 @@
           :key="`${item.path}-${resourceDomSelector(item)}-${item.thumbnail}`"
           :resource="item"
           :is-path-displayed="arePathsDisplayed"
-          :parent-folder-name-default="defaultParentFolderName"
+          :parent-folder-name-default="getDefaultParentFolderName(item)"
           :is-thumbnail-displayed="areThumbnailsDisplayed"
           :is-extension-displayed="areFileExtensionsShown"
           :is-resource-clickable="isResourceClickable(item.id)"
@@ -176,6 +176,7 @@ import Rename from '../../mixins/actions/rename'
 import { defineComponent, PropType } from '@vue/composition-api'
 import { extractDomSelector, Resource } from '../../helpers/resource'
 import { ShareTypes } from '../../helpers/share'
+import { createLocationSpaces } from '../../router'
 
 export default defineComponent({
   mixins: [Rename],
@@ -353,7 +354,7 @@ export default defineComponent({
   },
   computed: {
     ...mapGetters(['configuration']),
-    ...mapState('Files', ['areFileExtensionsShown']),
+    ...mapState('Files', ['areFileExtensionsShown', 'spaces']),
     popperOptions() {
       return {
         modifiers: [
@@ -512,9 +513,6 @@ export default defineComponent({
     },
     currentLanguage() {
       return (this.$language?.current || '').split('_')[0]
-    },
-    defaultParentFolderName() {
-      return this.hasSpaces ? this.$gettext('Personal') : this.$gettext('All files and folders')
     }
   },
   methods: {
@@ -543,11 +541,20 @@ export default defineComponent({
       if (this.targetRoute === null) {
         return {}
       }
+
+      const matchingSpace = this.getMatchingSpace(storageId)
+
+      if (matchingSpace && matchingSpace?.driveType === 'project') {
+        return createLocationSpaces('files-spaces-project', {
+          params: { storageId, item: path.replace(/^\//, '') || undefined }
+        })
+      }
+
       return {
         name: this.targetRoute.name,
         query: this.targetRoute.query,
         params: {
-          item: path.replace(/^\//, ''),
+          item: path.replace(/^\//, '') || undefined,
           ...this.targetRoute.params,
           ...(storageId && { storageId })
         }
@@ -693,6 +700,21 @@ export default defineComponent({
         resourceType,
         ownerName: resource.owner[0].displayName
       })
+    },
+    getMatchingSpace(storageId) {
+      return this.spaces.find((space) => space.id === storageId)
+    },
+    getDefaultParentFolderName(resource) {
+      if (!this.hasSpaces) {
+        this.$gettext('All files and folders')
+      }
+      const matchingSpace = this.getMatchingSpace(resource.storageId)
+
+      if (matchingSpace && matchingSpace?.driveType === 'project') {
+        return matchingSpace.name
+      }
+
+      return this.$gettext('Personal')
     }
   }
 })

diff --git a/packages/web-app-files/src/components/Search/Preview.vue b/packages/web-app-files/src/components/Search/Preview.vue
@@ -1,11 +1,12 @@
 <template>
-  <div class="files-search-preview" @click="$_fileActions_triggerDefaultAction(resource)">
+  <div class="files-search-preview">
     <oc-resource
       :resource="resource"
       :is-path-displayed="true"
       :folder-link="folderLink(resource)"
       :parent-folder-link="parentFolderLink(resource)"
       :parent-folder-name-default="defaultParentFolderName"
+      @click="$_fileActions_triggerDefaultAction(resource)"
     />
   </div>
 </template>
@@ -17,7 +18,7 @@ import { ImageDimension } from '../../constants'
 import { loadPreview } from '../../helpers/resource'
 import debounce from 'lodash-es/debounce'
 import Vue from 'vue'
-import { mapGetters } from 'vuex'
+import { mapGetters, mapState } from 'vuex'
 import { createLocationSpaces } from '../../router'
 import path from 'path'
 import { useCapabilitySpacesEnabled } from 'web-pkg/src/composables'
@@ -43,7 +44,8 @@ export default {
   setup() {
     return {
       hasSpaces: useCapabilitySpacesEnabled(),
-      resourceTargetLocation: createLocationSpaces('files-spaces-personal-home')
+      resourceTargetLocation: createLocationSpaces('files-spaces-personal-home'),
+      resourceTargetLocationSpace: createLocationSpaces('files-spaces-project')
     }
   },
   data() {
@@ -53,9 +55,21 @@ export default {
   },
   computed: {
     ...mapGetters(['configuration', 'user', 'getToken']),
+    ...mapState('Files', ['spaces']),
 
+    matchingSpace() {
+      return this.spaces.find((space) => space.id === this.resource.storageId)
+    },
     defaultParentFolderName() {
-      return this.hasSpaces ? this.$gettext('Personal') : this.$gettext('All files and folders')
+      if (!this.hasSpaces) {
+        this.$gettext('All files and folders')
+      }
+
+      if (this.matchingSpace?.driveType === 'project') {
+        return this.matchingSpace.name
+      }
+
+      return this.$gettext('Personal')
     }
   },
   beforeMount() {
@@ -91,14 +105,20 @@ export default {
       return this.createFolderLink(path.dirname(file.path), file.storageId)
     },
     createFolderLink(path, storageId) {
-      if (this.resourceTargetLocation === null) {
+      if (this.resourceTargetLocation === null || this.resourceTargetLocationSpace === null) {
         return {}
       }
+
+      if (this.matchingSpace?.driveType === 'project') {
+        return createLocationSpaces('files-spaces-project', {
+          params: { storageId, item: path.replace(/^\//, '') || undefined }
+        })
+      }
+
       return {
         name: this.resourceTargetLocation.name,
-        query: this.resourceTargetLocation.query,
         params: {
-          item: path.replace(/^\//, ''),
+          item: path.replace(/^\//, '') || undefined,
           ...this.resourceTargetLocation.params,
           ...(storageId && { storageId })
         }

diff --git a/packages/web-app-files/src/helpers/resources.ts b/packages/web-app-files/src/helpers/resources.ts
@@ -122,7 +122,7 @@ export function buildSpace(space) {
     spaceReadmeData = space.special.find((el) => el.specialFolder.name === 'readme')
   }
 
-  if (space.root) {
+  if (space.root?.permissions) {
     for (const permission of space.root.permissions) {
       for (const role of SpacePeopleShareRoles.list()) {
         if (permission.roles.includes(role.name)) {
@@ -146,6 +146,7 @@ export function buildSpace(space) {
     extension: '',
     path: '',
     webDavPath: '',
+    driveType: space.driveType,
     type: 'space',
     isFolder: true,
     mdate: space.lastModifiedDateTime,
@@ -161,7 +162,7 @@ export function buildSpace(space) {
     privateLink: '',
     downloadURL: '',
     ownerDisplayName: '',
-    ownerId: '',
+    ownerId: space.owner?.user?.id,
     disabled,
     spaceQuota: space.quota,
     spaceRoles,

diff --git a/packages/web-app-files/src/index.js b/packages/web-app-files/src/index.js
@@ -22,6 +22,7 @@ import { archiverService, thumbnailService, Registry } from './services'
 import fileSideBars from './fileSideBars'
 import { buildRoutes } from './router'
 import get from 'lodash-es/get'
+import { clientService } from 'web-pkg/src/services'
 
 // dirty: importing view from other extension within project
 import SearchResults from '../../web-app-search/src/views/List.vue'
@@ -125,6 +126,9 @@ export default {
     bus.publish('app.search.register.provider', Registry.sdkSearch)
   },
   userReady({ store }) {
+    // Load spaces to make them available across the application
+    store.dispatch('Files/loadSpaces', { clientService })
+
     archiverService.initialize(
       store.getters.configuration.server || window.location.origin,
       get(store, 'getters.capabilities.files.archivers', [

diff --git a/packages/web-app-files/src/search/sdk/list.ts b/packages/web-app-files/src/search/sdk/list.ts
@@ -24,7 +24,12 @@ export default class List implements SearchList {
     )
 
     return plainResources.map((plainResource) => {
-      const resource = buildResource(plainResource)
+      let resourceName = decodeURIComponent(plainResource.name)
+      if (resourceName.startsWith('/dav')) {
+        resourceName = resourceName.slice(4)
+      }
+
+      const resource = buildResource({ ...plainResource, ...{ name: resourceName } })
       return { id: resource.id, data: resource }
     })
   }

diff --git a/packages/web-app-files/src/search/sdk/preview.ts b/packages/web-app-files/src/search/sdk/preview.ts
@@ -42,7 +42,12 @@ export default class Preview implements SearchPreview {
     return this.cache.set(
       term,
       plainResources.map((plainResource) => {
-        const resource = buildResource(plainResource)
+        let resourceName = decodeURIComponent(plainResource.name)
+        if (resourceName.startsWith('/dav')) {
+          resourceName = resourceName.slice(4)
+        }
+
+        const resource = buildResource({ ...plainResource, ...{ name: resourceName } })
         return { id: resource.id, data: resource }
       })
     )

diff --git a/packages/web-app-files/src/store/actions.js b/packages/web-app-files/src/store/actions.js
@@ -678,6 +678,21 @@ export default {
     })
   },
 
+  async loadSpaces(context, { clientService }) {
+    const graphClient = clientService.graphAuthenticated(
+      context.rootGetters.configuration.server,
+      context.rootGetters.getToken
+    )
+    const graphResponse = await graphClient.drives.listMyDrives()
+
+    if (!graphResponse.data) {
+      return
+    }
+
+    const spaces = graphResponse.data.value.map((space) => buildSpace(space))
+    context.commit('LOAD_SPACES', spaces)
+  },
+
   async loadPreview({ commit, rootGetters }, { resource, isPublic, dimensions, type }) {
     if (
       rootGetters.previewFileExtensions.length &&

diff --git a/packages/web-app-files/src/store/mutations.js b/packages/web-app-files/src/store/mutations.js
@@ -6,6 +6,12 @@ import { renameResource } from '../helpers/resources'
 import { ShareTypes } from '../helpers/share'
 
 export default {
+  LOAD_SPACES(state, spaces) {
+    state.spaces = spaces
+  },
+  CLEAR_SPACES(state) {
+    state.spaces = []
+  },
   LOAD_FILES(state, { currentFolder, files }) {
     state.currentFolder = currentFolder
     state.files = files

diff --git a/packages/web-app-files/src/store/state.js b/packages/web-app-files/src/store/state.js
@@ -6,6 +6,7 @@ export default {
   inProgress: [],
   shareOpen: null,
   versions: [],
+  spaces: [],
 
   /**
    * Outgoing shares and links from currently highlighted element

diff --git a/packages/web-app-files/tests/unit/components/FilesList/ResourceTable.spec.js b/packages/web-app-files/tests/unit/components/FilesList/ResourceTable.spec.js
@@ -280,7 +280,10 @@ function getMountedWrapper(options = {}) {
           },
           modules: {
             Files: {
-              namespaced: true
+              namespaced: true,
+              state: {
+                spaces: []
+              }
             }
           }
         }),

diff --git a/packages/web-app-files/tests/unit/components/Search/Preview.spec.js b/packages/web-app-files/tests/unit/components/Search/Preview.spec.js
@@ -3,14 +3,13 @@ import DesignSystem from 'owncloud-design-system'
 
 import Preview from '@files/src/components/Search/Preview.vue'
 import VueCompositionAPI from '@vue/composition-api'
+import { createStore } from 'vuex-extensions'
+import Vuex from 'vuex'
 
 const localVue = createLocalVue()
 localVue.use(DesignSystem)
 localVue.use(VueCompositionAPI)
-
-const selectors = {
-  searchPreview: '.files-search-preview'
-}
+localVue.use(Vuex)
 
 const searchResult = {
   id: 1234,
@@ -21,10 +20,6 @@ const searchResult = {
   }
 }
 
-const spyTriggerDefaultAction = jest
-  .spyOn(Preview.mixins[0].methods, '$_fileActions_triggerDefaultAction')
-  .mockImplementation()
-
 describe('Preview component', () => {
   it('should set correct props on oc-resource component', () => {
     const wrapper = getWrapper()
@@ -33,16 +28,6 @@ describe('Preview component', () => {
     expect(ocResource.exists()).toBeTruthy()
     expect(ocResource.props().resource).toMatchObject(searchResult.data)
   })
-  it('should trigger the default action when search preview button is clicked', async () => {
-    const wrapper = getWrapper()
-    const searchPreview = wrapper.find(selectors.searchPreview)
-
-    expect(spyTriggerDefaultAction).toHaveBeenCalledTimes(0)
-
-    await searchPreview.trigger('click')
-
-    expect(spyTriggerDefaultAction).toHaveBeenCalledTimes(1)
-  })
   describe('folder and parent folder link', () => {
     it('should be empty if no resource target location given', () => {
       const wrapper = getWrapper({ resourceTargetLocation: null })
@@ -66,6 +51,19 @@ function getWrapper({
 } = {}) {
   return shallowMount(Preview, {
     localVue,
+    store: createStore(Vuex.Store, {
+      getters: {
+        configuration: () => {}
+      },
+      modules: {
+        Files: {
+          namespaced: true,
+          state: {
+            spaces: []
+          }
+        }
+      }
+    }),
     mocks: {
       $route: route
     },

diff --git a/packages/web-app-files/tests/unit/components/components.setup.js b/packages/web-app-files/tests/unit/components/components.setup.js
@@ -113,6 +113,7 @@ export const getStore = function ({
           resource: null,
           filesPageLimit: 100,
           files: [],
+          spaces: [],
           activeFiles: activeFiles,
           currentFolder: currentFolder,
           currentPage: currentPage,

diff --git a/packages/web-app-files/tests/unit/views/shares/__snapshots__/SharedWithOthers.spec.js.snap b/packages/web-app-files/tests/unit/views/shares/__snapshots__/SharedWithOthers.spec.js.snap
@@ -28,7 +28,7 @@ exports[`SharedWithOthers view when the wrapper is not loading anymore when leng
       </td>
       <td class="oc-td oc-table-cell oc-table-cell-align-left oc-table-cell-align-middle oc-table-cell-width-expand oc-text-truncate oc-table-data-cell oc-table-data-cell-name">
         <div class="resource-table-resource-wrapper">
-          <oc-resource-stub folderlink="[object Object]" parentfolderlink="[object Object]" resource="[object Object]" parentfoldernamedefault="All files and folders" ispathdisplayed="true" isextensiondisplayed="true" isresourceclickable="true"></oc-resource-stub>
+          <oc-resource-stub folderlink="[object Object]" parentfolderlink="[object Object]" resource="[object Object]" parentfoldernamedefault="Personal" ispathdisplayed="true" isextensiondisplayed="true" isresourceclickable="true"></oc-resource-stub>
           <oc-button-stub type="button" size="medium" submit="button" variation="passive" appearance="raw" justifycontent="center" gapsize="medium" class="resource-table-edit-name"><span class="oc-icon oc-icon-s oc-icon-passive"><!----></span></oc-button-stub>
         </div>
       </td>
@@ -51,7 +51,7 @@ exports[`SharedWithOthers view when the wrapper is not loading anymore when leng
       </td>
       <td class="oc-td oc-table-cell oc-table-cell-align-left oc-table-cell-align-middle oc-table-cell-width-expand oc-text-truncate oc-table-data-cell oc-table-data-cell-name">
         <div class="resource-table-resource-wrapper">
-          <oc-resource-stub folderlink="[object Object]" parentfolderlink="[object Object]" resource="[object Object]" parentfoldernamedefault="All files and folders" ispathdisplayed="true" isextensiondisplayed="true" isresourceclickable="true"></oc-resource-stub>
+          <oc-resource-stub folderlink="[object Object]" parentfolderlink="[object Object]" resource="[object Object]" parentfoldernamedefault="Personal" ispathdisplayed="true" isextensiondisplayed="true" isresourceclickable="true"></oc-resource-stub>
           <oc-button-stub type="button" size="medium" submit="button" variation="passive" appearance="raw" justifycontent="center" gapsize="medium" class="resource-table-edit-name"><span class="oc-icon oc-icon-s oc-icon-passive"><!----></span></oc-button-stub>
         </div>
       </td>
@@ -74,7 +74,7 @@ exports[`SharedWithOthers view when the wrapper is not loading anymore when leng
       </td>
       <td class="oc-td oc-table-cell oc-table-cell-align-left oc-table-cell-align-middle oc-table-cell-width-expand oc-text-truncate oc-table-data-cell oc-table-data-cell-name">
         <div class="resource-table-resource-wrapper">
-          <oc-resource-stub folderlink="[object Object]" parentfolderlink="[object Object]" resource="[object Object]" parentfoldernamedefault="All files and folders" ispathdisplayed="true" isextensiondisplayed="true" isresourceclickable="true"></oc-resource-stub>
+          <oc-resource-stub folderlink="[object Object]" parentfolderlink="[object Object]" resource="[object Object]" parentfoldernamedefault="Personal" ispathdisplayed="true" isextensiondisplayed="true" isresourceclickable="true"></oc-resource-stub>
           <oc-button-stub type="button" size="medium" submit="button" variation="passive" appearance="raw" justifycontent="center" gapsize="medium" class="resource-table-edit-name"><span class="oc-icon oc-icon-s oc-icon-passive"><!----></span></oc-button-stub>
         </div>
       </td>
@@ -97,7 +97,7 @@ exports[`SharedWithOthers view when the wrapper is not loading anymore when leng
       </td>
       <td class="oc-td oc-table-cell oc-table-cell-align-left oc-table-cell-align-middle oc-table-cell-width-expand oc-text-truncate oc-table-data-cell oc-table-data-cell-name">
         <div class="resource-table-resource-wrapper">
-          <oc-resource-stub folderlink="[object Object]" parentfolderlink="[object Object]" resource="[object Object]" parentfoldernamedefault="All files and folders" ispathdisplayed="true" isextensiondisplayed="true" isresourceclickable="true"></oc-resource-stub>
+          <oc-resource-stub folderlink="[object Object]" parentfolderlink="[object Object]" resource="[object Object]" parentfoldernamedefault="Personal" ispathdisplayed="true" isextensiondisplayed="true" isresourceclickable="true"></oc-resource-stub>
           <oc-button-stub type="button" size="medium" submit="button" variation="passive" appearance="raw" justifycontent="center" gapsize="medium" class="resource-table-edit-name"><span class="oc-icon oc-icon-s oc-icon-passive"><!----></span></oc-button-stub>
         </div>
       </td>