mirrors/vault
1
0
Fork 0
mirror of https://github.com/hashicorp/vault.git synced 2026-01-06 17:21:36 +01:00
Code Issues Projects Releases Wiki Activity

Tool Tip Styling Issue (#14064)

Browse Source 
* updates dropdown transform codemod to apply @defaultClass arg to Content component

* runs codemod and transforms class to @defaultClass on basic dropdown Content component

* adds changelog entry

* removes changelog entry
This commit is contained in:
Jordan Reimer 2022-02-15 10:43:37 -07:00 committed by GitHub
parent 1cde29f9f8
commit 856235abb9
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
29 changed files with 58 additions and 64 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
ui/app/templates/components/calendar-widget.hbs
View File

@ -9,7 +9,7 @@
{{@endTimeDisplay}}
<Chevron @direction="down" @isButton={{true}} />
</D.Trigger>
<D.Content class="popup-menu-content calendar-content">
<D.Content @defaultClass="popup-menu-content calendar-content">
<nav class="box menu">
<div class="calendar-title is-subtitle-gray">DATE OPTIONS</div>
<ul class="menu-list">

4
ui/app/templates/components/clients/history.hbs
View File

@ -152,7 +152,7 @@
{{or this.startMonth "Month"}}
<Chevron @direction="down" @isButton={{true}} />
</D.Trigger>
<D.Content class="popup-menu-content is-wide">
<D.Content @defaultClass="popup-menu-content is-wide">
<nav class="box menu scroll">
<ul class="menu-list">
{{#each this.months as |month|}}
@ -177,7 +177,7 @@
{{or this.startYear "Year"}}
<Chevron @direction="down" @isButton={{true}} />
</D.Trigger>
<D.Content class="popup-menu-content is-wide">
<D.Content @defaultClass="popup-menu-content is-wide">
<nav class="box menu">
<ul class="menu-list">
{{#each this.years as |year|}}

2
ui/app/templates/components/console/command-input.hbs
View File

@ -19,7 +19,7 @@
/>
</button>
</d.Trigger>
<d.Content class="tool-tip">
<d.Content @defaultClass="tool-tip">
<div class="box">
{{#if this.isFullscreen}}
Minimize

2
ui/app/templates/components/database-role-edit.hbs
View File

@ -121,7 +121,7 @@
Save
</button>
</T.Trigger>
<T.Content class="tool-tip">
<T.Content @defaultClass="tool-tip">
<div class="box">
You don't have permissions required to
{{if (eq @mode "create") "create" "update"}}

4
ui/app/templates/components/date-dropdown.hbs
View File

@ -7,7 +7,7 @@
{{or this.startMonth "Month"}}
<Chevron @direction="down" @isButton={{true}} />
</D.Trigger>
<D.Content class="popup-menu-content is-wide">
<D.Content @defaultClass="popup-menu-content is-wide">
<nav class="box menu scroll">
<ul class="menu-list">
{{#each this.months as |month|}}
@ -32,7 +32,7 @@
{{or this.startYear "Year"}}
<Chevron @direction="down" @isButton={{true}} />
</D.Trigger>
<D.Content class="popup-menu-content is-wide">
<D.Content @defaultClass="popup-menu-content is-wide">
<nav class="box menu">
<ul class="menu-list">
{{#each this.years as |year|}}

4
ui/app/templates/components/diff-version-selector.hbs
View File

@ -11,7 +11,7 @@
{{or this.leftSideVersionSelected @model.currentVersion}}
<Chevron @direction="down" @isButton={{true}} />
</D.Trigger>
<D.Content class="popup-menu-content">
<D.Content @defaultClass="popup-menu-content">
<nav class="box menu">
<ul class="menu-list">
{{#each (reverse @model.versions) as |leftSideSecretVersion|}}
@ -54,7 +54,7 @@
{{or this.rightSideVersionSelected this.rightSideVersionInit}}
<Chevron @direction="down" @isButton={{true}} />
</D.Trigger>
<D.Content class="popup-menu-content">
<D.Content @defaultClass="popup-menu-content">
<nav class="box menu">
<ul class="menu-list">
{{#each (reverse @model.versions) as |rightSideSecretVersion|}}

2
ui/app/templates/components/hover-copy-button.hbs
View File

@ -9,7 +9,7 @@
<Icon @name="clipboard-copy" aria-label="Copy" />
</CopyButton>
</T.Trigger>
<T.Content class="tool-tip">
<T.Content @defaultClass="tool-tip">
<div class="box" data-test-hover-copy-tooltip-text>
{{this.tooltipText}}
</div>

2
ui/app/templates/components/namespace-picker.hbs
View File

@ -19,7 +19,7 @@
{{/if}}
<Chevron @direction="down" @class="has-text-white auto-width is-status-chevron" />
</D.Trigger>
<D.Content class="namespace-picker-content">
<D.Content @defaultClass="namespace-picker-content">
<div class="is-mobile level-left">
{{#unless this.isUserRootNamespace}}
<NamespaceLink

2
ui/app/templates/components/raft-storage-overview.hbs
View File

@ -16,7 +16,7 @@
Snapshots
<Chevron @direction="down" @isButton={{true}} />
</D.Trigger>
<D.Content class="popup-menu-content">
<D.Content @defaultClass="popup-menu-content">
<nav class="box menu">
<ul class="menu-list">
<li class="action">

2
ui/app/templates/components/secret-edit-toolbar.hbs
View File

@ -42,7 +42,7 @@
Copy
<Chevron @direction="down" @isButton={{true}} />
</D.Trigger>
<D.Content class="popup-menu-content is-wide">
<D.Content @defaultClass="popup-menu-content is-wide">
<nav class="box menu">
<ul class="menu-list">
<li class="action">

2
ui/app/templates/components/secret-form-show.hbs
View File

@ -51,7 +51,7 @@
Version created
{{date-format @modelForData.createdTime "MMM dd, yyyy hh:mm a"}}
</T.Trigger>
<T.Content class="tool-tip smaller-font">
<T.Content @defaultClass="tool-tip smaller-font">
<div class="box" data-test-hover-copy-tooltip-text>
{{@modelForData.createdTime}}
</div>

2
ui/app/templates/components/secret-list/transform-list-item.hbs
View File

@ -55,7 +55,7 @@
<T.Trigger @tabindex={{false}}>
{{@item.id}}
</T.Trigger>
<T.Content class="tool-tip">
<T.Content @defaultClass="tool-tip">
<div class="box">
This is a built-in HashiCorp
{{@itemType}}. It can't be viewed or edited.

2
ui/app/templates/components/secret-version-menu.hbs
View File

@ -8,7 +8,7 @@
{{@version.version}}
<Chevron @direction="down" @isButton={{true}} />
</D.Trigger>
<D.Content class="popup-menu-content">
<D.Content @defaultClass="popup-menu-content">
<nav class="box menu">
<ul class="menu-list">
{{#if (has-block)}}

2
ui/app/templates/components/status-menu.hbs
View File

@ -11,7 +11,7 @@
</div>
<Chevron @direction="down" class="has-text-white is-status-chevron" />
</d.Trigger>
<d.Content class={{concat "status-menu-content status-menu-content-" this.type}}>
<d.Content @defaultClass={{concat "status-menu-content status-menu-content-" this.type}}>
{{#if (eq this.type "user")}}
{{#if (and this.cluster.name this.auth.currentToken)}}
<AuthInfo @activeClusterName={{this.cluster.name}} @onLinkClick={{action this.onLinkClick}} />

2
ui/app/templates/components/transformation-edit.hbs
View File

@ -33,7 +33,7 @@
Delete transformation
</button>
</T.Trigger>
<T.Content class="tool-tip">
<T.Content @defaultClass="tool-tip">
<div class="box">
This transformation is in use by a role and can’t be deleted.
</div>

2
ui/app/templates/components/wizard-content.hbs
View File

@ -21,7 +21,7 @@
<T.Trigger @tabindex="-1">
<WizardProgress @currentFeatureProgress={{this.currentFeatureProgress}} @progressBar={{this.progressBar}} />
</T.Trigger>
<T.Content class="tool-tip">
<T.Content @defaultClass="tool-tip">
<div class="box">
{{#if this.currentTutorialProgress}}
{{this.currentTutorialProgress.text}}

2
ui/app/templates/vault/cluster/access/methods.hbs
View File

@ -34,7 +34,7 @@
class="has-text-grey-light"
/>
</T.Trigger>
<T.Content class="tool-tip">
<T.Content @defaultClass="tool-tip">
<div class="box">
{{method.methodType}}
</div>

4
ui/app/templates/vault/cluster/secrets/backend/versions.hbs
View File

@ -60,7 +60,7 @@
Created
{{date-format list.item.createdTime "MMM dd, yyyy hh:mm a"}}
</T.Trigger>
<T.Content class="tool-tip smaller-font">
<T.Content @defaultClass="tool-tip smaller-font">
<div class="box" data-test-hover-copy-tooltip-text>
{{list.item.createdTime}}
</div>
@ -78,7 +78,7 @@
>
<Icon @name="more-horizontal" aria-label="More options" class="has-text-black auto-width" />
</D.Trigger>
<D.Content class="popup-menu-content">
<D.Content @defaultClass="popup-menu-content">
<nav class="box menu">
<ul class="menu-list">
<li class="action">

2
ui/lib/core/addon/components/autocomplete-input.hbs
View File

@ -12,7 +12,7 @@
{{on "input" this.onInput}}
/>
<BasicDropdown @registerAPI={{fn (mut this.dropdownAPI)}} @renderInPlace={{true}} as |D|>
<D.Content class="autocomplete-input">
<D.Content @defaultClass="autocomplete-input">
{{#each @options as |option|}}
<div class="autocomplete-input-option" role="button" {{on "click" (fn this.selectOption option.value)}}>
{{option.label}}

4
ui/lib/core/addon/components/info-table-row.hbs
View File

@ -11,7 +11,7 @@
<T.Trigger @tabindex={{false}}>
<span class="is-label has-text-grey-dark" data-test-row-label={{@label}}>{{@label}}</span>
</T.Trigger>
<T.Content class="tool-tip">
<T.Content @defaultClass="tool-tip">
<div class="box fit-content" data-test-label-tooltip>
{{@label}}
</div>
@ -65,7 +65,7 @@
<T.Trigger @tabindex={{false}}>
<span class="is-word-break has-text-black" data-test-row-value={{this.label}}>{{this.value}}</span>
</T.Trigger>
<T.Content class="tool-tip">
<T.Content @defaultClass="tool-tip">
<CopyButton
@clipboardText={{@tooltipText}}
@success={{action (set-flash-message "Data copied!")}}

2
ui/lib/core/addon/templates/components/box-radio.hbs
View File

@ -21,7 +21,7 @@
/>
</label>
</T.Trigger>
<T.Content class="tool-tip">
<T.Content @defaultClass="tool-tip">
<div class="box">
{{@tooltipMessage}}
</div>

2
ui/lib/core/addon/templates/components/confirm-action.hbs
View File

@ -18,7 +18,7 @@
<Chevron @direction={{if this.showConfirm "up" "down"}} />
{{/if}}
</d.Trigger>
<d.Content class="popup-menu-content">
<d.Content @defaultClass="popup-menu-content">
<div class="box confirm-action-message">
<div class="message is-highlight">
<div class="message-title">

6
ui/lib/core/addon/templates/components/info-tooltip.hbs
View File

@ -1,13 +1,13 @@
<ToolTip as |d|>
<d.Trigger
@tagName="button"
@htmlTag="button"
@type="button"
@class="tool-tip-trigger button is-ghost is-compact"
class="tool-tip-trigger button is-ghost is-compact"
data-test-tool-tip-trigger={{true}}
>
<Icon @name="info" class="auto-width" aria-label="help" />
</d.Trigger>
<d.Content @class="tool-tip">
<d.Content @defaultClass="tool-tip">
<div class="box">
{{yield}}
</div>

2
ui/lib/core/addon/templates/components/linkable-item/content.hbs
View File

@ -5,7 +5,7 @@
<T.Trigger>
<Icon @name={{@glyph}} class="has-text-grey-light" data-test-linkable-item-glyph />
</T.Trigger>
<T.Content class="tool-tip">
<T.Content @defaultClass="tool-tip">
<div class="box">
{{or @glyphText @title}}
</div>

2
ui/lib/core/addon/templates/components/popup-menu.hbs
View File

@ -6,7 +6,7 @@
>
<Icon @name="more-horizontal" class="has-text-black auto-width" aria-label="More options" />
</d.Trigger>
<d.Content class={{concat "popup-menu-content " this.contentClass}}>
<d.Content @defaultClass={{concat "popup-menu-content " this.contentClass}}>
<div class="box">
{{yield}}
</div>

2
ui/lib/core/addon/templates/components/replication-secondary-card.hbs
View File

@ -55,7 +55,7 @@
<T.Trigger>
<Icon @name="check-circle" class="has-text-success" data-test-glyph />
</T.Trigger>
<T.Content class="tool-tip">
<T.Content @defaultClass="tool-tip">
<div class="box">
Everything is in sync
</div>

2
ui/lib/core/addon/templates/components/toolbar-link.hbs
View File

@ -29,7 +29,7 @@
<Icon @name={{this.glyph}} data-test-icon={{this.glyph}} />
</LinkToComponent>
</T.Trigger>
<T.Content class="tool-tip smaller-font">
<T.Content @defaultClass="tool-tip smaller-font">
<div class="box" data-test-disabled-tooltip>
{{this.disabledTooltip}}
</div>

2
ui/lib/core/addon/templates/components/ttl-picker2.hbs
View File

@ -14,7 +14,7 @@
<T.Trigger data-test-tooltip-trigger tabindex="-1">
<Icon @name="info" aria-label="description" />
</T.Trigger>
<T.Content class="tool-tip">
<T.Content @defaultClass="tool-tip">
<div class="box" data-test-hover-copy-tooltip-text>
{{this.description}}
</div>

52
ui/scripts/codemods/dropdown-transform.js
View File

@ -8,37 +8,31 @@
*/
module.exports = () => {
const evalTag = (tag, prefix) => {
switch (tag) {
case `${prefix}.trigger`:
return `${prefix}.Trigger`;
case `${prefix}.content`:
return `${prefix}.Content`;
}
};
// remove @ symbol from class and change @tagName to @htmlTag
const transformAttrs = (attrs) => {
attrs.forEach((attr) => {
if (attr.name === '@class') {
attr.name = 'class';
} else if (attr.name.includes('tagName')) {
attr.name = '@htmlTag';
}
});
};
return {
ElementNode(node) {
// BasicDropdown and Tooltip components yield variable is either d, dd, or T
const prefixes = ['d', 'D', 'dd', 'T'];
// capitalize trigger and content and transform attributes
for (let i = 0; i < prefixes.length; i++) {
const newTag = evalTag(node.tag, prefixes[i]);
if (newTag) {
node.tag = newTag;
transformAttrs(node.attributes);
break;
}
// ensure we have the right parent node by first looking for BasicDropdown or ToolTip nodes
if (['BasicDropdown', 'ToolTip'].includes(node.tag)) {
node.children.forEach((child) => {
// capitalize trigger and content and transform attributes
if (child.type === 'ElementNode' && child.tag.match(/\.(content|trigger)/gi)) {
const { tag } = child;
const char = tag.charAt(tag.indexOf('.') + 1);
child.tag = tag.replace(char, char.toUpperCase());
// remove @ symbol from class and change @tagName to @htmlTag
// Content component does not use splattributes -- apply class with @defaultClass arg
child.attributes.forEach((attr) => {
if (attr.name.includes('class')) {
if (child.tag.includes('Content')) {
attr.name = '@defaultClass';
} else if (attr.name === '@class') {
attr.name = 'class';
}
} else if (attr.name.includes('tagName')) {
attr.name = '@htmlTag';
}
});
}
});
}
},
};