Add previous and next navigation

apps/client/src/app/pages/resources/personal-finance-tools/personal-finance-tools-page.component.ts

@@ -23,9 +23,8 @@ export class PersonalFinanceToolsPageComponent {
   public pathResources = publicRoutes.resources.path;
   public pathPersonalFinanceTools =
     publicRoutes.resources.subRoutes.personalFinanceTools.path;
-  public personalFinanceTools = personalFinanceTools.sort((a, b) => {
-    return a.name.localeCompare(b.name, undefined, { sensitivity: 'base' });
-  });
+
+  public personalFinanceTools = personalFinanceTools;
   public routerLinkAbout = publicRoutes.about.routerLink;
 
   public constructor() {

apps/client/src/app/pages/resources/personal-finance-tools/product-page.component.ts

@@ -99,11 +99,11 @@ export class GfProductPageComponent {
   protected readonly titlePrefix = $localize`The Open Source Alternative to`;
 
   protected readonly nextProduct = computed(() => {
-    return this.sortedPersonalFinanceTools[this.getCurrentProductIndex() + 1];
+    return personalFinanceTools[this.getCurrentProductIndex() + 1];
   });
 
   protected readonly previousProduct = computed(() => {
-    return this.sortedPersonalFinanceTools[this.getCurrentProductIndex() - 1];
+    return personalFinanceTools[this.getCurrentProductIndex() - 1];
   });
 
   protected readonly tags = computed<string[]>(() => {
@@ -151,12 +151,6 @@ export class GfProductPageComponent {
   private readonly dataService = inject(DataService);
   private readonly route = inject(ActivatedRoute);
 
-  private readonly sortedPersonalFinanceTools = [...personalFinanceTools].sort(
-    (a, b) => {
-      return a.name.localeCompare(b.name, undefined, { sensitivity: 'base' });
-    }
-  );
-
   protected getProductRouterLink(product?: Product) {
     if (!product) {
       return this.routerLinkResourcesPersonalFinanceTools;
@@ -173,7 +167,7 @@ export class GfProductPageComponent {
   }
 
   private getCurrentProductIndex() {
-    return this.sortedPersonalFinanceTools.findIndex(({ key }) => {
+    return personalFinanceTools.findIndex(({ key }) => {
       return key === this.product2().key;
     });
   }

libs/common/src/lib/personal-finance-tools.ts

@@ -1,6 +1,7 @@
 import { Product } from '@ghostfolio/common/interfaces';
 
-export const personalFinanceTools: Product[] = [
+export const personalFinanceTools: Product[] = (
+  [
     {
       categories: ['BUDGETING'],
       hasFreePlan: true,
@@ -215,7 +216,8 @@ export const personalFinanceTools: Product[] = [
       isArchived: true,
       key: 'basil-finance',
       name: 'Basil Finance',
-    slogan: 'The ultimate solution for tracking and managing your investments',
+      slogan:
+        'The ultimate solution for tracking and managing your investments',
       url: 'https://basil.fi'
     },
     {
@@ -1536,7 +1538,8 @@ export const personalFinanceTools: Product[] = [
       name: 'My Stocks Portfolio & Market',
       platforms: ['ANDROID', 'IOS'],
       pricingPerYear: '$49.99',
-    slogan: 'Keep track of and visualize your investments throughout your day',
+      slogan:
+        'Keep track of and visualize your investments throughout your day',
       url: 'https://peeksoft.co'
     },
     {
@@ -1607,7 +1610,8 @@ export const personalFinanceTools: Product[] = [
       origin: 'CA',
       platforms: ['ANDROID', 'IOS', 'WEB'],
       pricingPerYear: '$75',
-    slogan: 'Everything you own. Everything you owe. Everything in one place.',
+      slogan:
+        'Everything you own. Everything you owe. Everything in one place.',
       url: 'https://neontra.com'
     },
     {
@@ -2011,7 +2015,8 @@ export const personalFinanceTools: Product[] = [
       key: 'sharescope',
       name: 'ShareScope',
       origin: 'GB',
-    slogan: 'Award-winning investment, trading and portfolio management tools',
+      slogan:
+        'Award-winning investment, trading and portfolio management tools',
       url: 'https://www.sharescope.co.uk'
     },
     {
@@ -2718,4 +2723,7 @@ export const personalFinanceTools: Product[] = [
       slogan: 'Your solution for investing success',
       url: 'https://ziggma.com'
     }
-];
+  ] satisfies Product[]
+).sort((a, b) => {
+  return a.name.localeCompare(b.name, undefined, { sensitivity: 'base' });
+});