Merge pull request #36084 from nextcloud/backport/35893/stable25

[stable25] Replace custom tooltips with native ones in users page

apps/settings/src/components/UserList/UserRow.vue

@@ -93,7 +93,7 @@
  <div v-else class="name">
  {{ user.id }}
  <div class="displayName subtitle">
- <div v-tooltip="user.displayname.length > 20 ? user.displayname : ''" class="cellText">
+ <div :title="user.displayname.length > 20 ? user.displayname : ''" class="cellText">
  {{ user.displayname }}
  </div>
  </div>
@@ -172,7 +172,7 @@
  <span slot="noResult">{{ t('settings', 'No results') }}</span>
  </NcMultiselect>
  </div>
- <div v-tooltip.auto="usedSpace"
+ <div :title="usedSpace"
  :class="{'icon-loading-small': loading.quota}"
  class="quota">
  <NcMultiselect :allow-empty="false"
@@ -214,9 +214,9 @@
  class="toggleUserActions">
  <NcActions>
  <NcActionButton icon="icon-checkmark"
- @click="editing = false">
- {{ t('settings', 'Done') }}
- </NcActionButton>
+ :title="t('settings', 'Done')"
+ :aria-label="t('settings', 'Done')"
+  @click="editing = false" />
  </NcActions>
  <div v-click-outside="hideMenu" class="userPopoverMenuWrapper">
  <button class="icon-more"
@@ -237,8 +237,7 @@
 
 <script>
 import ClickOutside from 'vue-click-outside'
-import Vue from 'vue'
-import VTooltip from 'v-tooltip'
+
 import {
  NcPopoverMenu,
  NcMultiselect,
@@ -248,8 +247,6 @@ import {
 import UserRowSimple from './UserRowSimple'
 import UserRowMixin from '../../mixins/UserRowMixin'
 
-Vue.use(VTooltip)
-
 export default {
  name: 'UserRow',
  components: {

apps/settings/src/components/UserList/UserRowSimple.vue

@@ -13,14 +13,14 @@
  <div class="name">
  {{ user.id }}
  <div class="displayName subtitle">
- <div v-tooltip="user.displayname.length > 20 ? user.displayname : ''" class="cellText">
+ <div :title="user.displayname.length > 20 ? user.displayname : ''" class="cellText">
  {{ user.displayname }}
  </div>
  </div>
  </div>
  <div />
  <div class="mailAddress">
- <div v-tooltip="user.email !== null && user.email.length > 20 ? user.email : ''" class="cellText">
+ <div :title="user.email !== null && user.email.length > 20 ? user.email : ''" class="cellText">
  {{ user.email }}
  </div>
  </div>
@@ -46,20 +46,21 @@
  <div v-if="showConfig.showUserBackend" class="userBackend">
  {{ user.backend }}
  </div>
- <div v-if="showConfig.showStoragePath" v-tooltip="user.storageLocation" class="storageLocation subtitle">
+ <div v-if="showConfig.showStoragePath" :title="user.storageLocation" class="storageLocation subtitle">
  {{ user.storageLocation }}
  </div>
  </div>
- <div v-if="showConfig.showLastLogin" v-tooltip.auto="userLastLoginTooltip" class="lastLogin">
+ <div v-if="showConfig.showLastLogin" :title="userLastLoginTooltip" class="lastLogin">
  {{ userLastLogin }}
  </div>
 
  <div class="userActions">
  <div v-if="canEdit && !loading.all" class="toggleUserActions">
  <NcActions>
- <NcActionButton icon="icon-rename" @click="toggleEdit">
- {{ t('settings', 'Edit User') }}
- </NcActionButton>
+ <NcActionButton icon="icon-rename"
+ :title="t('settings', 'Edit User')"
+ :aria-label="t('settings', 'Edit User')"
+ @click="toggleEdit" />
  </NcActions>
  <div class="userPopoverMenuWrapper">
  <button v-click-outside="hideMenu"