Add tooltip/ariaLabel for New Button if user has permissions #5155
Conversation
|
Thanks for opening this pull request! The maintainers of this repository would appreciate it if you would create a changelog item based on your changes. |
| if (!this.canUpload) { | ||
| return this.$gettext('You have no permission to upload!') | ||
| } | ||
| if (!this.hasFreeSpace) { | ||
| return this.$gettext('You have not enough space left to upload!') | ||
| } | ||
| return null | ||
| return "Add files or folders" |
There was a problem hiding this comment.
This now adds a tooltip for a non-error case as well. IMO not good. Looks like it's required to separate into two different computed props, one for the tooltip and one for the aria-label.
There was a problem hiding this comment.
Please check the solution I went for and let me know if you like it!
pascalwengerter
force-pushed
the
26052021_add-create-btn-tooltip
branch
from
6460a4c to
7795fad
Compare
| if (isToolTip === true) { | ||
| return null | ||
| } | ||
| return 'Add files or folders' |
| } | ||
| return null | ||
| newButtonTooltip() { | ||
| return this.newButtonDescription(true) |
There was a problem hiding this comment.
newButtonTooltip() could do what we had before:
if (!this.canUpload) {
return this.$gettext('You have no permission to upload!')
}
if (!this.hasFreeSpace) {
return this.$gettext('You have not enough space left to upload!')
}
return null| newButtonTooltip() { | ||
| return this.newButtonDescription(true) | ||
| }, | ||
| newButtonAriaLabel() { |
There was a problem hiding this comment.
... and newButtonAriaLabel() could then do the following:
const tooltip = this.newButtonTooltip
if (tooltip) {
return tooltip
}
return this.$gettext('Add files or folders')| @@ -306,6 +300,19 @@ export default { | |||
| this.createModal(modal) | |||
| }, | |||
|
|
|||
| newButtonDescription(isToolTip) { | |||
There was a problem hiding this comment.
While this is totally fine technically, it is hard to read in the location where it's called. this.newButtonDescription(true) or this.newButtonDescription(false) doesn't give a hint what effect the boolean has on the output. I'd prefer a solution without the boolean, as pointed out in the two comments above.
pascalwengerter
force-pushed
the
26052021_add-create-btn-tooltip
branch
from
7795fad to
854f1fc
Compare
Description
Add tooltip/ariaLabel for New Button if user has permissions to upload/create resources