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.

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

Backport of Upgrade HDS dependency to 4.13 & migrate FlightIcon to Hds::Icon into release/1.9.x #24336

Open
wants to merge 1 commit into
base: release/1.9.x
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
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
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
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
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
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
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
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
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
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
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
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
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
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
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
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
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
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 [email protected]}}>{{@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
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
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
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
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
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
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
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
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
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
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
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