Feature/refactor various routes (part 3) (#4951)

* Refactor various routes

apps/client/src/app/app-routing.module.ts

@@ -1,10 +1,6 @@
 import { AuthGuard } from '@ghostfolio/client/core/auth.guard';
 import { PageTitleStrategy } from '@ghostfolio/client/services/page-title.strategy';
-import {
+import { publicRoutes, internalRoutes } from '@ghostfolio/common/routes/routes';
-  publicRoutes,
-  routes as ghostfolioRoutes,
-  internalRoutes
-} from '@ghostfolio/common/routes/routes';
 
 import { NgModule } from '@angular/core';
 import { RouterModule, Routes, TitleStrategy } from '@angular/router';
@@ -42,8 +38,8 @@ const routes: Routes = [
       import('./pages/api/api-page.component').then(
         (c) => c.GfApiPageComponent
       ),
-    path: ghostfolioRoutes.api,
+    path: internalRoutes.api.path,
-    title: 'Ghostfolio API'
+    title: internalRoutes.api.title
   },
   {
     path: internalRoutes.auth.path,
@@ -89,8 +85,8 @@ const routes: Routes = [
       import('./pages/i18n/i18n-page.component').then(
         (c) => c.GfI18nPageComponent
       ),
-    path: ghostfolioRoutes.i18n,
+    path: internalRoutes.i18n.path,
-    title: $localize`Internationalization`
+    title: internalRoutes.i18n.title
   },
   {
     path: publicRoutes.markets.path,

apps/client/src/app/components/header/header.component.html

@@ -65,8 +65,10 @@
             i18n
             mat-flat-button
             [ngClass]="{
-              'font-weight-bold': currentRoute === routes.adminControl,
+              'font-weight-bold':
-              'text-decoration-underline': currentRoute === routes.adminControl
+                currentRoute === internalRoutes.adminControl.path,
+              'text-decoration-underline':
+                currentRoute === internalRoutes.adminControl.path
             }"
             [routerLink]="routerLinkAdminControl"
             >Admin Control</a
@@ -268,7 +270,9 @@
           <a
             i18n
             mat-menu-item
-            [ngClass]="{ 'font-weight-bold': currentRoute === routes.account }"
+            [ngClass]="{
+              'font-weight-bold': currentRoute === internalRoutes.account.path
+            }"
             [routerLink]="routerLinkAccount"
             >My Ghostfolio</a
           >
@@ -278,7 +282,8 @@
               i18n
               mat-menu-item
               [ngClass]="{
-                'font-weight-bold': currentRoute === routes.adminControl
+                'font-weight-bold':
+                  currentRoute === internalRoutes.adminControl.path
               }"
               [routerLink]="routerLinkAdminControl"
               >Admin Control</a

apps/client/src/app/components/header/header.component.ts

@@ -12,11 +12,7 @@ import { TokenStorageService } from '@ghostfolio/client/services/token-storage.s
 import { UserService } from '@ghostfolio/client/services/user/user.service';
 import { Filter, InfoItem, User } from '@ghostfolio/common/interfaces';
 import { hasPermission, permissions } from '@ghostfolio/common/permissions';
-import {
+import { internalRoutes, publicRoutes } from '@ghostfolio/common/routes/routes';
-  internalRoutes,
-  publicRoutes,
-  routes
-} from '@ghostfolio/common/routes/routes';
 import { DateRange } from '@ghostfolio/common/types';
 import { GfAssistantComponent } from '@ghostfolio/ui/assistant/assistant.component';
 
