Use FlightIcon component for external sources

This commit is contained in:
wenincode 2022-10-24 13:39:28 -06:00
parent d714003dda
commit d1019c25ce
6 changed files with 68 additions and 32 deletions

View File

@ -5,9 +5,10 @@
<dt>
<span
data-test-external-source={{externalSource}}
class="consul-external-source {{externalSource}}"
class="consul-external-source"
...attributes
>
<FlightIcon @name={{external-source-icon-map externalSource}} class="mr-1.5 w-3 h-3" />
Registered via {{t (concat "common.brand." externalSource)}}
</span>
</dt>
@ -32,9 +33,10 @@
{{else if externalSource}}
<span
data-test-external-source={{externalSource}}
class="consul-external-source {{externalSource}}"
class="consul-external-source"
...attributes
>
<FlightIcon @name={{external-source-icon-map externalSource}} class="mr-1.5 h-3 w-3" />
{{#if @label}}
{{@label}}
{{else}}

View File

@ -6,32 +6,32 @@
--icon-size: icon-300;
}
.consul-external-source.kubernetes::before {
@extend %with-logo-kubernetes-color-icon, %as-pseudo;
}
.consul-external-source.terraform::before {
@extend %with-logo-terraform-color-icon, %as-pseudo;
}
.consul-external-source.nomad::before {
@extend %with-logo-nomad-color-icon, %as-pseudo;
}
.consul-external-source.consul::before,
.consul-external-source.consul-api-gateway::before {
@extend %with-logo-consul-color-icon, %as-pseudo;
}
.consul-external-source.vault::before {
@extend %with-vault-300;
}
.consul-external-source.lambda::before,
.consul-external-source.aws::before {
@extend %with-aws-300;
}
.consul-external-source.leader::before {
@extend %with-star-outline-mask, %as-pseudo;
}
.consul-external-source.jwt::before {
@extend %with-logo-jwt-color-icon, %as-pseudo;
}
// .consul-external-source.kubernetes::before {
// @extend %with-logo-kubernetes-color-icon, %as-pseudo;
// }
// .consul-external-source.terraform::before {
// @extend %with-logo-terraform-color-icon, %as-pseudo;
// }
// .consul-external-source.nomad::before {
// @extend %with-logo-nomad-color-icon, %as-pseudo;
// }
// .consul-external-source.consul::before,
// .consul-external-source.consul-api-gateway::before {
// @extend %with-logo-consul-color-icon, %as-pseudo;
// }
// .consul-external-source.vault::before {
// @extend %with-vault-300;
// }
// .consul-external-source.lambda::before,
// .consul-external-source.aws::before {
// @extend %with-aws-300;
// }
// .consul-external-source.leader::before {
// @extend %with-star-outline-mask, %as-pseudo;
// }
// .consul-external-source.jwt::before {
// @extend %with-logo-jwt-color-icon, %as-pseudo;
// }
.consul-external-source.oidc::before {
@extend %with-logo-oidc-color-icon, %as-pseudo;
}

View File

@ -30,9 +30,9 @@ span.policy-service-identity::before {
%pill.oidc::before {
@extend %with-logo-oidc-color-icon, %as-pseudo;
}
%pill.kubernetes::before {
@extend %with-logo-kubernetes-color-icon, %as-pseudo;
}
// %pill.kubernetes::before {
// @extend %with-logo-kubernetes-color-icon, %as-pseudo;
// }
%pill.aws-iam::before {
--icon-name: icon-aws-color;
content: '';

View File

@ -0,0 +1,19 @@
import { helper } from '@ember/component/helper';
const EXTERNAL_SOURCE_ICON_MAP = {
kubernetes: 'kubernetes-color',
terraform: 'terraform-color',
nomad: 'nomad-color',
consul: 'consul-color',
'consul-api-gateway': 'consul-color',
vault: 'vault',
jwt: 'jwt-color',
aws: 'aws-color',
lambda: 'aws-lambda-color',
};
function externalSourceIconMap([icon]) {
return EXTERNAL_SOURCE_ICON_MAP[icon];
}
export default helper(externalSourceIconMap);

View File

@ -70,7 +70,7 @@
"@hashicorp/design-system-components": "^1.0.4",
"@hashicorp/design-system-tokens": "^1.0.0",
"@hashicorp/ember-cli-api-double": "^4.0.0",
"@hashicorp/ember-flight-icons": "^2.0.12",
"@hashicorp/ember-flight-icons": "^3.0.0",
"@html-next/vertical-collection": "^4.0.0",
"@lit/reactive-element": "^1.2.1",
"@xstate/fsm": "^1.4.0",

View File

@ -3315,11 +3315,26 @@
ember-cli-babel "^7.26.11"
ember-cli-htmlbars "^6.0.1"
"@hashicorp/ember-flight-icons@^3.0.0":
version "3.0.0"
resolved "https://registry.yarnpkg.com/@hashicorp/ember-flight-icons/-/ember-flight-icons-3.0.0.tgz#fddeb8adfb036aa3573c55b7236b34172b49cba9"
integrity sha512-+QrV38Ix9dWLwMzdVcMcSmFfeSVGvWvB+3OVBq3ltOTmnoLPIAx8LT9UDZUZ1wa65ciO+a1YzLMmwWnQgX/r9Q==
dependencies:
"@hashicorp/flight-icons" "^2.11.0"
ember-auto-import "^2.4.1"
ember-cli-babel "^7.26.11"
ember-cli-htmlbars "^6.0.1"
"@hashicorp/flight-icons@^2.10.0":
version "2.10.0"
resolved "https://registry.yarnpkg.com/@hashicorp/flight-icons/-/flight-icons-2.10.0.tgz#24b03043bacda16e505200e6591dfef896ddacf1"
integrity sha512-jYUA0M6Tz+4RAudil+GW/fHbhZPcKCiIZZAguBDviqbLneMkMgPOBgbXWCGWsEQ1fJzP2cXbUaio8L0aQZPWQw==
"@hashicorp/flight-icons@^2.11.0":
version "2.11.0"
resolved "https://registry.yarnpkg.com/@hashicorp/flight-icons/-/flight-icons-2.11.0.tgz#1500be99a42ee8512e7caece4bdae60ce8790577"
integrity sha512-teFkUY2di63JZ2gsegQgS+3f5YEP+GPuycB1Z2O+weInIrL33Ds0/J+lxFCmi2vkPAeY5xOnsclHYnhU6xOSmA==
"@html-next/vertical-collection@^4.0.0":
version "4.0.0"
resolved "https://registry.yarnpkg.com/@html-next/vertical-collection/-/vertical-collection-4.0.0.tgz#b3b3d52358e15e7ed46e028d12424dab994690ed"