Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Upgrade HDS dependency to 4.13 & migrate FlightIcon to Hds::Icon #24305

Merged
merged 4 commits into from
Oct 30, 2024
Merged

Upgrade HDS dependency to 4.13 & migrate FlightIcon to Hds::Icon #24305

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
1361c45
upgraded to hds 4.13.0 and migrated FlightIcon instances to Hds::Icon
zamoore Oct 27, 2024
befa2e7
updated test selectors
zamoore Oct 28, 2024
0d8901c
fixing percy regression
zamoore Oct 28, 2024
ffaf17a
Vertically align flyout dismiss button and remove unused hasDivider prop
philrenaud Oct 29, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion ui/app/components/actions-flyout.hbs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -33,7 +33,7 @@
<Hds::ApplicationState as |A|>
<A.Header @title="No actions in queue" />
<A.Body @text="Your actions have been manually cleared. To run more, head to a Job or Task page with actions in its Jobspec, and an Actions dropdown will automatically populate." />
<A.Footer @hasDivider={{true}} as |F|>
<A.Footer as |F|>
<F.LinkStandalone @icon="docs-link" @text="Learn more about Actions" @href="https://developer.hashicorp.com/nomad/docs/job-specification/action" @iconPosition="trailing" />
</A.Footer>
</Hds::ApplicationState>
Expand Down
10 changes: 5 additions & 5 deletions ui/app/components/allocation-service-sidebar.hbs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -18,15 +18,15 @@
{{#if (not-eq @service.provider "consul")}}
<span class="aggregate-status">
{{#if (eq this.aggregateStatus 'Unhealthy')}}
<FlightIcon @name="x-square-fill" @color="#c84034" />
<Hds::Icon @name="x-square-fill" @color="#c84034" @isInline={{true}} />
Unhealthy
{{else if (eq this.aggregateStatus 'Unknown')}}
<Tooltip @text="The parent allocation for this service is not running" @isFullText={{true}}>
<FlightIcon @name="help" @color="#999999" />
<Hds::Icon @name="help" @color="#999999" @isInline={{true}} />
Health Unknown
</Tooltip>
{{else}}
<FlightIcon @name="check-square-fill" @color="#25ba81" />
<Hds::Icon @name="check-square-fill" @color="#25ba81" @isInline={{true}} />
Healthy
{{/if}}
</span>
Expand Down Expand Up @@ -133,10 +133,10 @@
<td class="status">
<span>
{{#if (eq row.model.Status "success")}}
<FlightIcon @name="check-square-fill" @color="#25ba81" />
<Hds::Icon @name="check-square-fill" @color="#25ba81" @isInline={{true}} />
Healthy
{{else if (eq row.model.Status "failure")}}
<FlightIcon @name="x-square-fill" @color="#c84034" />
<Hds::Icon @name="x-square-fill" @color="#c84034" @isInline={{true}} />
Unhealthy
{{else if (eq row.model.Status "pending")}}
Pending
Expand Down
6 changes: 3 additions & 3 deletions ui/app/components/job-status/allocation-status-block.hbs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -45,11 +45,11 @@
{{#if (eq @status "running")}}
<span class="alloc-health-indicator">
{{#if (eq @health "healthy")}}
<FlightIcon @name="check" @color="#25ba81" />
<Hds::Icon @name="check" @color="#25ba81" @isInline={{true}} />
{{else if (eq @health "unhealthy")}}
<FlightIcon @name="x" @color="#c84034" />
<Hds::Icon @name="x" @color="#c84034" @isInline={{true}} />
{{else}}
<FlightIcon @name="running" @color="black" />
<Hds::Icon @name="running" @color="black" @isInline={{true}} />
{{/if}}
</span>
{{/if}}
Expand Down
4 changes: 2 additions & 2 deletions ui/app/components/job-status/failed-or-lost.hbs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@
{{#if @supportsRescheduling}}
<span>
<Hds::TooltipButton @text="Allocations that have been rescheduled, on another node if possible, due to failure or manual restart" aria-label="Info">
<FlightIcon @name="info" />
<Hds::Icon @name="info" @isInline={{true}} />
</Hds::TooltipButton>
<ConditionalLinkTo
@condition={{@rescheduledAllocs.length}}
Expand All @@ -25,7 +25,7 @@

<span>
<Hds::TooltipButton @text="Allocations that have been restarted in-place due to a task failure or manual restart" aria-label="Info">
<FlightIcon @name="info" />
<Hds::Icon @name="info" @isInline={{true}} />
</Hds::TooltipButton>
<ConditionalLinkTo
@condition={{@restartedAllocs.length}}
Expand Down
6 changes: 3 additions & 3 deletions ui/app/components/job-status/individual-allocation.hbs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -23,11 +23,11 @@
{{#if (eq @status "running")}}
<span class="alloc-health-indicator">
{{#if (eq @health "healthy")}}
<FlightIcon @name="check" @color="white" />
<Hds::Icon @name="check" @color="white" @isInline={{true}} />
{{else if (eq @health "unhealthy")}}
<FlightIcon @name="x" @color="white" />
<Hds::Icon @name="x" @color="white" @isInline={{true}} />
{{else}}
<FlightIcon @name="running" @color="white" />
<Hds::Icon @name="running" @color="white" @isInline={{true}} />
{{/if}}
</span>
{{/if}}
Expand Down
2 changes: 1 addition & 1 deletion ui/app/components/job-status/latest-deployment.hbs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@
<LinkTo @route="jobs.job.deployments" @model={{@job}}>
<h4>
Latest Deployment
<FlightIcon @name="arrow-right" />
<Hds::Icon @name="arrow-right" @isInline={{true}} />
</h4>
</LinkTo>
<Hds::Badge @text={{capitalize this.status}} @size="small" @color={{this.statusColor}} @type="filled" />
Expand Down
6 changes: 3 additions & 3 deletions ui/app/components/job-status/panel/deploying.hbs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -140,11 +140,11 @@
<span class="represented-allocation legend-example {{health}}">
<span class="alloc-health-indicator">
{{#if (eq health "healthy")}}
<FlightIcon @name="check" @color="#25ba81" />
<Hds::Icon @name="check" @color="#25ba81" @isInline={{true}} />
{{else if (eq health "unhealthy")}}
<FlightIcon @name="x" @color="#c84034" />
<Hds::Icon @name="x" @color="#c84034" @isInline={{true}} />
{{else}}
<FlightIcon @name="running" @color="black" class="not-animated" />
<Hds::Icon @name="running" @color="black" class="not-animated" @isInline={{true}} />
{{/if}}
</span>
</span>
Expand Down
2 changes: 1 addition & 1 deletion ui/app/components/task-sub-row.hbs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,7 @@
<div class="name-grid">
<LinkTo title={{this.task.name}} class="task-name" @route="allocations.allocation.task" @models={{array this.task.allocation this.task}}>{{this.task.name}}</LinkTo>
<button type="button" class="logs-sidebar-trigger button is-borderless is-inline is-compact" onclick={{action "handleTaskLogsClick" this.task}}>
<FlightIcon @name="logs" />View Logs
<Hds::Icon @name="logs" @isInline={{true}} />View Logs
</button>
</div>
</td>
Expand Down
4 changes: 2 additions & 2 deletions ui/app/components/variable-paths.hbs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -27,7 +27,7 @@
}}
>
<span>
<FlightIcon @name="folder" />
<Hds::Icon @name="folder" @isInline={{true}} />
<LinkTo @route="variables.path" @model={{folder.data.absolutePath}} @query={{hash namespace="*"}}>
{{trim-path folder.name}}
</LinkTo>
Expand All @@ -48,7 +48,7 @@
}}
>
<B.Td>
<FlightIcon @name="file-text" />
<Hds::Icon @name="file-text" @isInline={{true}} />
{{#if (can "read variable" path=file.absoluteFilePath namespace=file.variable.namespace)}}
<LinkTo
@route="variables.variable"
Expand Down
10 changes: 8 additions & 2 deletions ui/app/styles/components/actions.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -60,18 +60,24 @@
animation-fill-mode: both;
}

& > .hds-flyout__header {
& .hds-flyout__header {
position: relative;
z-index: $z-base;
.hds-flyout__title {

.hds-flyout__title .hds-text {
display: flex;
align-items: center;
gap: 1rem;
justify-content: space-between;

h3 {
flex-grow: 1;
}
}

.hds-dismiss-button {
align-self: center;
}
}

.hds-application-state {
Expand Down
2 changes: 1 addition & 1 deletion ui/app/styles/components/job-status-panel.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -423,7 +423,7 @@
}
}

.legend-item .represented-allocation .flight-icon {
.legend-item .represented-allocation .hds-icon {
animation: none;
}

Expand Down
2 changes: 1 addition & 1 deletion ui/app/templates/administration/policies/policy.hbs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -58,7 +58,7 @@
<h3>Create Tokens from the Nomad CLI</h3>
</div>
<div class="boxed-section-body">
<p>When you're ready to create more tokens, you can do so via the <a class="external-link" href="https://developer.hashicorp.com/nomad/docs/commands" target="_blank" rel="noopener noreferrer">Nomad CLI <FlightIcon @name="external-link" /></a> with the following:
<p>When you're ready to create more tokens, you can do so via the <a class="external-link" href="https://developer.hashicorp.com/nomad/docs/commands" target="_blank" rel="noopener noreferrer">Nomad CLI <Hds::Icon @name="external-link" @isInline={{true}} /></a> with the following:
<pre>
<code>{{this.newTokenString}}</code>
<CopyButton
Expand Down
2 changes: 1 addition & 1 deletion ui/app/templates/administration/roles/role.hbs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -59,7 +59,7 @@
<h3>Create Tokens from the Nomad CLI</h3>
</div>
<div class="boxed-section-body">
<p>When you're ready to create more tokens, you can do so via the <a class="external-link" href="https://developer.hashicorp.com/nomad/docs/commands" target="_blank" rel="noopener noreferrer">Nomad CLI <FlightIcon @name="external-link" /></a> with the following:
<p>When you're ready to create more tokens, you can do so via the <a class="external-link" href="https://developer.hashicorp.com/nomad/docs/commands" target="_blank" rel="noopener noreferrer">Nomad CLI <Hds::Icon @name="external-link" @isInline={{true}} /></a> with the following:
<pre>
<code>{{this.newTokenString}}</code>
<CopyButton
Expand Down
6 changes: 3 additions & 3 deletions ui/app/templates/allocations/allocation/index.hbs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -311,11 +311,11 @@
>
<td class="is-narrow">
{{#if (eq row.model.provider "nomad")}}
<FlightIcon @name="nomad-color" />
<Hds::Icon @name="nomad-color" @isInline={{true}} />
{{else}}
<FlightIcon @name="consul-color" />
<Hds::Icon @name="consul-color" @isInline={{true}} />
{{#if row.model.connect}}
<FlightIcon @name="mesh" @color="#444444" />
<Hds::Icon @name="mesh" @color="#444444" @isInline={{true}} />
{{/if}}
{{/if}}
</td>
Expand Down
4 changes: 2 additions & 2 deletions ui/app/templates/clients/client/index.hbs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -186,7 +186,7 @@
aria-label="More information"
class="is-faded"
>
<FlightIcon @name="info" />
<Hds::Icon @name="info" @isInline={{true}} />
</Hds::TooltipButton>
<span
data-test-node-id
Expand Down Expand Up @@ -440,7 +440,7 @@
aria-label="More information"
class="is-faded"
>
<FlightIcon @name="info" />
<Hds::Icon @name="info" @isInline={{true}} />
</Hds::TooltipButton>

</div>
Expand Down
6 changes: 3 additions & 3 deletions ui/app/templates/components/job-service-row.hbs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,10 +19,10 @@
}}
>
{{#if (eq @service.provider "nomad")}}
<FlightIcon @name="nomad-color" />
<Hds::Icon @name="nomad-color" @isInline={{true}} />
<LinkTo class="is-primary" @route="jobs.job.services.service" @model={{@service}} @query={{hash level=@service.level}}>{{@service.name}}</LinkTo>
{{else}}
<FlightIcon @name="consul-color" />
<Hds::Icon @name="consul-color" @isInline={{true}} />
{{#if (and (eq @service.provider "consul") this.consulRedirectLink)}}
<a class="is-primary" href={{this.consulRedirectLink}} target="_blank" rel="noopener noreferrer">
{{@service.name}}
Expand All @@ -31,7 +31,7 @@
{{@service.name}}
{{/if}}
{{#if @service.connect}}
<FlightIcon @name="mesh" @color="#444444" />
<Hds::Icon @name="mesh" @color="#444444" @isInline={{true}} />
{{/if}}
{{/if}}
</td>
Expand Down
4 changes: 2 additions & 2 deletions ui/app/templates/components/scale-events-accordion.hbs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -33,9 +33,9 @@
to
{{a.item.count}}" aria-label="More information">
{{#if a.item.increased}}
<FlightIcon @name="arrow-up" />
<Hds::Icon @name="arrow-up" @isInline={{true}} />
{{else}}
<FlightIcon @name="arrow-down" />
<Hds::Icon @name="arrow-down" @isInline={{true}} />
{{/if}}
</Hds::TooltipButton>
<span data-test-count>
Expand Down
2 changes: 1 addition & 1 deletion ui/app/templates/components/task-row.hbs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@
<td class="is-narrow">
{{#unless this.task.driverStatus.healthy}}
<Hds::TooltipButton data-test-icon="unhealthy-driver" @text="{{this.task.driver}} is unhealthy" aria-label="More information">
<FlightIcon @name="alert-triangle" />
<Hds::Icon @name="alert-triangle" @isInline={{true}} />
</Hds::TooltipButton>
{{/unless}}
</td>
Expand Down
4 changes: 2 additions & 2 deletions ui/app/templates/components/topo-viz/node.hbs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,15 +12,15 @@
@text="Client is draining"
aria-label="Client is draining"
>
<FlightIcon @name="clock" />
<Hds::Icon @name="clock" @isInline={{true}} />
</Hds::TooltipButton>
{{else if (not @node.node.isEligible)}}
<Hds::TooltipButton
data-test-status-icon
@text="Client is ineligible"
aria-label="Client is ineligible"
>
<FlightIcon @name="lock" />
<Hds::Icon @name="lock" @isInline={{true}} />
</Hds::TooltipButton>
{{/if}}
<LinkTo @route="clients.client" @model={{@node.node.id}} {{hds-tooltip "Node Name"}}>{{@node.node.name}}</LinkTo>
Expand Down
8 changes: 4 additions & 4 deletions ui/app/templates/jobs/index.hbs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -342,7 +342,7 @@
/>
{{/if}}
</A.Body>
<A.Footer @hasDivider={{true}} as |F|>
<A.Footer as |F|>
<Hds::Button
@text="Reset Filters"
@color="tertiary"
Expand All @@ -353,7 +353,7 @@

<F.LinkStandalone @icon="docs" @text="Learn more about Filter Expressions" @href="https://developer.hashicorp.com/nomad/api-docs#creating-expressions" @iconPosition="trailing" />

<F.LinkStandalone @icon="plus" @text="Run a New Job" @route="jobs.run"
<F.LinkStandalone @icon="plus" @text="Run a New Job" @route="jobs.run"
@iconPosition="trailing" />

</A.Footer>
Expand All @@ -362,8 +362,8 @@
<A.Body
@text="No jobs found."
/>
<A.Footer @hasDivider={{true}} as |F|>
<F.LinkStandalone @icon="plus" @text="Run a New Job" @route="jobs.run"
<A.Footer as |F|>
<F.LinkStandalone @icon="plus" @text="Run a New Job" @route="jobs.run"
@iconPosition="trailing" />
</A.Footer>
{{/if}}
Expand Down
2 changes: 1 addition & 1 deletion ui/app/templates/jobs/job/services/service.hbs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@
<section class="section service-list">
<h1 class="title">
<LinkTo class="back-link" @route="jobs.job.services">
<FlightIcon @name="chevron-left" @title="Back to services" @size="24" />
<Hds::Icon @name="chevron-left" @title="Back to services" @size="24" @isInline={{true}} />
</LinkTo>
{{this.model.name}}
</h1>
Expand Down
5 changes: 1 addition & 4 deletions ui/app/templates/variables/variable/index.hbs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -125,10 +125,7 @@
}}

>
<FlightIcon
@name={{if B.data.isVisible "eye" "eye-off"}}
@title={{if B.data.isVisible "Hide Value" "Show Value"}}
/>
<Hds::Icon @name={{if B.data.isVisible "eye" "eye-off"}} @title={{if B.data.isVisible "Hide Value" "Show Value"}} @isInline={{true}} />
</button>

{{#if B.data.isVisible}}
Expand Down
1 change: 0 additions & 1 deletion ui/ember-cli-build.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -40,7 +40,6 @@ module.exports = function (defaults) {
precision: 4,
includePaths: [
'./node_modules/@hashicorp/design-system-tokens/dist/products/css',
'./node_modules/@hashicorp/ember-flight-icons/dist/styles',
'./node_modules/@hashicorp/design-system-components/dist/styles',
],
},
Expand Down
3 changes: 1 addition & 2 deletions ui/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -167,8 +167,7 @@
},
"dependencies": {
"@babel/helper-string-parser": "^7.19.4",
"@hashicorp/design-system-components": "^4.3.0",
"@hashicorp/ember-flight-icons": "^5.0.2",
"@hashicorp/design-system-components": "^4.13.0",
"@percy/cli": "^1.30.0",
"@percy/ember": "^4.2.0",
"curved-arrows": "^0.1.0",
Expand Down
4 changes: 1 addition & 3 deletions ui/tests/acceptance/variables-test.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -410,9 +410,7 @@ module('Acceptance | variables', function (hooks) {
await typeIn('[data-test-path-input]', 'foo/bar');
await clickToggle('[data-test-variable-namespace-filter]');
assert
.dom(
'[data-test-variable-namespace-filter] .hds-menu-primitive__content'
)
.dom('[data-test-variable-namespace-filter] .hds-dropdown__content')
.exists('Namespace can be edited.');
assert
.dom('[data-test-variable-namespace-filter]')
Expand Down
2 changes: 1 addition & 1 deletion ui/tests/pages/clients/list.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,7 @@ const heliosFacet = (scope) => ({
scope,
toggle: clickable('button'),
options: collection(
'.hds-menu-primitive__content .hds-dropdown__content .hds-dropdown__list .hds-dropdown-list-item--variant-checkbox',
'.hds-dropdown__content .hds-dropdown__list .hds-dropdown-list-item--variant-checkbox',
{
toggle: clickable('label'),
count: text('label .hds-dropdown-list-item__count'),
Expand Down
2 changes: 1 addition & 1 deletion ui/tests/pages/components/topo-viz/node.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -31,7 +31,7 @@ export default (scope) => ({

label: text('[data-test-label]'),
labelIsPresent: isPresent('[data-test-label]'),
statusIcon: attribute('class', '[data-test-status-icon] .flight-icon'),
statusIcon: attribute('class', '[data-test-status-icon] .hds-icon'),
statusIconLabel: attribute('aria-label', '[data-test-status-icon]'),

selectNode: clickable('[data-test-node-background]'),
Expand Down
Loading
Loading