diff --git a/frontend/src/app/app.routes.ts b/frontend/src/app/app.routes.ts
index 364dfd7..3261775 100644
--- a/frontend/src/app/app.routes.ts
+++ b/frontend/src/app/app.routes.ts
@@ -9,9 +9,6 @@ import { ImportWizardComponent } from './components/import/import-wizard-compone
import { MonthlyComparisonComponent } from './components/analytics/monthly-comparison-component/monthly-comparison-component';
import { TrackingComponent } from './components/tracking/tracking/tracking.component';
import { DashboardComponent } from './components/dashboard-component/dashboard-component.component';
-import { HomeLayoutComponent } from './layouts/home-layout/home-layout.component';
-import { MovementsLayoutComponent } from './layouts/movements-layout/movements-layout.component';
-import { AnalyticsLayoutComponent } from './layouts/analytics-layout/analytics-layout.component';
export const routes: Routes = [
{ path: '', redirectTo: 'login', pathMatch: 'full' },
@@ -19,7 +16,6 @@ export const routes: Routes = [
{ path: 'register', component: RegisterComponent, data: { breadcrumb: 'Register' } },
{
path: 'home',
- component: HomeLayoutComponent,
canActivate: [authenticateGuard],
data: { breadcrumb: 'Home' },
children: [
@@ -30,7 +26,6 @@ export const routes: Routes = [
},
{
path: 'movements',
- component: MovementsLayoutComponent,
canActivate: [authenticateGuard],
data: { breadcrumb: 'Movements' },
children: [
@@ -41,7 +36,6 @@ export const routes: Routes = [
},
{
path: 'analytics',
- component: AnalyticsLayoutComponent,
canActivate: [authenticateGuard],
data: { breadcrumb: 'Analytics' },
children: [
diff --git a/frontend/src/app/components/side-nav-component/side-nav-component.html b/frontend/src/app/components/side-nav-component/side-nav-component.html
index 2835caa..ca11f05 100644
--- a/frontend/src/app/components/side-nav-component/side-nav-component.html
+++ b/frontend/src/app/components/side-nav-component/side-nav-component.html
@@ -103,7 +103,7 @@
-
+
@if (themeService.isDarkMode()) {
light_mode
@@ -129,7 +129,7 @@
settings
Settings
-
+
logout
Logout
diff --git a/frontend/src/app/components/side-nav-component/side-nav-component.ts b/frontend/src/app/components/side-nav-component/side-nav-component.ts
index 8993cbf..d5e5c85 100644
--- a/frontend/src/app/components/side-nav-component/side-nav-component.ts
+++ b/frontend/src/app/components/side-nav-component/side-nav-component.ts
@@ -1,4 +1,5 @@
-import { ChangeDetectionStrategy, Component, inject, OnInit, signal } from '@angular/core';
+import { ChangeDetectionStrategy, Component, inject, signal } from '@angular/core';
+import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
import { MatIconButton } from '@angular/material/button';
import { MatIcon } from '@angular/material/icon';
import { MatListItem, MatListItemIcon, MatListItemTitle, MatNavList } from '@angular/material/list';
@@ -44,7 +45,7 @@ import { BreadcrumbComponent } from '../ui-library/breadcrumb/breadcrumb.compone
styleUrl: './side-nav-component.css',
changeDetection: ChangeDetectionStrategy.OnPush,
})
-export class SideNavComponent implements OnInit {
+export class SideNavComponent {
private readonly accountService = inject(AccountService);
private readonly router = inject(Router);
protected readonly themeService = inject(ThemeService);
@@ -54,13 +55,16 @@ export class SideNavComponent implements OnInit {
protected readonly movementsExpanded = signal(false);
protected readonly analyticsExpanded = signal(false);
- ngOnInit(): void {
+ constructor() {
// Set initial state based on current route
this.updateExpandedPanels(this.router.url);
// Listen to route changes and update expanded panels
this.router.events
- .pipe(filter((event): event is NavigationEnd => event instanceof NavigationEnd))
+ .pipe(
+ filter((event): event is NavigationEnd => event instanceof NavigationEnd),
+ takeUntilDestroyed()
+ )
.subscribe((event: NavigationEnd) => {
this.updateExpandedPanels(event.urlAfterRedirects);
});
diff --git a/frontend/src/app/components/ui-library/breadcrumb/breadcrumb.component.ts b/frontend/src/app/components/ui-library/breadcrumb/breadcrumb.component.ts
index 80aa071..f9d40b0 100644
--- a/frontend/src/app/components/ui-library/breadcrumb/breadcrumb.component.ts
+++ b/frontend/src/app/components/ui-library/breadcrumb/breadcrumb.component.ts
@@ -1,4 +1,5 @@
import { Component, inject, signal } from '@angular/core';
+import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
import { MatChipsModule } from '@angular/material/chips';
import { FlexComponent } from '../flex-component/flex-component';
import { Router, ActivatedRoute, NavigationEnd, RouterModule } from '@angular/router';
@@ -23,9 +24,14 @@ export class BreadcrumbComponent {
constructor() {
// Update breadcrumbs on navigation
- this.router.events.pipe(filter((event) => event instanceof NavigationEnd)).subscribe(() => {
- this.breadcrumbs.set(this.createBreadcrumbs(this.activatedRoute.root));
- });
+ this.router.events
+ .pipe(
+ filter((event) => event instanceof NavigationEnd),
+ takeUntilDestroyed()
+ )
+ .subscribe(() => {
+ this.breadcrumbs.set(this.createBreadcrumbs(this.activatedRoute.root));
+ });
// Initial load
this.breadcrumbs.set(this.createBreadcrumbs(this.activatedRoute.root));
diff --git a/frontend/src/app/layouts/analytics-layout/analytics-layout.component.ts b/frontend/src/app/layouts/analytics-layout/analytics-layout.component.ts
deleted file mode 100644
index a206ac7..0000000
--- a/frontend/src/app/layouts/analytics-layout/analytics-layout.component.ts
+++ /dev/null
@@ -1,9 +0,0 @@
-import { Component } from '@angular/core';
-import { RouterOutlet } from '@angular/router';
-
-@Component({
- selector: 'app-analytics-layout',
- imports: [RouterOutlet],
- template: '',
-})
-export class AnalyticsLayoutComponent {}
diff --git a/frontend/src/app/layouts/home-layout/home-layout.component.ts b/frontend/src/app/layouts/home-layout/home-layout.component.ts
deleted file mode 100644
index 1de1d9a..0000000
--- a/frontend/src/app/layouts/home-layout/home-layout.component.ts
+++ /dev/null
@@ -1,9 +0,0 @@
-import { Component } from '@angular/core';
-import { RouterOutlet } from '@angular/router';
-
-@Component({
- selector: 'app-home-layout',
- imports: [RouterOutlet],
- template: '',
-})
-export class HomeLayoutComponent {}
diff --git a/frontend/src/app/layouts/movements-layout/movements-layout.component.ts b/frontend/src/app/layouts/movements-layout/movements-layout.component.ts
deleted file mode 100644
index 6ee29e7..0000000
--- a/frontend/src/app/layouts/movements-layout/movements-layout.component.ts
+++ /dev/null
@@ -1,9 +0,0 @@
-import { Component } from '@angular/core';
-import { RouterOutlet } from '@angular/router';
-
-@Component({
- selector: 'app-movements-layout',
- imports: [RouterOutlet],
- template: '',
-})
-export class MovementsLayoutComponent {}