From d0e69e3f2293dfbd4f867c107eb7296296ea05ff Mon Sep 17 00:00:00 2001 From: JanAckermann Date: Fri, 8 Jul 2022 15:11:38 +0200 Subject: [PATCH 01/10] Redesign shared with list --- .../InviteCollaborator/AutocompleteItem.vue | 2 +- .../SideBar/Shares/Collaborators/ListItem.vue | 152 ++++++++++-------- .../web-app-files/src/helpers/resources.ts | 2 +- .../Shares/Collaborators/ListItem.spec.js | 22 +-- .../__snapshots__/ListItem.spec.js.snap | 44 +++-- 5 files changed, 118 insertions(+), 104 deletions(-) diff --git a/packages/web-app-files/src/components/SideBar/Shares/Collaborators/InviteCollaborator/AutocompleteItem.vue b/packages/web-app-files/src/components/SideBar/Shares/Collaborators/InviteCollaborator/AutocompleteItem.vue index e5bbc3e7055..df094d19b4f 100644 --- a/packages/web-app-files/src/components/SideBar/Shares/Collaborators/InviteCollaborator/AutocompleteItem.vue +++ b/packages/web-app-files/src/components/SideBar/Shares/Collaborators/InviteCollaborator/AutocompleteItem.vue @@ -37,7 +37,7 @@ :accessible-label="$gettext('User')" />
- + -
+
-
-

-

+
+ + -

-

-

