[full-ci] Fix: Sharing Panel - Show label instead of description

changelog/unreleased/enhancement-sharing-panel-show-label-instead-of-description

@@ -0,0 +1,4 @@
+Enhancement: Sharing panel show label instead of description for links
+
+https://github.com/owncloud/web/pull/7364
+https://github.com/owncloud/web/issues/7358

packages/web-app-files/src/components/SideBar/Shares/Collaborators/ListItem.vue

@@ -64,7 +64,11 @@
               />
             </div>
             <div v-else-if="share.role">
-              <span class="oc-mr-xs" v-text="share.role.label" />
+              <span
+                v-oc-tooltip="$gettext(share.role.description(false))"
+                class="oc-mr-xs"
+                v-text="$gettext(share.role.label)"
+              />
             </div>
           </div>
           <div class="oc-flex oc-flex-between oc-flex-middle oc-pl-s">

packages/web-app-files/src/components/SideBar/Shares/Collaborators/RoleDropdown.vue

@@ -145,7 +145,7 @@ export default {
         return this.$gettext('Invite with custom permissions')
       } else {
         return this.$gettextInterpolate(this.$gettext('Invite as %{ name }'), {
-          name: this.selectedRole.inlineLabel || ''
+          name: this.$gettext(this.selectedRole.inlineLabel) || ''
         })
       }
     },

packages/web-app-files/src/components/SideBar/Shares/Links/DetailsAndEdit.vue

@@ -2,19 +2,18 @@
   <div class="link-details oc-flex oc-flex-between oc-flex-middle oc-pl-s">
     <div v-if="isModifiable">
       <oc-button
-        :id="`edit-public-link-role-dropdown-toggl-${link.id}`"
+        :id="`edit-public-link-role-dropdown-toggle-${link.id}`"
         appearance="raw"
-        class="edit-public-link-role-dropdown-toggl oc-text-left"
+        class="edit-public-link-role-dropdown-toggle oc-text-left"
         gap-size="none"
       >
-        <span class="oc-invisible-sr" v-text="currentLinkRoleLabel" />
-        <span v-text="visibilityHint" />
+        <span class="link-current-role" v-text="$gettext(currentLinkRoleLabel)" />
         <oc-icon name="arrow-down-s" />
       </oc-button>
       <oc-drop
         ref="editPublicLinkRoleDropdown"
         :drop-id="`edit-public-link-role-dropdown`"
-        :toggle="`#edit-public-link-role-dropdown-toggl-${link.id}`"
+        :toggle="`#edit-public-link-role-dropdown-toggle-${link.id}`"
         padding-size="remove"
         mode="click"
       >
@@ -42,9 +41,9 @@
               <span>
                 <span
                   class="oc-text-bold oc-display-block oc-width-1-1"
-                  v-text="roleOption.label"
+                  v-text="$gettext(roleOption.label)"
                 />
-                <span>{{ roleOption.description() }}</span>
+                <span>{{ $gettext(roleOption.description()) }}</span>
               </span>
               <oc-icon
                 v-if="parseInt(link.permissions) === roleOption.bitmask(false)"
@@ -56,8 +55,11 @@
       </oc-drop>
     </div>
     <p v-else class="oc-my-rm">
-      <span class="oc-invisible-sr" v-text="currentLinkRoleLabel" />
-      <span v-text="visibilityHint" />
+      <span
+        v-oc-tooltip="$gettext(currentLinkRoleDescription)"
+        class="link-current-role"
+        v-text="$gettext(currentLinkRoleLabel)"
+      />
     </p>
     <div :class="{ 'oc-pr-s': !isModifiable }" class="details-buttons">
       <oc-button
