Feature/reuse routes in app component (#4878)

* Reuse routes

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

@@ -3,7 +3,11 @@ import { HoldingDetailDialogParams } from '@ghostfolio/client/components/holding
 import { getCssVariable } from '@ghostfolio/common/helper';
 import { InfoItem, User } from '@ghostfolio/common/interfaces';
 import { hasPermission, permissions } from '@ghostfolio/common/permissions';
-import { publicRoutes, routes } from '@ghostfolio/common/routes';
+import {
+  internalRoutes,
+  publicRoutes,
+  routes
+} from '@ghostfolio/common/routes';
 import { ColorScheme } from '@ghostfolio/common/types';
 
 import { DOCUMENT } from '@angular/common';
@@ -160,10 +164,13 @@ export class AppComponent implements OnDestroy, OnInit {
         this.currentSubRoute = urlSegments[1]?.path;
 
         if (
-          ((this.currentRoute === 'home' && !this.currentSubRoute) ||
-            (this.currentRoute === 'home' &&
-              this.currentSubRoute === 'holdings') ||
-            (this.currentRoute === 'portfolio' && !this.currentSubRoute)) &&
+          ((this.currentRoute === internalRoutes.home.path &&
+            !this.currentSubRoute) ||
+            (this.currentRoute === internalRoutes.home.path &&
+              this.currentSubRoute ===
+                internalRoutes.home.subRoutes.holdings.path) ||
+            (this.currentRoute === internalRoutes.portfolio.path &&
+              !this.currentSubRoute)) &&
           this.user?.settings?.viewMode !== 'ZEN'
         ) {
           this.hasPermissionToChangeDateRange = true;
@@ -172,14 +179,19 @@ export class AppComponent implements OnDestroy, OnInit {
         }
 
         if (
-          (this.currentRoute === 'home' &&
-            this.currentSubRoute === 'holdings') ||
-          (this.currentRoute === 'portfolio' && !this.currentSubRoute) ||
-          (this.currentRoute === 'portfolio' &&
-            this.currentSubRoute === 'activities') ||
-          (this.currentRoute === 'portfolio' &&
-            this.currentSubRoute === 'allocations') ||
-          (this.currentRoute === 'zen' && this.currentSubRoute === 'holdings')
+          (this.currentRoute === internalRoutes.home.path &&
+            this.currentSubRoute ===
+              internalRoutes.home.subRoutes.holdings.path) ||
+          (this.currentRoute === internalRoutes.portfolio.path &&
+            !this.currentSubRoute) ||
+          (this.currentRoute === internalRoutes.portfolio.path &&
+            this.currentSubRoute ===
+              internalRoutes.portfolio.subRoutes.activities.path) ||
+          (this.currentRoute === internalRoutes.portfolio.path &&
+            this.currentSubRoute === routes.allocations) ||
+          (this.currentRoute === internalRoutes.zen.path &&
+            this.currentSubRoute ===
+              internalRoutes.home.subRoutes.holdings.path)
         ) {
           this.hasPermissionToChangeFilters = true;
         } else {
@@ -187,25 +199,25 @@ export class AppComponent implements OnDestroy, OnInit {
         }
 
         this.hasTabs =
-          (this.currentRoute === this.routerLinkAbout[0].slice(1) ||
-            this.currentRoute === this.routerLinkFaq[0].slice(1) ||
-            this.currentRoute === this.routerLinkResources[0].slice(1) ||
-            this.currentRoute === 'account' ||
-            this.currentRoute === 'admin' ||
-            this.currentRoute === 'home' ||
-            this.currentRoute === 'portfolio' ||
-            this.currentRoute === 'zen') &&
+          (this.currentRoute === routes.about ||
+            this.currentRoute === routes.faq ||
+            this.currentRoute === routes.resources ||
+            this.currentRoute === routes.account ||
+            this.currentRoute === routes.adminControl ||
+            this.currentRoute === internalRoutes.home.path ||
+            this.currentRoute === internalRoutes.portfolio.path ||
+            this.currentRoute === internalRoutes.zen.path) &&
           this.deviceType !== 'mobile';
 
         this.showFooter =
-          (this.currentRoute === 'blog' ||
-            this.currentRoute === this.routerLinkFeatures[0].slice(1) ||
-            this.currentRoute === this.routerLinkMarkets[0].slice(1) ||
-            this.currentRoute === 'open' ||
-            this.currentRoute === 'p' ||
-            this.currentRoute === this.routerLinkPricing[0].slice(1) ||
-            this.currentRoute === this.routerLinkRegister[0].slice(1) ||
-            this.currentRoute === 'start') &&
+          (this.currentRoute === routes.blog ||
+            this.currentRoute === routes.features ||
+            this.currentRoute === routes.markets ||
+            this.currentRoute === publicRoutes.openStartup.path ||
+            this.currentRoute === routes.public ||
+            this.currentRoute === routes.pricing ||
+            this.currentRoute === publicRoutes.register.path ||
+            this.currentRoute === routes.start) &&
           this.deviceType !== 'mobile';
 
         if (this.deviceType === 'mobile') {