Skip to content

Commit cb05a21

Browse files
JuliaKirschenheuterJuliaKirschenheuter
committed
Replace custom tooltips with native one in vue components and views
Signed-off-by: julia.kirschenheuter <julia.kirschenheuter@nextcloud.com>
1 parent 34b25b8 commit cb05a21

11 files changed

Lines changed: 39 additions & 95 deletions

‎apps/files_sharing/src/components/SharingEntry.vue‎

Lines changed: 4 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -25,12 +25,13 @@
2525
<NcAvatar class="sharing-entry__avatar"
2626
:is-no-user="share.type !== SHARE_TYPES.SHARE_TYPE_USER"
2727
:user="share.shareWith"
28-
:display-name="share.shareWithDisplayName"
29-
:tooltip-message="share.type === SHARE_TYPES.SHARE_TYPE_USER ? share.shareWith : ''"
28+
:title="share.type === SHARE_TYPES.SHARE_TYPE_USER ? share.shareWithDisplayName : ''"
3029
:menu-position="'left'"
3130
:url="share.shareWithAvatar" />
31+
3232
<component :is="share.shareWithLink ? 'a' : 'div'"
33-
v-tooltip.auto="tooltip"
33+
:title="tooltip"
34+
:aria-label="tooltip"
3435
:href="share.shareWithLink"
3536
class="sharing-entry__desc">
3637
<span>{{ title }}<span v-if="!isUnique" class="sharing-entry__desc-unique"> ({{ share.shareWithDisplayNameUnique }})</span></span>
@@ -116,11 +117,6 @@
116117
</NcActionCheckbox>
117118
<NcActionTextEditable v-if="hasNote"
118119
ref="note"
119-
v-tooltip.auto="{
120-
content: errors.note,
121-
show: errors.note,
122-
trigger: 'manual'
123-
}"
124120
:class="{ error: errors.note}"
125121
:disabled="saving"
126122
:value="share.newNote || share.note"
@@ -147,7 +143,6 @@ import NcActionButton from '@nextcloud/vue/dist/Components/NcActionButton'
147143
import NcActionCheckbox from '@nextcloud/vue/dist/Components/NcActionCheckbox'
148144
import NcActionInput from '@nextcloud/vue/dist/Components/NcActionInput'
149145
import NcActionTextEditable from '@nextcloud/vue/dist/Components/NcActionTextEditable'
150-
import Tooltip from '@nextcloud/vue/dist/Directives/Tooltip'
151146
152147
import SharesMixin from '../mixins/SharesMixin.js'
153148
@@ -163,10 +158,6 @@ export default {
163158
NcAvatar,
164159
},
165160
166-
directives: {
167-
Tooltip,
168-
},
169-
170161
mixins: [SharesMixin],
171162
172163
data() {
@@ -204,7 +195,6 @@ export default {
204195
user: this.share.shareWithDisplayName,
205196
owner: this.share.ownerDisplayName,
206197
}
207-
208198
if (this.share.type === this.SHARE_TYPES.SHARE_TYPE_GROUP) {
209199
return t('files_sharing', 'Shared with the group {user} by {owner}', data)
210200
} else if (this.share.type === this.SHARE_TYPES.SHARE_TYPE_ROOM) {

‎apps/files_sharing/src/components/SharingEntryInherited.vue‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -26,9 +26,9 @@
2626
:title="share.shareWithDisplayName">
2727
<template #avatar>
2828
<NcAvatar :user="share.shareWith"
29-
:display-name="share.shareWithDisplayName"
30-
class="sharing-entry__avatar"
31-
tooltip-message="" />
29+
:aria-label="share.shareWithDisplayName"
30+
:title="share.shareWithDisplayName"
31+
class="sharing-entry__avatar" />
3232
</template>
3333
<NcActionText icon="icon-user">
3434
{{ t('files_sharing', 'Added by {initiator}', { initiator: share.ownerDisplayName }) }}

‎apps/files_sharing/src/components/SharingEntryInternal.vue‎

Lines changed: 6 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -10,12 +10,11 @@
1010
</template>
1111

1212
<NcActionLink :href="internalLink"
13-
:aria-label="t('files_sharing', 'Copy internal link to clipboard')"
13+
:aria-label="copyLinkTooltip"
14+
:title="copyLinkTooltip"
1415
target="_blank"
1516
:icon="copied && copySuccess ? 'icon-checkmark-color' : 'icon-clippy'"
16-
@click.prevent="copyLink">
17-
{{ clipboardTooltip }}
18-
</NcActionLink>
17+
@click.prevent="copyLink" />
1918
</SharingEntrySimple>
2019
</ul>
2120
</template>
@@ -60,18 +59,18 @@ export default {
6059
},
6160
6261
/**
63-
* Clipboard v-tooltip message
62+
* Tooltip message
6463
*
6564
* @return {string}
6665
*/
67-
clipboardTooltip() {
66+
copyLinkTooltip() {
6867
if (this.copied) {
6968
if (this.copySuccess) {
7069
return ''
7170
}
7271
return t('files_sharing', 'Cannot copy, please copy the link manually')
7372
}
74-
return t('files_sharing', 'Copy to clipboard')
73+
return t('files_sharing', 'Copy internal link to clipboard')
7574
},
7675
7776
internalLinkSubtitle() {

‎apps/files_sharing/src/components/SharingEntryLink.vue‎

Lines changed: 11 additions & 48 deletions
Original file line numberDiff line numberDiff line change
@@ -40,11 +40,10 @@
4040
class="sharing-entry__copy">
4141
<NcActionLink :href="shareLink"
4242
target="_blank"
43-
:aria-label="clipboardTooltip"
43+
:title="copyLinkTooltip"
44+
:aria-label="copyLinkTooltip"
4445
:icon="copied && copySuccess ? 'icon-checkmark-color' : 'icon-clippy'"
45-
@click.stop.prevent="copyLink">
46-
{{ clipboardTooltip }}
47-
</NcActionLink>
46+
@click.stop.prevent="copyLink" />
4847
</NcActions>
4948

5049
<!-- pending actions -->
@@ -75,13 +74,8 @@
7574
@uncheck="onPasswordDisable">
7675
{{ t('files_sharing', 'Password protection') }}
7776
</NcActionCheckbox>
77+
7878
<NcActionInput v-if="pendingPassword || share.password"
79-
v-tooltip.auto="{
80-
content: errors.password,
81-
show: errors.password,
82-
trigger: 'manual',
83-
defaultContainer: '#app-sidebar'
84-
}"
8579
class="share-link-password"
8680
:value.sync="share.password"
8781
:disabled="saving"
@@ -131,12 +125,6 @@
131125
<template v-if="share.canEdit && canReshare">
132126
<!-- Custom Label -->
133127
<NcActionInput ref="label"
134-
v-tooltip.auto="{
135-
content: errors.label,
136-
show: errors.label,
137-
trigger: 'manual',
138-
defaultContainer: '.app-sidebar'
139-
}"
140128
:class="{ error: errors.label }"
141129
:disabled="saving"
142130
:label="t('files_sharing', 'Share label')"
@@ -167,14 +155,9 @@
167155
? t('files_sharing', 'Password protection (enforced)')
168156
: t('files_sharing', 'Password protect') }}
169157
</NcActionCheckbox>
158+
170159
<NcActionInput v-if="isPasswordProtected"
171160
ref="password"
172-
v-tooltip.auto="{
173-
content: errors.password,
174-
show: errors.password,
175-
trigger: 'manual',
176-
defaultContainer: '#app-sidebar'
177-
}"
178161
class="share-link-password"
179162
:class="{ error: errors.password}"
180163
:disabled="saving"
@@ -233,14 +216,9 @@
233216
@uncheck="queueUpdate('note')">
234217
{{ t('files_sharing', 'Note to recipient') }}
235218
</NcActionCheckbox>
219+
236220
<NcActionTextEditable v-if="hasNote"
237221
ref="note"
238-
v-tooltip.auto="{
239-
content: errors.note,
240-
show: errors.note,
241-
trigger: 'manual',
242-
defaultContainer: '#app-sidebar'
243-
}"
244222
:class="{ error: errors.note}"
245223
:disabled="saving"
246224
:placeholder="t('files_sharing', 'Enter a note for the share recipient')"
@@ -286,10 +264,10 @@
286264
<!-- Create new share -->
287265
<NcActionButton v-else-if="canReshare"
288266
class="new-share-link"
267+
:title="t('files_sharing', 'Create a new share link')"
268+
:aria-label="t('files_sharing', 'Create a new share link')"
289269
:icon="loading ? 'icon-loading-small' : 'icon-add'"
290-
@click.prevent.stop="onNewLinkShare">
291-
{{ t('files_sharing', 'Create a new share link') }}
292-
</NcActionButton>
270+
@click.prevent.stop="onNewLinkShare" />
293271
</NcActions>
294272