Access details
+ +
  • + Addition +
    • +
  • + Type +
    • +     + +
    +
    +
    +
    + +
    +
    + +
    +
    +
    + + + + + +
    +
    - - -

    -

    -

    +
    +
    -
    - - -
    -
    - -
    @@ -193,11 +204,13 @@ export default defineComponent({ if (!this.share.collaborator.additionalInfo) { return } - return ` (${this.share.collaborator.additionalInfo})` + return this.share.collaborator.additionalInfo }, shareDisplayNameTooltip() { - return this.shareDisplayName + (this.shareAdditionalInfo || '') + return ( + this.shareDisplayName + (this.shareAdditionalInfo ? `(${this.shareAdditionalInfo})` : '') + ) }, screenreaderShareDisplayName() { @@ -214,11 +227,6 @@ export default defineComponent({ return this.$gettextInterpolate(translated, context) }, - screenreaderShareDetails() { - const translated = this.$gettext('Share type: %{ shareType }') - return this.$gettextInterpolate(translated, { shareType: this.shareTypeText }) - }, - shareExpirationText() { const translated = this.$gettext('Expires %{ expiryDateRelative }') return this.$gettextInterpolate(translated, { @@ -258,6 +266,12 @@ export default defineComponent({ sharedParentDir() { return this.sharedParentRoute?.params?.item.split('/').pop() + }, + + shareDetailsHelperContent() { + return { + text: this.$gettext('Invite persons or groups to access this file or folder.') + } } }, methods: { diff --git a/packages/web-app-files/src/helpers/resources.ts b/packages/web-app-files/src/helpers/resources.ts index b24c643db97..0614527a029 100644 --- a/packages/web-app-files/src/helpers/resources.ts +++ b/packages/web-app-files/src/helpers/resources.ts @@ -541,7 +541,7 @@ export function buildCollaboratorShare(s, file, allowSharePermission): Share { share.customPermissions = SharePermissions.bitmaskToPermissions(s.permissions) share.role = PeopleShareRoles.getByBitmask( parseInt(s.permissions), - file.isFolder, + file.isFolder || file.type === 'folder', allowSharePermission ) // share.email = 'foo@djungle.com' // hm, where do we get the mail from? share_with_additional_info:Object? diff --git a/packages/web-app-files/tests/unit/components/SideBar/Shares/Collaborators/ListItem.spec.js b/packages/web-app-files/tests/unit/components/SideBar/Shares/Collaborators/ListItem.spec.js index e2cb7ed5584..184b65ce76b 100644 --- a/packages/web-app-files/tests/unit/components/SideBar/Shares/Collaborators/ListItem.spec.js +++ b/packages/web-app-files/tests/unit/components/SideBar/Shares/Collaborators/ListItem.spec.js @@ -18,7 +18,7 @@ const selectors = { notUserAvatar: 'oc-avatar-item-stub.files-collaborators-collaborator-indicator', collaboratorAdditionalInfo: '.files-collaborators-collaborator-additional-info', collaboratorName: '.files-collaborators-collaborator-name', - shareType: '.files-collaborators-collaborator-share-type', + accessDetailsButton: '.files-collaborators-collaborator-access-details-button', collaboratorRole: '.files-collaborators-collaborator-role', collaboratorEdit: '.files-collaborators-collaborator-edit', shareInheritanceIndicators: '.oc-resource-indicators' @@ -58,25 +58,9 @@ describe('Collaborator ListItem component', () => { const wrapper = createWrapper() expect(wrapper.find(selectors.collaboratorName).text()).toEqual('Brian Murphy') }) - describe('additionalInfo', () => { - it('shows additional information about the collaborator if set', () => { - const wrapper = createWrapper() - expect(wrapper.find(selectors.collaboratorAdditionalInfo).text()).toEqual( - '(brian@owncloud.com)' - ) - }) - it('does not show additional information about the collaborator if not set', () => { - const wrapper = createWrapper({ - collaborator: { - displayName: 'Alice Hansen' - } - }) - expect(wrapper.find(selectors.collaboratorAdditionalInfo).exists()).toBeFalsy() - }) - }) - it.each(ShareTypes.authenticated)('shows a label for the share type', (shareType) => { + it.each(ShareTypes.authenticated)('shows a button for the access details', (shareType) => { const wrapper = createWrapper({ shareType: shareType.value }) - expect(wrapper.find(selectors.shareType).text()).toBe(shareType.label) + expect(wrapper.find(selectors.accessDetailsButton).exists()).toBeTruthy() }) }) describe('modifiable property', () => { diff --git a/packages/web-app-files/tests/unit/components/SideBar/Shares/Collaborators/__snapshots__/ListItem.spec.js.snap b/packages/web-app-files/tests/unit/components/SideBar/Shares/Collaborators/__snapshots__/ListItem.spec.js.snap index 23419191d70..979a4a170a9 100644 --- a/packages/web-app-files/tests/unit/components/SideBar/Shares/Collaborators/__snapshots__/ListItem.spec.js.snap +++ b/packages/web-app-files/tests/unit/components/SideBar/Shares/Collaborators/__snapshots__/ListItem.spec.js.snap @@ -2,22 +2,38 @@ exports[`Collaborator ListItem component share inheritance indicators show when sharedParentRoute is given 1`] = `
    -
    +
    -
    -

    Share receiver name: Brian Murphy (brian@owncloud.com)

    -

    · - via - folder - - Share type: User -

    - +
    +
    Share receiver name: Brian Murphy (brian@owncloud.com) + + + + +

    Access details

    + +
  • Additionbrian@owncloud.com
    • +
  • TypeUser
    • +     +     +
    +
    +
    +
    + +
    +
    +
    + + +
    +
    + via + folder + +
    +
    -
    - - -
    `; From 65d0d5e60ab0506e84ca419d1b555f992e54effc Mon Sep 17 00:00:00 2001 From: JanAckermann Date: Tue, 19 Jul 2022 10:11:20 +0200 Subject: [PATCH 02/10] Update snapshots --- .../Shares/Collaborators/__snapshots__/ListItem.spec.js.snap | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/web-app-files/tests/unit/components/SideBar/Shares/Collaborators/__snapshots__/ListItem.spec.js.snap b/packages/web-app-files/tests/unit/components/SideBar/Shares/Collaborators/__snapshots__/ListItem.spec.js.snap index 979a4a170a9..19f7c8575c7 100644 --- a/packages/web-app-files/tests/unit/components/SideBar/Shares/Collaborators/__snapshots__/ListItem.spec.js.snap +++ b/packages/web-app-files/tests/unit/components/SideBar/Shares/Collaborators/__snapshots__/ListItem.spec.js.snap @@ -10,7 +10,7 @@ exports[`Collaborator ListItem component share inheritance indicators show when -

    Access details

    +
    Access details
  • Additionbrian@owncloud.com
  • TypeUser
    • From 4a28148a628c4dc91760810dab9c3de3cfebd169 Mon Sep 17 00:00:00 2001 From: JanAckermann Date: Tue, 19 Jul 2022 10:40:52 +0200 Subject: [PATCH 03/10] Trigger Build From e27d8c9745cf7f1c1e18d7c83135d52b9024d814 Mon Sep 17 00:00:00 2001 From: JanAckermann Date: Tue, 19 Jul 2022 14:28:09 +0200 Subject: [PATCH 04/10] Fix acceptance tests --- .../SideBar/Shares/Collaborators/ListItem.vue | 16 +++++++++++++--- .../__snapshots__/ListItem.spec.js.snap | 6 +++--- .../shareWithUsers.feature | 4 ++-- .../SharingDialog/collaboratorsDialog.js | 19 +++++++++++++++++++ 4 files changed, 37 insertions(+), 8 deletions(-) diff --git a/packages/web-app-files/src/components/SideBar/Shares/Collaborators/ListItem.vue b/packages/web-app-files/src/components/SideBar/Shares/Collaborators/ListItem.vue index 5e3916d4076..145f17ce45a 100644 --- a/packages/web-app-files/src/components/SideBar/Shares/Collaborators/ListItem.vue +++ b/packages/web-app-files/src/components/SideBar/Shares/Collaborators/ListItem.vue @@ -38,16 +38,26 @@ > - + diff --git a/packages/web-app-files/tests/unit/components/SideBar/Shares/Collaborators/__snapshots__/ListItem.spec.js.snap b/packages/web-app-files/tests/unit/components/SideBar/Shares/Collaborators/__snapshots__/ListItem.spec.js.snap index 19f7c8575c7..2a9314e17d2 100644 --- a/packages/web-app-files/tests/unit/components/SideBar/Shares/Collaborators/__snapshots__/ListItem.spec.js.snap +++ b/packages/web-app-files/tests/unit/components/SideBar/Shares/Collaborators/__snapshots__/ListItem.spec.js.snap @@ -9,11 +9,11 @@ exports[`Collaborator ListItem component share inheritance indicators show when - +
    diff --git a/tests/acceptance/features/webUISharingInternalUsersShareWithPage/shareWithUsers.feature b/tests/acceptance/features/webUISharingInternalUsersShareWithPage/shareWithUsers.feature index f70d508fdf7..ddc4d89fbb3 100644 --- a/tests/acceptance/features/webUISharingInternalUsersShareWithPage/shareWithUsers.feature +++ b/tests/acceptance/features/webUISharingInternalUsersShareWithPage/shareWithUsers.feature @@ -137,8 +137,8 @@ Feature: Shares in share-with pages Then user "Brian Murphy" should be listed with additional info "" in the collaborators list on the webUI Examples: | additional-info-field | additional-info-result | - | id | (Brian) | - | email | (brian@example.org) | + | id | Brian | + | email | brian@example.org | @issue-ocis-1328 Scenario: collaborators list does not contain additional info when disabled diff --git a/tests/acceptance/pageObjects/FilesPageElement/SharingDialog/collaboratorsDialog.js b/tests/acceptance/pageObjects/FilesPageElement/SharingDialog/collaboratorsDialog.js index 1a0a5c8231b..f07c6e90105 100644 --- a/tests/acceptance/pageObjects/FilesPageElement/SharingDialog/collaboratorsDialog.js +++ b/tests/acceptance/pageObjects/FilesPageElement/SharingDialog/collaboratorsDialog.js @@ -140,6 +140,19 @@ module.exports = { results = listItemElementIds.map(async (collaboratorElementId) => { const collaboratorResult = {} + + let contextButtonEl = null + await this.api.elementIdElement( + collaboratorElementId, + 'css selector', + this.elements.collaboratorAccessDetailsButton, + (result) => { + contextButtonEl = result.value.ELEMENT + } + ) + await this.api.elementIdClick(contextButtonEl) + this.waitForElementVisible(this.elements.collaboratorAccessDetailsDrop) + for (const attrName in subSelectors) { let attrElementId = null await this.api.elementIdElement( @@ -273,6 +286,12 @@ module.exports = { expirationDatePickerTrigger: { selector: '//button[contains(@class, "files-collaborators-expiration-button")]', locateStrategy: 'xpath' + }, + collaboratorAccessDetailsButton: { + selector: '.files-collaborators-collaborator-access-details-button' + }, + collaboratorAccessDetailsDrop: { + selector: '.share-access-details-drop' } } } From df7a1f74fa6b6ce1870c1f3e2c7c913758ddf110 Mon Sep 17 00:00:00 2001 From: JanAckermann Date: Tue, 19 Jul 2022 15:30:48 +0200 Subject: [PATCH 05/10] Fix acceptance tests --- .../FilesPageElement/SharingDialog/collaboratorsDialog.js | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/tests/acceptance/pageObjects/FilesPageElement/SharingDialog/collaboratorsDialog.js b/tests/acceptance/pageObjects/FilesPageElement/SharingDialog/collaboratorsDialog.js index f07c6e90105..bc08370452d 100644 --- a/tests/acceptance/pageObjects/FilesPageElement/SharingDialog/collaboratorsDialog.js +++ b/tests/acceptance/pageObjects/FilesPageElement/SharingDialog/collaboratorsDialog.js @@ -141,16 +141,16 @@ module.exports = { results = listItemElementIds.map(async (collaboratorElementId) => { const collaboratorResult = {} - let contextButtonEl = null + let accessDetailsBtn = null await this.api.elementIdElement( collaboratorElementId, 'css selector', this.elements.collaboratorAccessDetailsButton, (result) => { - contextButtonEl = result.value.ELEMENT + accessDetailsBtn = result.value.ELEMENT } ) - await this.api.elementIdClick(contextButtonEl) + await this.api.elementIdClick(accessDetailsBtn) this.waitForElementVisible(this.elements.collaboratorAccessDetailsDrop) for (const attrName in subSelectors) { @@ -174,7 +174,7 @@ module.exports = { collaboratorResult[attrName] = false } } - + await this.api.elementIdClick(collaboratorElementId) return collaboratorResult }) From 1c0ae5af48f5ffdca4b716a26eec17ea9a84f74b Mon Sep 17 00:00:00 2001 From: JanAckermann Date: Wed, 20 Jul 2022 09:42:09 +0200 Subject: [PATCH 06/10] Trigger Build From 3668b4f3240f1a71baf8bcdf11eaba76192fdd3b Mon Sep 17 00:00:00 2001 From: JanAckermann Date: Wed, 20 Jul 2022 10:09:32 +0200 Subject: [PATCH 07/10] Fix tests --- .../FilesPageElement/SharingDialog/collaboratorsDialog.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/tests/acceptance/pageObjects/FilesPageElement/SharingDialog/collaboratorsDialog.js b/tests/acceptance/pageObjects/FilesPageElement/SharingDialog/collaboratorsDialog.js index bc08370452d..f0fc100297e 100644 --- a/tests/acceptance/pageObjects/FilesPageElement/SharingDialog/collaboratorsDialog.js +++ b/tests/acceptance/pageObjects/FilesPageElement/SharingDialog/collaboratorsDialog.js @@ -174,7 +174,7 @@ module.exports = { collaboratorResult[attrName] = false } } - await this.api.elementIdClick(collaboratorElementId) + this.api.mouseButtonClick() return collaboratorResult }) From 31e3165e324bada03b5fa9988d4a9f3966c6b6a8 Mon Sep 17 00:00:00 2001 From: JanAckermann Date: Wed, 20 Jul 2022 10:40:39 +0200 Subject: [PATCH 08/10] Fix tests --- .../shareWithUsers.feature | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/tests/acceptance/features/webUISharingInternalUsersToRootCollaborator/shareWithUsers.feature b/tests/acceptance/features/webUISharingInternalUsersToRootCollaborator/shareWithUsers.feature index e6f466105f0..e56bc3209b9 100644 --- a/tests/acceptance/features/webUISharingInternalUsersToRootCollaborator/shareWithUsers.feature +++ b/tests/acceptance/features/webUISharingInternalUsersToRootCollaborator/shareWithUsers.feature @@ -71,8 +71,8 @@ Feature: Shares collaborator list Then user "Brian Murphy" should be listed with additional info "" in the collaborators list on the webUI Examples: | additional-info-field | additional-info-result | - | id | (Brian) | - | email | (brian@example.org) | + | id | Brian | + | email | brian@example.org | Scenario: collaborators list does not contain additional info when disabled From d2d19db3374fbce16cf2018c841b5c9b9bc7db06 Mon Sep 17 00:00:00 2001 From: JanAckermann Date: Wed, 20 Jul 2022 10:51:53 +0200 Subject: [PATCH 09/10] Add changelog item --- changelog/unreleased/enhancement-redesign-shared-with-list | 7 +++++++ 1 file changed, 7 insertions(+) create mode 100644 changelog/unreleased/enhancement-redesign-shared-with-list diff --git a/changelog/unreleased/enhancement-redesign-shared-with-list b/changelog/unreleased/enhancement-redesign-shared-with-list new file mode 100644 index 00000000000..bc69efe2ebf --- /dev/null +++ b/changelog/unreleased/enhancement-redesign-shared-with-list @@ -0,0 +1,7 @@ +Enhancement: Redesign shared with list + +We've redesigned the shared with list, to archive more spacing and a better user experience. +We've also fixed a bug, where the role in a sub share wasn't shown. + +https://github.com/owncloud/web/pull/7252 +https://github.com/owncloud/web/issues/7110 From cc3f941800bc3ebbdd14907e9b14835b75c4af26 Mon Sep 17 00:00:00 2001 From: JanAckermann Date: Wed, 20 Jul 2022 13:29:39 +0200 Subject: [PATCH 10/10] Omit erarly return --- changelog/unreleased/enhancement-redesign-shared-with-list | 4 ++-- .../src/components/SideBar/Shares/Collaborators/ListItem.vue | 3 --- 2 files changed, 2 insertions(+), 5 deletions(-) diff --git a/changelog/unreleased/enhancement-redesign-shared-with-list b/changelog/unreleased/enhancement-redesign-shared-with-list index bc69efe2ebf..29f6dd13215 100644 --- a/changelog/unreleased/enhancement-redesign-shared-with-list +++ b/changelog/unreleased/enhancement-redesign-shared-with-list @@ -1,7 +1,7 @@ Enhancement: Redesign shared with list -We've redesigned the shared with list, to archive more spacing and a better user experience. -We've also fixed a bug, where the role in a sub share wasn't shown. +We've redesigned the shared with list, to achieve more spacing and a better user experience. +We've also fixed a bug, where the role in a child of a share wasn't shown. https://github.com/owncloud/web/pull/7252 https://github.com/owncloud/web/issues/7110 diff --git a/packages/web-app-files/src/components/SideBar/Shares/Collaborators/ListItem.vue b/packages/web-app-files/src/components/SideBar/Shares/Collaborators/ListItem.vue index 145f17ce45a..b36756c0d75 100644 --- a/packages/web-app-files/src/components/SideBar/Shares/Collaborators/ListItem.vue +++ b/packages/web-app-files/src/components/SideBar/Shares/Collaborators/ListItem.vue @@ -211,9 +211,6 @@ export default defineComponent({ }, shareAdditionalInfo() { - if (!this.share.collaborator.additionalInfo) { - return - } return this.share.collaborator.additionalInfo },