Merge pull request #6445 from owncloud/fix_search_context_menu

Fix search context menu
owncloud · Feb 16, 2022 · f2d3047 · f2d3047
2 parents b6895a3 + 64336c2
commit f2d3047
Show file tree

Hide file tree

Showing 14 changed files with 93 additions and 11 deletions.
diff --git a/changelog/unreleased/enhancement-search-context-menu b/changelog/unreleased/enhancement-search-context-menu
@@ -0,0 +1,5 @@
+Enhancement: Enable context menu for search results
+
+We've enabled a rudimentary context menu for search results.
+
+https://github.com/owncloud/web/pull/6445
diff --git a/packages/web-app-files/src/components/AppBar/SelectedResources/BatchActions.vue b/packages/web-app-files/src/components/AppBar/SelectedResources/BatchActions.vue
@@ -23,8 +23,14 @@ import DownloadFile from '../../../mixins/actions/downloadFile'
 import EmptyTrashBin from '../../../mixins/actions/emptyTrashBin'
 import Move from '../../../mixins/actions/move'
 import Restore from '../../../mixins/actions/restore'
+import { useIsFilesAppActive } from '../../../composables/useIsFilesAppActive'
 
 export default {
+  setup() {
+    return {
+      isFilesAppActive: useIsFilesAppActive()
+    }
+  },
   name: 'BatchActions',
   components: { ActionMenuItem },
   mixins: [

diff --git a/packages/web-app-files/src/components/FilesList/ContextActions.vue b/packages/web-app-files/src/components/FilesList/ContextActions.vue
@@ -39,8 +39,14 @@ import Restore from '../../mixins/actions/restore'
 import ShowActions from '../../mixins/actions/showActions'
 import ShowDetails from '../../mixins/actions/showDetails'
 import ShowShares from '../../mixins/actions/showShares'
+import { useIsFilesAppActive } from '../../composables/useIsFilesAppActive'
 
 export default {
+  setup() {
+    return {
+      isFilesAppActive: useIsFilesAppActive()
+    }
+  },
   name: 'ContextActions',
   components: { ActionMenuItem },
   mixins: [

diff --git a/packages/web-app-files/src/components/Search/List.vue b/packages/web-app-files/src/components/Search/List.vue
@@ -10,17 +10,21 @@
     </no-content-message>
     <resource-table
       v-else
+      v-model="selected"
       class="files-table"
       :class="{ 'files-table-squashed': false }"
       :resources="paginatedResources"
       :target-route="resourceTargetLocation"
       :are-paths-displayed="true"
       :are-thumbnails-displayed="displayThumbnails"
-      :has-actions="false"
+      :has-actions="true"
       :is-selectable="false"
       @fileClick="$_fileActions_triggerDefaultAction"
       @rowMounted="rowMounted"
     >
+      <template #contextMenu="{ resource }">
+        <context-actions v-if="isResourceInSelection(resource)" :items="selected" />
+      </template>
       <template #footer>
         <pagination :pages="paginationPages" :current-page="paginationPage" />
         <list-info
@@ -43,9 +47,10 @@ import { ImageType, ImageDimension } from '../../constants'
 import { createLocationSpaces } from '../../router'
 import NoContentMessage from '../FilesList/NoContentMessage.vue'
 import ResourceTable from '../FilesList/ResourceTable.vue'
+import ContextActions from '../FilesList/ContextActions.vue'
 import debounce from 'lodash-es/debounce'
 import { mapMutations, mapGetters, mapActions } from 'vuex'
-import { computed } from '@vue/composition-api'
+import { computed, ref } from '@vue/composition-api'
 import ListInfo from '../FilesList/ListInfo.vue'
 import Pagination from '../FilesList/Pagination.vue'
 import MixinFileActions from '../../mixins/fileActions'
@@ -55,7 +60,7 @@ import MixinFilesListScrolling from '../../mixins/filesListScrolling'
 const visibilityObserver = new VisibilityObserver()
 
 export default {
-  components: { ListInfo, Pagination, NoContentMessage, ResourceTable },
+  components: { ContextActions, ListInfo, Pagination, NoContentMessage, ResourceTable },
   mixins: [MixinFileActions, MixinFilesListFilter, MixinFilesListScrolling],
   props: {
     searchResults: {
@@ -74,7 +79,9 @@ export default {
       items: computed(() => store.getters['Files/activeFiles'])
     })
 
+    const selected = ref([])
     return {
+      selected,
       paginatedResources,
       paginationPages,
       paginationPage,
@@ -124,6 +131,9 @@ export default {
       }, 250)
 
       visibilityObserver.observe(component.$el, { onEnter: debounced, onExit: debounced.cancel })
+    },
+    isResourceInSelection(resource) {
+      return this.selected?.includes(resource)
     }
   }
 }

diff --git a/packages/web-app-files/src/components/SideBar/Actions/FileActions.vue b/packages/web-app-files/src/components/SideBar/Actions/FileActions.vue
@@ -15,8 +15,14 @@ import { mapGetters } from 'vuex'
 import ActionMenuItem from '../../ActionMenuItem.vue'
 
 import FileActions from '../../../mixins/fileActions'
+import { useIsFilesAppActive } from '../../../composables/useIsFilesAppActive'
 
 export default {
+  setup() {
+    return {
+      isFilesAppActive: useIsFilesAppActive()
+    }
+  },
   name: 'FileActions',
   title: ($gettext) => {
     return $gettext('Actions')

diff --git a/packages/web-app-files/src/composables/useIsFilesAppActive.ts b/packages/web-app-files/src/composables/useIsFilesAppActive.ts
@@ -0,0 +1,17 @@
+import { computed, ComputedRef, unref } from '@vue/composition-api'
+import { useActiveApp } from 'web-pkg/src/composables'
+import FilesApp from '../index'
+
+/*
+ * This composable can be used to check whether the current route
+ * belongs to the file app. It's used to determine whether certain
+ * file actions should be enabled in other apps too, for instance
+ * in the search app. This way we avoid having cross references to
+ * other apps in the files app.
+ */
+export const useIsFilesAppActive = (): ComputedRef<boolean> => {
+  const activeApp = useActiveApp()
+  return computed(() => {
+    return unref(activeApp) === FilesApp.appInfo.id
+  })
+}
diff --git a/packages/web-app-files/src/mixins/actions/downloadArchive.js b/packages/web-app-files/src/mixins/actions/downloadArchive.js
@@ -21,6 +21,7 @@ export default {
           },
           isEnabled: ({ resources }) => {
             if (
+              this.isFilesAppActive &&
               !isLocationSpacesActive(this.$router, 'files-spaces-personal-home') &&
               !isLocationSpacesActive(this.$router, 'files-spaces-project') &&
               !isLocationPublicActive(this.$router, 'files-public-files') &&

diff --git a/packages/web-app-files/src/mixins/actions/downloadFile.js b/packages/web-app-files/src/mixins/actions/downloadFile.js
@@ -17,6 +17,7 @@ export default {
           },
           isEnabled: ({ resources }) => {
             if (
+              this.isFilesAppActive &&
               !isLocationSpacesActive(this.$router, 'files-spaces-personal-home') &&
               !isLocationSpacesActive(this.$router, 'files-spaces-project') &&
               !isLocationPublicActive(this.$router, 'files-public-files') &&

diff --git a/packages/web-app-files/src/mixins/actions/favorite.js b/packages/web-app-files/src/mixins/actions/favorite.js
@@ -18,6 +18,7 @@ export default {
           },
           isEnabled: ({ resources }) => {
             if (
+              this.isFilesAppActive &&
               !isLocationSpacesActive(this.$router, 'files-spaces-personal-home') &&
               !isLocationCommonActive(this.$router, 'files-common-favorites')
             ) {

diff --git a/packages/web-app-files/src/mixins/actions/navigate.js b/packages/web-app-files/src/mixins/actions/navigate.js
@@ -29,7 +29,7 @@ export default {
               return false
             }
 
-            if (isSameResource(resources[0], this.currentFolder)) {
+            if (this.currentFolder !== null && isSameResource(resources[0], this.currentFolder)) {
               return false
             }
 
@@ -61,16 +61,14 @@ export default {
     },
     routeName() {
       if (isLocationPublicActive(this.$router, 'files-public-files')) {
-        createLocationPublic('files-public-files')
-        return
+        return createLocationPublic('files-public-files')
       }
 
       if (isLocationSpacesActive(this.$router, 'files-spaces-project')) {
-        createLocationPublic('files-spaces-project')
-        return
+        return createLocationPublic('files-spaces-project')
       }
 
-      createLocationSpaces('files-spaces-personal-home')
+      return createLocationSpaces('files-spaces-personal-home')
     }
   }
 }
diff --git a/packages/web-app-files/src/mixins/actions/showActions.js b/packages/web-app-files/src/mixins/actions/showActions.js
@@ -12,6 +12,11 @@ export default {
           label: () => this.$gettext('All Actions'),
           handler: this.$_showActions_trigger,
           isEnabled: ({ resources }) => {
+            // sidebar is currently only available inside files app
+            if (!this.isFilesAppActive) {
+              return false
+            }
+
             // we don't have batch actions in the right sidebar, yet.
             // return hardcoded `true` in all cases once we have them.
             return resources.length === 1

diff --git a/packages/web-app-files/src/mixins/actions/showDetails.js b/packages/web-app-files/src/mixins/actions/showDetails.js
@@ -14,6 +14,11 @@ export default {
           // we don't have details in the trashbin, yet.
           // remove trashbin route rule once we have them.
           isEnabled: ({ resources }) => {
+            // sidebar is currently only available inside files app
+            if (!this.isFilesAppActive) {
+              return false
+            }
+
             if (isLocationCommonActive(this.$router, 'files-common-trash')) {
               return false
             }

diff --git a/packages/web-app-files/src/mixins/actions/showShares.js b/packages/web-app-files/src/mixins/actions/showShares.js
@@ -13,6 +13,11 @@ export default {
           label: () => this.$gettext('Share'),
           handler: this.$_showShares_trigger,
           isEnabled: ({ resources }) => {
+            // sidebar is currently only available inside files app
+            if (!this.isFilesAppActive) {
+              return false
+            }
+
             if (isLocationCommonActive(this.$router, 'files-common-trash')) {
               return false
             }

diff --git a/packages/web-app-files/tests/unit/components/Search/List.spec.js b/packages/web-app-files/tests/unit/components/Search/List.spec.js
@@ -42,7 +42,15 @@ const files = [
     path: 'lorem.pdf',
     size: 50
   }
-]
+].map((file) => {
+  return {
+    ...file,
+    canDownload: () => true,
+    canBeDeleted: () => true,
+    isReceivedShare: () => false,
+    isMounted: () => false
+  }
+})
 
 describe('List component', () => {
   afterEach(() => {
@@ -140,7 +148,15 @@ function createStore(activeFiles) {
         getters: {
           activeFiles: () => activeFiles,
           totalFilesCount: () => ({ files: activeFiles.length, folders: 0 }),
-          totalFilesSize: () => getTotalSize(activeFiles)
+          totalFilesSize: () => getTotalSize(activeFiles),
+          currentFolder: () => {
+            return {
+              path: '',
+              canCreate() {
+                return false
+              }
+            }
+          }
         },
         mutations: {
           CLEAR_CURRENT_FILES_LIST: jest.fn(),