@@ -187,7 +189,7 @@ export default {
     }
   },
   computed: {
-    visibilityHint() {
+    currentLinkRoleDescription() {
       return LinkShareRoles.getByBitmask(
         parseInt(this.link.permissions),
         this.isFolderShare

packages/web-app-files/tests/unit/components/SideBar/Shares/Links/__snapshots__/DetailsAndEdit.spec.js.snap

@@ -3,10 +3,10 @@
 exports[`DetailsAndEdit component if user can edit renders dropdown and edit button 1`] = `
 <div class="link-details oc-flex oc-flex-between oc-flex-middle oc-pl-s">
   <div>
-    <oc-button-stub id="edit-public-link-role-dropdown-toggl-undefined" appearance="raw" gap-size="none" class="edit-public-link-role-dropdown-toggl oc-text-left"><span class="oc-invisible-sr">Viewer</span> <span>Recipients can view and download contents.</span>
+    <oc-button-stub id="edit-public-link-role-dropdown-toggle-undefined" appearance="raw" gap-size="none" class="edit-public-link-role-dropdown-toggle oc-text-left"><span class="link-current-role">Viewer</span>
       <oc-icon-stub name="arrow-down-s"></oc-icon-stub>
     </oc-button-stub>
-    <oc-drop-stub drop-id="edit-public-link-role-dropdown" toggle="#edit-public-link-role-dropdown-toggl-undefined" padding-size="remove" mode="click">
+    <oc-drop-stub drop-id="edit-public-link-role-dropdown" toggle="#edit-public-link-role-dropdown-toggle-undefined" padding-size="remove" mode="click">
       <oc-list-stub class="roleDropdownList">
         <li>
           <oc-button-stub id="files-role-viewer" appearance="raw" justify-content="space-between" class="oc-py-xs oc-px-s selected"><span><span class="oc-text-bold oc-display-block oc-width-1-1">Viewer</span> <span>Recipients can view and download contents.</span></span>
@@ -52,7 +52,7 @@ exports[`DetailsAndEdit component if user can edit renders dropdown and edit but
 
 exports[`DetailsAndEdit component if user can not edit does not render dropdown or edit button 1`] = `
 <div class="link-details oc-flex oc-flex-between oc-flex-middle oc-pl-s">
-  <p class="oc-my-rm"><span class="oc-invisible-sr">Viewer</span> <span>Recipients can view and download contents.</span></p>
+  <p class="oc-my-rm"><span class="link-current-role">Viewer</span></p>
   <div class="details-buttons oc-pr-s">
     <!---->
     <!---->

packages/web-app-files/tests/unit/mixins/spaces/disable.spec.js

@@ -114,7 +114,8 @@ function getWrapper() {
         currentRoute: createLocationSpaces('files-spaces-projects'),
         resolve: (r) => {
           return { href: r.name }
-        }
+        },
+        push: jest.fn()
       },
       $gettext: jest.fn()
     },

packages/web-app-user-management/tests/unit/components/Groups/GroupsList.spec.js

@@ -61,6 +61,7 @@ function getMountedWrapper({ propsData = {} } = {}) {
     propsData: {
       groups: [],
       selectedGroups: [],
+      headerPosition: 0,
       ...propsData
     },
     stubs: {

packages/web-app-user-management/tests/unit/components/Users/UsersList.spec.js

@@ -101,6 +101,7 @@ function getWrapper({ propsData = {} } = {}) {
     propsData: {
       users: [],
       selectedUsers: [],
+      headerPosition: 0,
       ...propsData
     },
     stubs: {

tests/acceptance/pageObjects/FilesPageElement/publicLinksDialog.js

@@ -575,7 +575,7 @@ module.exports = {
       selector: '.oc-files-file-link-name'
     },
     publicLinkSubRole: {
-      selector: '.link-details .oc-invisible-sr'
+      selector: '.link-details .link-current-role'
     },
     publicLinkSubVia: {
       selector: '.oc-files-file-link-via'
@@ -597,7 +597,7 @@ module.exports = {
     },
     publicLinkEditRoleButton: {
       selector:
-        '//h4[contains(@class, "oc-files-file-link-name") and text()="%s"]//ancestor::li//div[contains(@class, "link-details")]/div/button[contains(@class, "edit-public-link-role-dropdown-toggl")]',
+        '//h4[contains(@class, "oc-files-file-link-name") and text()="%s"]//ancestor::li//div[contains(@class, "link-details")]/div/button[contains(@class, "edit-public-link-role-dropdown-toggle")]',
       locateStrategy: 'xpath'
     },
     publicLinkEditButton: {

tests/e2e/support/objects/app-files/link/actions.ts

@@ -48,12 +48,12 @@ const publicLinkSetRoleButton = `#files-role-%s`
 const linkExpiryDatepicker = '.link-expiry-picker'
 const publicLinkEditRoleButton =
   `//h4[contains(@class, "oc-files-file-link-name") and text()="%s"]//ancestor::li//div[contains(@class, "link-details")]/` +
-  `div/button[contains(@class, "edit-public-link-role-dropdown-toggl")]`
+  `div/button[contains(@class, "edit-public-link-role-dropdown-toggle")]`
 const addPublicLinkButton = '#files-file-link-add'
 const getMostRecentLink = '//div[@id="oc-files-file-link"]//ul/li[1]'
 const publicLink = `//ul/li/div/h4[contains(text(),'%s')]/following-sibling::div//p`
 const publicLinkCurrentRole =
-  '//button[contains(@class,"edit-public-link-role-dropdown-toggl")]//span[contains(@class,"oc-invisible-sr")]'
+  '//button[contains(@class,"edit-public-link-role-dropdown-toggle")]//span[contains(@class,"link-current-role")]'
 const linkUpdateDialog = '//div[contains(@class,"oc-notification-message-title")]'
 const editPublicLinkButton =
   `//h4[contains(@class, "oc-files-file-link-name") and text()="%s"]` +