diff --git a/apps/client/src/app/pages/resources/personal-finance-tools/product-page.component.ts b/apps/client/src/app/pages/resources/personal-finance-tools/product-page.component.ts index 91d3ef16f..2ff73fea0 100644 --- a/apps/client/src/app/pages/resources/personal-finance-tools/product-page.component.ts +++ b/apps/client/src/app/pages/resources/personal-finance-tools/product-page.component.ts @@ -22,7 +22,31 @@ export class GfProductPageComponent implements OnInit { return subscriptionOffer?.price; }); - protected product1: Product; + protected readonly product1 = computed(() => ({ + founded: 2021, + hasFreePlan: true, + hasSelfHostingAbility: true, + isOpenSource: true, + key: 'ghostfolio', + languages: [ + 'Chinese (简体中文)', + 'Deutsch', + 'English', + 'Español', + 'Français', + 'Italiano', + 'Korean (한국어)', + 'Nederlands', + 'Português', + 'Türkçe' + ], + name: 'Ghostfolio', + origin: getCountryName({ code: 'CH' }), + regions: [$localize`Global`], + slogan: 'Open Source Wealth Management', + useAnonymously: true + })); + protected product2: Product; protected readonly routerLinkAbout = publicRoutes.about.routerLink; protected readonly routerLinkFeatures = publicRoutes.features.routerLink; @@ -34,31 +58,6 @@ export class GfProductPageComponent implements OnInit { private readonly route = inject(ActivatedRoute); public ngOnInit() { - this.product1 = { - founded: 2021, - hasFreePlan: true, - hasSelfHostingAbility: true, - isOpenSource: true, - key: 'ghostfolio', - languages: [ - 'Chinese (简体中文)', - 'Deutsch', - 'English', - 'Español', - 'Français', - 'Italiano', - 'Korean (한국어)', - 'Nederlands', - 'Português', - 'Türkçe' - ], - name: 'Ghostfolio', - origin: getCountryName({ code: 'CH' }), - regions: [$localize`Global`], - slogan: 'Open Source Wealth Management', - useAnonymously: true - }; - const product = personalFinanceTools.find(({ key }) => { return key === this.route.snapshot.data['key']; }); @@ -80,8 +79,8 @@ export class GfProductPageComponent implements OnInit { } this.tags = [ - this.product1.name, - this.product1.origin, + this.product1().name, + this.product1().origin, this.product2.name, this.product2.origin, $localize`Alternative`, diff --git a/apps/client/src/app/pages/resources/personal-finance-tools/product-page.html b/apps/client/src/app/pages/resources/personal-finance-tools/product-page.html index 4badaa959..aafafa5ca 100644 --- a/apps/client/src/app/pages/resources/personal-finance-tools/product-page.html +++ b/apps/client/src/app/pages/resources/personal-finance-tools/product-page.html @@ -70,24 +70,24 @@ - {{ product1.slogan }} + {{ product1().slogan }} {{ product2.slogan }} Founded - {{ product1.founded }} + {{ product1().founded }} {{ product2.founded }} Origin - {{ product1.origin }} + {{ product1().origin }} {{ product2.origin }} Region @for ( - region of product1.regions; + region of product1().regions; track region; let isLast = $last ) { @@ -110,7 +110,7 @@ @for ( - language of product1.languages; + language of product1().languages; track language; let isLast = $last ) { @@ -132,18 +132,18 @@ Open Source Software - @if (product1.isOpenSource) { + @if (product1().isOpenSource) { ✅ Yes } @else { ❌ No } @@ -171,18 +171,18 @@ Self-Hosting - @if (product1.hasSelfHostingAbility === true) { + @if (product1().hasSelfHostingAbility === true) { ✅ Yes - } @else if (product1.hasSelfHostingAbility === false) { + } @else if (product1().hasSelfHostingAbility === false) { ❌ No } @@ -210,18 +210,18 @@ Use anonymously - @if (product1.useAnonymously === true) { + @if (product1().useAnonymously === true) { ✅ Yes - } @else if (product1.useAnonymously === false) { + } @else if (product1().useAnonymously === false) { ❌ No } @@ -249,18 +249,18 @@ Free Plan - @if (product1.hasFreePlan === true) { + @if (product1().hasFreePlan === true) { ✅ Yes - } @else if (product1.hasFreePlan === false) { + } @else if (product1().hasFreePlan === false) { ❌ No } @@ -297,10 +297,10 @@ } - @if (product1.note || product2.note) { + @if (product1().note || product2.note) { Notes - {{ product1.note }} + {{ product1().note }} {{ product2.note }} }