From 2854ebf2e1c6a291958de725aa3bf77e3829c101 Mon Sep 17 00:00:00 2001 From: Pascal Wengerter Date: Thu, 3 Mar 2022 17:40:34 +0100 Subject: [PATCH 1/2] Introduce Shares overview page Introduce `active` property for navItems in shares navigation The `active` property that's being used in the template was simply missing in the navItems. Added it and used the chance to switch over to composition API for the new SharesNavigation component. Use $gettext in template directly Not needed to define it in setup function Finalize SharesNavigation component && adjust tests --- .../unreleased/enhancement-shares-overview | 7 ++ .../src/components/AppBar/AppBar.vue | 36 +++++--- .../components/AppBar/SharesNavigation.vue | 85 +++++++++++++++++++ .../ExpirationDatepicker.vue | 4 +- packages/web-app-files/src/index.js | 26 ++---- .../src/views/{ => shares}/SharedViaLink.vue | 28 +++--- .../src/views/{ => shares}/SharedWithMe.vue | 30 +++---- .../views/{ => shares}/SharedWithOthers.vue | 28 +++--- .../tests/integration/specs/appBar.spec.js | 5 ++ .../specs/linkExpirationDate.spec.js | 6 +- .../integration/specs/pagination.spec.js | 14 +-- .../specs/peopleExpirationDate.spec.js | 6 +- .../tests/integration/specs/sidebar.spec.js | 6 +- .../AppBar/SharesNavigation.spec.js | 63 ++++++++++++++ .../SharesNavigation.spec.js.snap | 35 ++++++++ .../views/{ => shares}/SharedViaLink.spec.js | 6 +- .../views/{ => shares}/SharedWithMe.spec.js | 4 +- .../{ => shares}/SharedWithOthers.spec.js | 4 +- .../__snapshots__/SharedViaLink.spec.js.snap | 0 .../SharedWithOthers.spec.js.snap | 0 tests/acceptance/pageObjects/appBarActions.js | 11 +++ .../stepDefinitions/filesContext.js | 12 ++- 22 files changed, 310 insertions(+), 106 deletions(-) create mode 100644 changelog/unreleased/enhancement-shares-overview create mode 100644 packages/web-app-files/src/components/AppBar/SharesNavigation.vue rename packages/web-app-files/src/views/{ => shares}/SharedViaLink.vue (85%) rename packages/web-app-files/src/views/{ => shares}/SharedWithMe.vue (92%) rename packages/web-app-files/src/views/{ => shares}/SharedWithOthers.vue (86%) create mode 100644 packages/web-app-files/tests/unit/components/AppBar/SharesNavigation.spec.js create mode 100644 packages/web-app-files/tests/unit/components/AppBar/__snapshots__/SharesNavigation.spec.js.snap rename packages/web-app-files/tests/unit/views/{ => shares}/SharedViaLink.spec.js (96%) rename packages/web-app-files/tests/unit/views/{ => shares}/SharedWithMe.spec.js (98%) rename packages/web-app-files/tests/unit/views/{ => shares}/SharedWithOthers.spec.js (98%) rename packages/web-app-files/tests/unit/views/{ => shares}/__snapshots__/SharedViaLink.spec.js.snap (100%) rename packages/web-app-files/tests/unit/views/{ => shares}/__snapshots__/SharedWithOthers.spec.js.snap (100%) diff --git a/changelog/unreleased/enhancement-shares-overview b/changelog/unreleased/enhancement-shares-overview new file mode 100644 index 00000000000..e89d42f142a --- /dev/null +++ b/changelog/unreleased/enhancement-shares-overview @@ -0,0 +1,7 @@ +Enhancement: Shares overview + +We've merged the three shares navigation items into one central "Shares" item, +with a toggle to switch between the three different kinds of shares (incoming, outgoing, links). + +https://github.com/owncloud/web/issues/6440 +https://github.com/owncloud/web/pull/6512 diff --git a/packages/web-app-files/src/components/AppBar/AppBar.vue b/packages/web-app-files/src/components/AppBar/AppBar.vue index 4346cdf3cc7..85afe99c980 100644 --- a/packages/web-app-files/src/components/AppBar/AppBar.vue +++ b/packages/web-app-files/src/components/AppBar/AppBar.vue @@ -11,18 +11,22 @@ @progress="onFileProgress" />
- - -

+
+ + + + + +
-