295273
<!-- loading indicator to replace the menu -->
@@ -312,7 +290,6 @@ import NcActionSeparator from '@nextcloud/vue/dist/Components/NcActionSeparator'
312290
import NcActionTextEditable from '@nextcloud/vue/dist/Components/NcActionTextEditable'
313291
import NcActions from '@nextcloud/vue/dist/Components/NcActions'
314292
import NcAvatar from '@nextcloud/vue/dist/Components/NcAvatar'
315-
import Tooltip from '@nextcloud/vue/dist/Directives/Tooltip'
316293
317294
import ExternalShareAction from './ExternalShareAction.vue'
318295
import SharePermissionsEditor from './SharePermissionsEditor.vue'
@@ -337,10 +314,6 @@ export default {
337314
SharePermissionsEditor,
338315
},
339316
340-
directives: {
341-
Tooltip,
342-
},
343-
344317
mixins: [SharesMixin],
345318
346319
props: {
@@ -564,21 +537,12 @@ export default {
564537
return window.location.protocol + '//' + window.location.host + generateUrl('/s/') + this.share.token
565538
},
566539
567-
/**
568-
* Tooltip message for actions button
569-
*
570-
* @return {string}
571-
*/
572-
actionsTooltip() {
573-
return t('files_sharing', 'Actions for "{title}"', { title: this.title })
574-
},
575-
576540
/**
577541
* Tooltip message for copy button
578542
*
579543
* @return {string}
580544
*/
581-
clipboardTooltip() {
545+
copyLinkTooltip() {
582546
if (this.copied) {
583547
if (this.copySuccess) {
584548
return ''
@@ -746,6 +710,7 @@ export default {
746710
// otherwise the user needs to copy/paste the password before finishing the share.
747711
component.copyLink()
748712
}
713+
showSuccess(t('sharing', 'Link share created'))
749714
750715
} catch (data) {
751716
const message = data?.response?.data?.ocs?.meta?.message
@@ -783,7 +748,6 @@ export default {
783748
if (typeof this.share.newLabel === 'string') {
784749
this.share.label = this.share.newLabel
785750
this.$delete(this.share, 'newLabel')
786-
showSuccess(t('files_sharing', 'Share label saved'))
787751
this.queueUpdate('label')
788752
}
789753
},
@@ -851,7 +815,6 @@ export default {
851815
onPasswordSubmit() {
852816
if (this.hasUnsavedPassword) {
853817
this.share.password = this.share.newPassword.trim()
854-
showSuccess(t('files_sharing', 'Share password saved'))
855818
this.queueUpdate('password')
856819
}
857820
},

‎apps/files_sharing/src/components/SharingEntrySimple.vue‎

Lines changed: 1 addition & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,7 @@
2323
<template>
2424
<li class="sharing-entry">
2525
<slot name="avatar" />
26-
<div v-tooltip="tooltip" class="sharing-entry__desc">
26+
<div class="sharing-entry__desc">
2727
<span class="sharing-entry__title">{{ title }}</span>
2828
<p v-if="subtitle">
2929
{{ subtitle }}
@@ -41,7 +41,6 @@
4141

4242
<script>
4343
import NcActions from '@nextcloud/vue/dist/Components/NcActions'
44-
import Tooltip from '@nextcloud/vue/dist/Directives/Tooltip'
4544
4645
export default {
4746
name: 'SharingEntrySimple',
@@ -50,20 +49,12 @@ export default {
5049
NcActions,
5150
},
5251
53-
directives: {
54-
Tooltip,
55-
},
56-
5752
props: {
5853
title: {
5954
type: String,
6055
default: '',
6156
required: true,
6257
},
63-
tooltip: {
64-
type: String,
65-
default: '',
66-
},
6758
subtitle: {
6859
type: String,
6960
default: '',

‎apps/files_sharing/src/mixins/SharesMixin.js‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,7 @@
2525
*
2626
*/
2727

28-
import { showSuccess } from '@nextcloud/dialogs'
28+
import { showError, showSuccess } from '@nextcloud/dialogs'
2929
import { getCurrentUser } from '@nextcloud/auth'
3030
// eslint-disable-next-line import/no-unresolved, node/no-missing-import
3131
import PQueue from 'p-queue'
@@ -212,7 +212,6 @@ export default {
212212
if (this.share.newNote) {
213213
this.share.note = this.share.newNote
214214
this.$delete(this.share, 'newNote')
215-
showSuccess(t('files_sharing', 'Share note saved'))
216215
this.queueUpdate('note')
217216
}
218217
},
@@ -278,10 +277,11 @@ export default {
278277

279278
// clear any previous errors
280279
this.$delete(this.errors, propertyNames[0])
281-
280+
showSuccess(t('files_sharing', 'Share {propertyName} saved', { propertyName: propertyNames[0] }))
282281
} catch ({ message }) {
283282
if (message && message !== '') {
284283
this.onSyncError(propertyNames[0], message)
284+
showError(t('files_sharing', message))
285285
}
286286
} finally {
287287
this.saving = false

‎apps/files_sharing/src/utils/GeneratePassword.js‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -22,6 +22,7 @@
2222

2323
import axios from '@nextcloud/axios'
2424
import Config from '../services/ConfigService'
25+
import { showError, showSuccess } from '@nextcloud/dialogs'
2526

2627
const config = new Config()
2728
// note: some chars removed on purpose to make them human friendly when read out
@@ -40,10 +41,12 @@ export default async function() {
4041
try {
4142
const request = await axios.get(config.passwordPolicy.api.generate)
4243
if (request.data.ocs.data.password) {
44+
showSuccess(t('files_sharing', 'Password created successfully'))
4345
return request.data.ocs.data.password
4446
}
4547
} catch (error) {
4648
console.info('Error generating password from password_policy', error)
49+
showError(t('files_sharing', 'Error generating password from password_policy'))
4750
}
4851
}
4952

‎apps/files_sharing/src/views/SharingInherited.vue‎

Lines changed: 3 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -31,10 +31,9 @@
3131
<div class="avatar-shared icon-more-white" />
3232
</template>
3333
<NcActionButton :icon="showInheritedSharesIcon"
34-
:aria-label="mainTitle"
35-
@click.prevent.stop="toggleInheritedShares">
36-
{{ toggleTooltip }}
37-
</NcActionButton>
34+
:aria-label="toggleTooltip"
35+
:title="toggleTooltip"
36+
@click.prevent.stop="toggleInheritedShares" />
3837
</SharingEntrySimple>
3938

4039
<!-- Inherited shares list -->

‎apps/files_sharing/src/views/SharingTab.vue‎

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -34,9 +34,8 @@
3434
<SharingEntrySimple v-if="isSharedWithMe" v-bind="sharedWithMe" class="sharing-entry__reshare">
3535
<template #avatar>
3636
<NcAvatar :user="sharedWithMe.user"
37-
:display-name="sharedWithMe.displayName"
38-
class="sharing-entry__avatar"
39-
tooltip-message="" />
37+
:title="sharedWithMe.displayName"
38+
class="sharing-entry__avatar" />
4039
</template>
4140
</SharingEntrySimple>
4241

‎dist/files_sharing-files_sharing_tab.js‎

Lines changed: 2 additions & 2 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

0 commit comments

Comments
 (0)