@@ -100,7 +96,6 @@ export class HeaderComponent implements OnChanges {
   public routerLinkPricing = publicRoutes.pricing.routerLink;
   public routerLinkRegister = publicRoutes.register.routerLink;
   public routerLinkResources = publicRoutes.resources.routerLink;
-  public routes = routes;
 
   private unsubscribeSubject = new Subject<void>();
 

apps/client/src/app/pages/resources/glossary/resources-glossary.component.ts

@@ -1,7 +1,7 @@
 import { DataService } from '@ghostfolio/client/services/data.service';
 import { InfoItem } from '@ghostfolio/common/interfaces';
 import { hasPermission, permissions } from '@ghostfolio/common/permissions';
-import { publicRoutes, routes } from '@ghostfolio/common/routes/routes';
+import { publicRoutes } from '@ghostfolio/common/routes/routes';
 
 import { Component, OnInit } from '@angular/core';
 
@@ -14,10 +14,8 @@ import { Component, OnInit } from '@angular/core';
 export class ResourcesGlossaryPageComponent implements OnInit {
   public hasPermissionForSubscription: boolean;
   public info: InfoItem;
-  public routerLinkResourcesPersonalFinanceTools = [
+  public routerLinkResourcesPersonalFinanceTools =
-    '/' + publicRoutes.resources.path,
+    publicRoutes.resources.subRoutes.personalFinanceTools.routerLink;
-    routes.personalFinanceTools
-  ];
 
   public constructor(private dataService: DataService) {
     this.info = this.dataService.fetchInfo();

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

@@ -1,6 +1,6 @@
 import { AuthGuard } from '@ghostfolio/client/core/auth.guard';
 import { personalFinanceTools } from '@ghostfolio/common/personal-finance-tools';
-import { routes as ghostfolioRoutes } from '@ghostfolio/common/routes/routes';
+import { publicRoutes } from '@ghostfolio/common/routes/routes';
 
 import { NgModule } from '@angular/core';
 import { RouterModule, Routes } from '@angular/router';
@@ -12,7 +12,7 @@ const routes: Routes = [
     canActivate: [AuthGuard],
     component: PersonalFinanceToolsPageComponent,
     path: '',
-    title: $localize`Personal Finance Tools`
+    title: publicRoutes.resources.subRoutes.personalFinanceTools.title
   },
   ...personalFinanceTools.map(({ alias, key, name }) => {
     return {
@@ -24,8 +24,8 @@ const routes: Routes = [
             return GfProductPageComponent;
           }
         ),
-      path: `${ghostfolioRoutes.openSourceAlternativeTo}-${alias ?? key}`,
+      path: `${publicRoutes.resources.subRoutes.personalFinanceTools.subRoutes.product.path}-${alias ?? key}`,
-      title: $localize`Open Source Alternative to ${name}`
+      title: `${publicRoutes.resources.subRoutes.personalFinanceTools.subRoutes.product.title} ${name}`
     };
   })
 ];

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

@@ -1,5 +1,5 @@
 import { personalFinanceTools } from '@ghostfolio/common/personal-finance-tools';
-import { publicRoutes, routes } from '@ghostfolio/common/routes/routes';
+import { publicRoutes } from '@ghostfolio/common/routes/routes';
 
 import { Component, OnDestroy } from '@angular/core';
 import { Subject } from 'rxjs';
@@ -12,8 +12,12 @@ import { Subject } from 'rxjs';
   standalone: false
 })
 export class PersonalFinanceToolsPageComponent implements OnDestroy {
-  public pathAlternativeTo = routes.openSourceAlternativeTo + '-';
+  public pathAlternativeTo =
+    publicRoutes.resources.subRoutes.personalFinanceTools.subRoutes.product
+      .path + '-';
   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' });
   });

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

@@ -32,8 +32,8 @@
                     personalFinanceTool.name
                   }} - {{ personalFinanceTool.slogan }}"
                   [routerLink]="[
-                    pathResources,
+                    '/' + pathResources,
-                    'personal-finance-tools',
+                    pathPersonalFinanceTools,
                     pathAlternativeTo +
                       (personalFinanceTool.alias ?? personalFinanceTool.key)
                   ]"

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

@@ -1,7 +1,7 @@
 import { DataService } from '@ghostfolio/client/services/data.service';
 import { Product } from '@ghostfolio/common/interfaces';
 import { personalFinanceTools } from '@ghostfolio/common/personal-finance-tools';