@@ -57,13 +60,18 @@ import MixinFileActions from '../../mixins/fileActions' import { buildResource, buildWebDavFilesPath, buildWebDavSpacesPath } from '../../helpers/resources' import { bus } from 'web-pkg/src/instance' import { DavProperties } from 'web-pkg/src/constants' -import { isLocationPublicActive, isLocationSpacesActive } from '../../router' +import { + isLocationPublicActive, + isLocationSharesActive, + isLocationSpacesActive +} from '../../router' import { useActiveLocation } from '../../composables' import BatchActions from './SelectedResources/BatchActions.vue' import ContextActions from '../FilesList/ContextActions.vue' import CreateAndUpload from './CreateAndUpload.vue' import FileDrop from './Upload/FileDrop.vue' +import SharesNavigation from './SharesNavigation.vue' import SizeInfo from './SelectedResources/SizeInfo.vue' import ViewOptions from './ViewOptions.vue' @@ -73,12 +81,14 @@ export default { ContextActions, CreateAndUpload, FileDrop, + SharesNavigation, SizeInfo, ViewOptions }, mixins: [Mixins, MixinFileActions], setup() { return { + isSharesLocation: useActiveLocation(isLocationSharesActive), isPersonalLocation: useActiveLocation(isLocationSpacesActive, 'files-spaces-personal-home'), isPublicLocation: useActiveLocation(isLocationPublicActive, 'files-public-files'), isSpacesProjectsLocation: useActiveLocation(isLocationSpacesActive, 'files-spaces-projects'), diff --git a/packages/web-app-files/src/components/AppBar/SharesNavigation.vue b/packages/web-app-files/src/components/AppBar/SharesNavigation.vue new file mode 100644 index 00000000000..dcb84503115 --- /dev/null +++ b/packages/web-app-files/src/components/AppBar/SharesNavigation.vue @@ -0,0 +1,85 @@ + + + + diff --git a/packages/web-app-files/src/components/SideBar/Shares/InviteCollaborator/ExpirationDatepicker.vue b/packages/web-app-files/src/components/SideBar/Shares/InviteCollaborator/ExpirationDatepicker.vue index 10e500cf977..c2aaa91dd65 100644 --- a/packages/web-app-files/src/components/SideBar/Shares/InviteCollaborator/ExpirationDatepicker.vue +++ b/packages/web-app-files/src/components/SideBar/Shares/InviteCollaborator/ExpirationDatepicker.vue @@ -35,7 +35,7 @@ v-if="!enforced && dateCurrent" class="recipient-edit-expiration-btn-remove" appearance="raw" - :aria-label="gettext('Remove expiration date')" + :aria-label="$gettext('Remove expiration date')" @click="dateCurrent = null" > @@ -68,7 +68,6 @@ export default defineComponent({ setup(props, { emit }) { const vm = getCurrentInstance().proxy const language = computed(() => vm.$language) - const gettext = computed(() => vm.$gettext) const store = useStore() const capabilities = computed(() => store.getters.capabilities) const optionsUser = computed(() => capabilities.value.files_sharing.user?.expire_date) @@ -146,7 +145,6 @@ export default defineComponent({ return { language, - gettext, enforced, available, dateCurrent, diff --git a/packages/web-app-files/src/index.js b/packages/web-app-files/src/index.js index 0dfb8419a9a..50147d160ff 100644 --- a/packages/web-app-files/src/index.js +++ b/packages/web-app-files/src/index.js @@ -6,9 +6,9 @@ import PrivateLink from './views/PrivateLink.vue' import PublicFiles from './views/PublicFiles.vue' import PublicLink from './views/PublicLink.vue' import Personal from './views/Personal.vue' -import SharedWithMe from './views/SharedWithMe.vue' -import SharedWithOthers from './views/SharedWithOthers.vue' -import SharedViaLink from './views/SharedViaLink.vue' +import SharedWithMe from './views/shares/SharedWithMe.vue' +import SharedWithOthers from './views/shares/SharedWithOthers.vue' +import SharedViaLink from './views/shares/SharedViaLink.vue' import SpaceProject from './views/spaces/Project.vue' import SpaceProjects from './views/spaces/Projects.vue' import Trashbin from './views/Trashbin.vue' @@ -40,7 +40,7 @@ const appInfo = { } const navItems = [ { - name: $gettext('All files'), + name: $gettext('Personal'), icon: appInfo.icon, route: { path: `/${appInfo.id}/spaces/personal/home` @@ -57,24 +57,10 @@ const navItems = [ } }, { - name: $gettext('Shared with me'), + name: $gettext('Shares'), icon: 'share-forward', route: { - path: `/${appInfo.id}/shares/with-me` - } - }, - { - name: $gettext('Shared with others'), - icon: 'reply', - route: { - path: `/${appInfo.id}/shares/with-others` - } - }, - { - name: $gettext('Shared via link'), - icon: 'link', - route: { - path: `/${appInfo.id}/shares/via-link` + path: `/${appInfo.id}/shares` } }, { diff --git a/packages/web-app-files/src/views/SharedViaLink.vue b/packages/web-app-files/src/views/shares/SharedViaLink.vue similarity index 85% rename from packages/web-app-files/src/views/SharedViaLink.vue rename to packages/web-app-files/src/views/shares/SharedViaLink.vue index 8fa6e176b98..1695791fed3 100644 --- a/packages/web-app-files/src/views/SharedViaLink.vue +++ b/packages/web-app-files/src/views/shares/SharedViaLink.vue @@ -48,27 +48,27 @@