onebox/ui/src/app/app.routes.ts

import { Routes } from '@angular/router';
import { authGuard } from './core/guards/auth.guard';

export const routes: Routes = [
  {
    path: 'login',
    loadComponent: () =>
      import('./features/login/login.component').then((m) => m.LoginComponent),
  },
  {
    path: '',
    loadComponent: () =>
      import('./shared/components/layout/layout.component').then(
        (m) => m.LayoutComponent
      ),
    canActivate: [authGuard],
    children: [
      {
        path: '',
        redirectTo: 'dashboard',
        pathMatch: 'full',
      },
      {
        path: 'dashboard',
        loadComponent: () =>
          import('./features/dashboard/dashboard.component').then(
            (m) => m.DashboardComponent
          ),
      },
      {
        path: 'services',
        children: [
          {
            path: '',
            loadComponent: () =>
              import('./features/services/services-list.component').then(
                (m) => m.ServicesListComponent
              ),
          },
          {
            path: 'create',
            loadComponent: () =>
              import('./features/services/service-create.component').then(
                (m) => m.ServiceCreateComponent
              ),
          },
          {
            path: ':name',
            loadComponent: () =>
              import('./features/services/service-detail.component').then(
                (m) => m.ServiceDetailComponent
              ),
          },
        ],
      },
      {
        path: 'network',
        children: [
          {
            path: '',
            loadComponent: () =>
              import('./features/network/network.component').then(
                (m) => m.NetworkComponent
              ),
          },
          {
            path: 'domains/:domain',
            loadComponent: () =>
              import('./features/domains/domain-detail.component').then(
                (m) => m.DomainDetailComponent
              ),
          },
        ],
      },
      {
        path: 'registries',
        loadComponent: () =>
          import('./features/registries/registries.component').then(
            (m) => m.RegistriesComponent
          ),
      },
      {
        path: 'tokens',
        loadComponent: () =>
          import('./features/tokens/tokens.component').then(
            (m) => m.TokensComponent
          ),
      },
      {
        path: 'settings',
        loadComponent: () =>
          import('./features/settings/settings.component').then(
            (m) => m.SettingsComponent
          ),
      },
    ],
  },
  {
    path: '**',
    redirectTo: 'dashboard',
  },
];