Update icon-map to work for auth methods

This commit is contained in:
wenincode 2022-10-25 07:14:55 -06:00
parent d1019c25ce
commit 19e99f0188
6 changed files with 46 additions and 31 deletions

View File

@ -1,3 +1,9 @@
<span class="consul-auth-method-type {{@item.Type}}" data-test-type={{@item.Type}}>
{{t (concat "common.brand." @item.Type)}}
</span>
{{#let (icon-mapping @item.Type) as |flightIcon|}}
{{log flightIcon}}
<span class="consul-auth-method-type {{unless flightIcon @item.Type}}" data-test-type={{@item.Type}}>
{{#if flightIcon}}
<FlightIcon @name={{flightIcon}} class="mr-1.5 w-4 h-4" />
{{/if}}
{{t (concat "common.brand." @item.Type)}}
</span>
{{/let}}

View File

@ -8,7 +8,7 @@
class="consul-external-source"
...attributes
>
<FlightIcon @name={{external-source-icon-map externalSource}} class="mr-1.5 w-3 h-3" />
<FlightIcon @name={{icon-mapping externalSource}} class="mr-1.5 w-4 h-4" />
Registered via {{t (concat "common.brand." externalSource)}}
</span>
</dt>
@ -36,7 +36,7 @@
class="consul-external-source"
...attributes
>
<FlightIcon @name={{external-source-icon-map externalSource}} class="mr-1.5 h-3 w-3" />
<FlightIcon @name={{icon-mapping externalSource}} class="mr-1.5 h-4 w-4" />
{{#if @label}}
{{@label}}
{{else}}

View File

@ -29,9 +29,9 @@
// .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.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

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

View File

@ -1,19 +0,0 @@
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

@ -0,0 +1,28 @@
import { helper } from '@ember/component/helper';
const ICON_MAPPING = {
kubernetes: 'kubernetes-color',
terraform: 'terraform-color',
nomad: 'nomad-color',
consul: 'consul-color',
'consul-api-gateway': 'consul-color',
vault: 'vault',
aws: 'aws-color',
'aws-iam': 'aws-color',
lambda: 'aws-lambda-color',
};
/**
* Takes a icon name, usually an external-source/auth-method-type, and maps it to a flight-icon name or returns undefined
* if the icon is not currently mapped to a flight-icon name. This is particularly useful when dealing with converting icons to
* use the `<FlightIcon>` component directly instead of our own css. If the icon is not available with `<FlightIcon>` you can leave
* it out of the mapping and handle it in the undefined case.
*
* @param {string} icon
* @returns {string|undefined}
*/
function iconMapping([icon]) {
return ICON_MAPPING[icon];
}
export default helper(iconMapping);