chore: update routing

Author: yanmariomenev

examples-standalone/kendoangular-landing-page/src/app/app.component.html

@@ -1 +1 @@
-<app-header></app-header>
+<router-outlet></router-outlet>

examples-standalone/kendoangular-landing-page/src/app/app.component.ts

@@ -1,18 +1,28 @@
-import { Component, ViewEncapsulation } from '@angular/core';
-import { RouterOutlet, RouterLink, RouterLinkActive } from '@angular/router';
+import { Component, ViewEncapsulation } from "@angular/core";
+import { RouterOutlet, RouterLink, RouterLinkActive } from "@angular/router";
 import { SchedulerComponent } from "./components/scheduler/scheduler.component";
-import { DynamicGridComponent } from './components/dynamic-grid/dynamic-grid.component';
-import { ChartsComponent } from './components/charts/charts.component';
-import { HeaderComponent } from './components/header/header.component';
+import { DynamicGridComponent } from "./components/dynamic-grid/dynamic-grid.component";
+import { ChartsComponent } from "./components/charts/charts.component";
+import { HeaderComponent } from "./components/header/header.component";
+import { MyLayoutComponent } from "./components/layout/my-layout.component";
+import { ConversationalUiComponent } from "./components/conversational-ui/conversational-ui.component";
 
 @Component({
-  selector: 'app-root',
-  encapsulation: ViewEncapsulation.None,
-  standalone: true,
-  imports: [RouterOutlet, RouterLink, RouterLinkActive, SchedulerComponent, DynamicGridComponent, ChartsComponent, HeaderComponent],
-  templateUrl: './app.component.html',
-  styleUrl: './app.component.css'
+    selector: "app-root",
+    encapsulation: ViewEncapsulation.None,
+    standalone: true,
+    imports: [
+        RouterOutlet,
+        RouterLink,
+        RouterLinkActive,
+        SchedulerComponent,
+        DynamicGridComponent,
+        ChartsComponent,
+        HeaderComponent,
+        MyLayoutComponent,
+        ConversationalUiComponent,
+    ],
+    templateUrl: "./app.component.html",
+    styleUrl: "./app.component.css",
 })
-export class AppComponent {
-
-}
+export class AppComponent {}

examples-standalone/kendoangular-landing-page/src/app/app.routes.ts

@@ -1,15 +1,43 @@
-import { Routes } from '@angular/router';
-import { TransactionsDashboardComponent } from './components/header/transactions-dashboard/transactions-dashboard.component';
-import { BottomLeftComponent } from './components/header/bottom-left/bottom-left.component';
-import { BottomRightComponent } from './components/header/bottom-right/bottom-right.component';
-import { DynamicGridComponent } from './components/dynamic-grid/dynamic-grid.component';
+import { Routes } from "@angular/router";
 
 export const routes: Routes = [
-    { path: 'dashboard', component: TransactionsDashboardComponent },
-    { path: 'transactions', component: TransactionsDashboardComponent },
-    { path: 'bottom-left', component: BottomLeftComponent },
-    { path: 'bottom-right', component: BottomRightComponent },
-    { path: 'grid', component: DynamicGridComponent },
-    { path: 'home', redirectTo: 'dashboard', pathMatch: 'full' },
-    { path: '', redirectTo: 'dashboard', pathMatch: 'full' },
+    {
+        path: "grid",
+        loadComponent: () =>
+            import("./components/dynamic-grid/dynamic-grid.component").then((m) => m.DynamicGridComponent),
+    },
+    {
+        path: "scheduler",
+        loadComponent: () => import("./components/scheduler/scheduler.component").then((m) => m.SchedulerComponent),
+    },
+    {
+        path: "charts",
+        loadComponent: () => import("./components/charts/charts.component").then((m) => m.ChartsComponent),
+    },
+    {
+        path: "header",
+        loadComponent: () => import("./components/header/header.component").then((m) => m.HeaderComponent),
+    },
+    {
+        path: "dateinputs",
+        loadComponent: () =>
+            import("./components/date-inputs/date-inputs.component").then((m) => m.DateInputsComponent),
+    },
+    {
+        path: "dropdowns",
+        loadComponent: () => import("./components/dropdowns/dropdowns.component").then((m) => m.DropdownsComponent),
+    },
+    {
+        path: "layout",
+        loadComponent: () => import("./components/layout/my-layout.component").then((m) => m.MyLayoutComponent),
+    },
+    {
+        path: "chat",
+        loadComponent: () =>
+            import("./components/conversational-ui/conversational-ui.component").then(
+                (m) => m.ConversationalUiComponent
+            ),
+    },
+    { path: "home", redirectTo: "header", pathMatch: "full" },
+    { path: "", redirectTo: "header", pathMatch: "full" },
 ];

examples-standalone/kendoangular-landing-page/src/main.ts

@@ -1,8 +1,18 @@
-/// <reference types="@angular/localize" />
-
 import { bootstrapApplication } from '@angular/platform-browser';
-import { appConfig } from './app/app.config';
+import { provideRouter, withHashLocation } from '@angular/router';
+import { APP_BASE_HREF } from '@angular/common';
+import { provideAnimations } from '@angular/platform-browser/animations';
+
 import { AppComponent } from './app/app.component';
+import { routes } from './app/app.routes';
 
-bootstrapApplication(AppComponent, appConfig)
-  .catch((err) => console.error(err));
+bootstrapApplication(AppComponent, {
+  providers: [
+    provideRouter(
+      routes,
+      withHashLocation()
+    ),
+    { provide: APP_BASE_HREF, useValue: '/overview/' },
+    provideAnimations()
+  ]
+}).catch(err => console.error(err));