-import { publicRoutes, routes } from '@ghostfolio/common/routes/routes';
+import { publicRoutes } from '@ghostfolio/common/routes/routes';
 import { translate } from '@ghostfolio/ui/i18n';
 
 import { Component, OnInit } from '@angular/core';
@@ -22,10 +22,8 @@ export class GfProductPageComponent implements OnInit {
   public product2: Product;
   public routerLinkAbout = publicRoutes.about.routerLink;
   public routerLinkFeatures = publicRoutes.features.routerLink;
-  public routerLinkResourcesPersonalFinanceTools = [
+  public routerLinkResourcesPersonalFinanceTools =
-    '/' + publicRoutes.resources.path,
+    publicRoutes.resources.subRoutes.personalFinanceTools.routerLink;
-    routes.personalFinanceTools
-  ];
   public tags: string[];
 
   public constructor(

apps/client/src/app/pages/resources/resources-page-routing.module.ts

@@ -1,8 +1,5 @@
 import { AuthGuard } from '@ghostfolio/client/core/auth.guard';
-import {
+import { publicRoutes } from '@ghostfolio/common/routes/routes';
-  routes as ghostfolioRoutes,
-  publicRoutes
-} from '@ghostfolio/common/routes/routes';
 
 import { NgModule } from '@angular/core';
 import { RouterModule, Routes } from '@angular/router';
@@ -42,13 +39,13 @@ const routes: Routes = [
             (m) => m.ResourcesMarketsModule
           )
       },
-      ...[ghostfolioRoutes.personalFinanceTools].map((path) => ({
+      {
-        path,
+        path: publicRoutes.resources.subRoutes.personalFinanceTools.path,
         loadChildren: () =>
           import(
             './personal-finance-tools/personal-finance-tools-page.module'
           ).then((m) => m.PersonalFinanceToolsPageModule)
-      }))
+      }
     ],
     path: '',
     title: publicRoutes.resources.title

libs/common/src/lib/routes/routes.ts

@@ -2,15 +2,6 @@ import '@angular/localize/init';
 
 import { IRoute } from './interfaces/interfaces';
 
-export const routes = {
-  api: 'api',
-  i18n: 'i18n',
-  personalFinanceTools: 'personal-finance-tools',
-
-  // Publicly accessible pages
-  openSourceAlternativeTo: $localize`:kebab-case:open-source-alternative-to`
-};
-
 export const internalRoutes: Record<string, IRoute> = {
   account: {
     path: 'account',
@@ -62,6 +53,12 @@ export const internalRoutes: Record<string, IRoute> = {
     routerLink: ['/accounts'],
     title: $localize`Accounts`
   },
+  api: {
+    excludeFromAssistant: true,
+    path: 'api',
+    routerLink: ['/api'],
+    title: 'Ghostfolio API'
+  },
   auth: {
     excludeFromAssistant: true,
     path: 'auth',
@@ -95,6 +92,12 @@ export const internalRoutes: Record<string, IRoute> = {
     },
     title: $localize`Overview`
   },
+  i18n: {
+    excludeFromAssistant: true,
+    path: 'i18n',
+    routerLink: ['/i18n'],
+    title: $localize`Internationalization`
+  },
   portfolio: {
     path: 'portfolio',
     routerLink: ['/portfolio'],
@@ -279,6 +282,20 @@ export const publicRoutes = {
           $localize`:kebab-case:markets`
         ],
         title: $localize`Markets`
+      },
+      personalFinanceTools: {
+        path: 'personal-finance-tools',
+        routerLink: [
+          '/' + $localize`:kebab-case:resources`,
+          'personal-finance-tools'
+        ],
+        subRoutes: {
+          product: {
+            path: $localize`:kebab-case:open-source-alternative-to`,
+            title: $localize`Open Source Alternative to`
+          }
+        },
+        title: $localize`Personal Finance Tools`
       }
     },
     title: $localize`Resources`