diff --git a/libs/common/src/lib/helper.spec.ts b/libs/common/src/lib/helper.spec.ts index 58ac417c4a..1f1be4edd2 100644 --- a/libs/common/src/lib/helper.spec.ts +++ b/libs/common/src/lib/helper.spec.ts @@ -6,6 +6,7 @@ import { canApplyFiltersToAccess, extractNumberFromString, getCountryCodeFromCurrency, + getEmojiFlag, getNumberFormatGroup, getStringOrNull, getStringOrUndefined, @@ -122,6 +123,25 @@ describe('Helper', () => { }); }); + describe('Get emoji flag', () => { + it('Country code', () => { + expect(getEmojiFlag('US')).toEqual('πŸ‡ΊπŸ‡Έ'); + expect(getEmojiFlag('us')).toEqual('πŸ‡ΊπŸ‡Έ'); + }); + + it('European Union code', () => { + expect(getEmojiFlag('EU')).toEqual('πŸ‡ͺπŸ‡Ί'); + }); + + it('Invalid country code', () => { + expect(getEmojiFlag('XX')).toEqual(''); + }); + + it('Empty country code', () => { + expect(getEmojiFlag('')).toEqual(''); + }); + }); + describe('Get number format group', () => { let languageGetter: jest.SpyInstance; diff --git a/libs/common/src/lib/helper.ts b/libs/common/src/lib/helper.ts index f0f9e979cc..2dde25ad1c 100644 --- a/libs/common/src/lib/helper.ts +++ b/libs/common/src/lib/helper.ts @@ -11,6 +11,7 @@ import { } from '@prisma/client'; import { Big } from 'big.js'; import { isISO4217CurrencyCode, isUUID } from 'class-validator'; +import { countries } from 'countries-list'; import { getDate, getMonth, @@ -64,6 +65,8 @@ export const DATE_FORMAT = 'yyyy-MM-dd'; export const DATE_FORMAT_MONTHLY = 'MMMM yyyy'; export const DATE_FORMAT_YEARLY = 'yyyy'; +const VALID_COUNTRY_CODES = new Set([...Object.keys(countries), 'EU']); + // Settings which describe the person looking at the screen rather than the // portfolio being looked at. They stay with the authenticated user while // impersonating. Every other setting follows the impersonated user. @@ -438,15 +441,15 @@ export function getDateWithTimeFormatString(aLocale?: string) { } export function getEmojiFlag(aCountryCode: string) { - if (!aCountryCode) { - return aCountryCode; + const countryCode = aCountryCode?.toUpperCase(); + + if (!countryCode || !VALID_COUNTRY_CODES.has(countryCode)) { + return ''; } - return aCountryCode - .toUpperCase() - .replace(/./g, (character) => - String.fromCodePoint(127397 + character.charCodeAt(0)) - ); + return countryCode.replace(/./g, (character) => + String.fromCodePoint(127397 + character.charCodeAt(0)) + ); } export function getLocale() { diff --git a/libs/ui/src/lib/entity-logo/entity-logo.component.html b/libs/ui/src/lib/entity-logo/entity-logo.component.html index 0aadaa8e8b..6a486e2125 100644 --- a/libs/ui/src/lib/entity-logo/entity-logo.component.html +++ b/libs/ui/src/lib/entity-logo/entity-logo.component.html @@ -1,4 +1,4 @@ -@if (countryCode) { +@if (emojiFlag) { } @else if (src && !hasError) { diff --git a/libs/ui/src/lib/entity-logo/entity-logo.component.ts b/libs/ui/src/lib/entity-logo/entity-logo.component.ts index c78e12489f..70a44e824d 100644 --- a/libs/ui/src/lib/entity-logo/entity-logo.component.ts +++ b/libs/ui/src/lib/entity-logo/entity-logo.component.ts @@ -27,11 +27,10 @@ export class GfEntityLogoComponent implements OnChanges { @Input() tooltip: string; @Input() url: string; + public emojiFlag = ''; public hasError = false; public src?: string; - public readonly getEmojiFlag = getEmojiFlag; - public constructor( private readonly imageSourceService: EntityLogoImageSourceService ) {} @@ -39,6 +38,8 @@ export class GfEntityLogoComponent implements OnChanges { public ngOnChanges() { this.hasError = false; + this.emojiFlag = getEmojiFlag(this.countryCode); + if (this.dataSource && this.symbol) { this.src = this.imageSourceService.getLogoUrlByAssetProfileIdentifier({ dataSource: this.dataSource,