andi/perfdb
1
0
Fork 0
Code Issues 1 Pull Requests Packages Projects Releases Activity

update router to use standalone components and lazy loading

Browse Source
This commit is contained in:
Andreas Huber
2024-10-13 10:54:33 +02:00
parent 8fef666183
commit e292587a36
2 changed files with 37 additions and 32 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
pdb-js/src/app/app-routing.module.ts
View File

@@ -1,29 +0,0 @@
import { NgModule } from "@angular/core";
import { RouterModule, Routes } from "@angular/router";
import { VisualizationPageComponent } from "./visualization-page/visualization-page.component";
import { MainPageComponent } from "./main-page/main-page.component";
import { UploadPageComponent } from "./upload-page/upload-page.component";
import { HelpPageComponent } from "./help-page/help-page.component";
import { DashboardPageComponent } from "./dashboard-page/dashboard-page.component";
import { DashboardComponent } from "./dashboard-page/dashboard/dashboard.component";
import { CustomizableGridComponent } from "./customizable-grid/customizable-grid.component";
const routes: Routes = [
{ path: "", component: MainPageComponent },
{ path: "vis", component: VisualizationPageComponent },
{ path: "dashboard", component: DashboardPageComponent },
{ path: "dashboard/:id", component: DashboardComponent },
{ path: "upload", component: UploadPageComponent },
{ path: "grid", component: CustomizableGridComponent },
{ path: "help", component: HelpPageComponent },
// { path: '**', component: PageNotFoundComponent }
];
@NgModule({
imports: [
RouterModule.forRoot(routes, {}),
],
declarations: [],
exports: [RouterModule],
})
export class AppRoutingModule {}

40
pdb-js/src/main.ts
View File

@@ -1,5 +1,4 @@
import { enableProdMode, importProvidersFrom } from '@angular/core'; import { enableProdMode, importProvidersFrom } from '@angular/core';
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { environment } from './environments/environment'; import { environment } from './environments/environment';
@@ -7,7 +6,6 @@ import { MAT_DIALOG_DEFAULT_OPTIONS, MatDialogModule } from '@angular/material/d
import { provideHttpClient, withInterceptorsFromDi } from '@angular/common/http'; import { provideHttpClient, withInterceptorsFromDi } from '@angular/common/http';
import { MarkdownModule } from 'ngx-markdown'; import { MarkdownModule } from 'ngx-markdown';
import { BrowserModule, bootstrapApplication } from '@angular/platform-browser'; import { BrowserModule, bootstrapApplication } from '@angular/platform-browser';
import { AppRoutingModule } from './app/app-routing.module';
import { FormsModule, ReactiveFormsModule } from '@angular/forms'; import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { DragDropModule } from '@angular/cdk/drag-drop'; import { DragDropModule } from '@angular/cdk/drag-drop';
import { MatAutocompleteModule } from '@angular/material/autocomplete'; import { MatAutocompleteModule } from '@angular/material/autocomplete';
@@ -29,6 +27,7 @@ import { MatTooltipModule } from '@angular/material/tooltip';
import { provideAnimations } from '@angular/platform-browser/animations'; import { provideAnimations } from '@angular/platform-browser/animations';
import { OverlayModule } from '@angular/cdk/overlay'; import { OverlayModule } from '@angular/cdk/overlay';
import { AppComponent } from './app/app.component'; import { AppComponent } from './app/app.component';
import { provideRouter, Routes, withDebugTracing } from '@angular/router';
if (environment.production) { if (environment.production) {
enableProdMode(); enableProdMode();
@@ -40,9 +39,44 @@ if (environment.production) {
(<any>window).submitterId = (<any>window).randomId(); (<any>window).submitterId = (<any>window).randomId();
const routes: Routes = [
{ path: "", loadComponent: () => import("./app/main-page/main-page.component").then( m => m.MainPageComponent) },
{ path: "vis", loadComponent: () => import("./app/visualization-page/visualization-page.component").then(m => m.VisualizationPageComponent) },
{ path: "dashboard", loadComponent: () => import("./app/dashboard-page/dashboard-page.component").then(m => m.DashboardPageComponent) },
{ path: "dashboard/:id", loadComponent: () => import("./app/dashboard-page/dashboard/dashboard.component").then(m => m.DashboardComponent) },
{ path: "upload", loadComponent: () => import("./app/upload-page/upload-page.component").then(m => m.UploadPageComponent) },
{ path: "grid", loadComponent: () => import("./app/customizable-grid/customizable-grid.component").then(m => m.CustomizableGridComponent) },
{ path: "help", loadComponent: () => import("./app/help-page/help-page.component").then(m => m.HelpPageComponent) },
];
bootstrapApplication(AppComponent, { bootstrapApplication(AppComponent, {
providers: [ providers: [
importProvidersFrom(MarkdownModule.forRoot(), BrowserModule, AppRoutingModule, FormsModule, ReactiveFormsModule, DragDropModule, MatAutocompleteModule, MatBadgeModule, MatButtonModule, MatCardModule, MatCheckboxModule, MatDialogModule, MatFormFieldModule, MatGridListModule, MatInputModule, MatRadioModule, MatProgressBarModule, MatProgressSpinnerModule, MatSelectModule, MatSnackBarModule, MatTabsModule, MatTableModule, MatTooltipModule, OverlayModule), provideRouter(routes, withDebugTracing()),
importProvidersFrom(
MarkdownModule.forRoot(),
BrowserModule,
FormsModule,
ReactiveFormsModule,
DragDropModule,
MatAutocompleteModule,
MatBadgeModule,
MatButtonModule,
MatCardModule,
MatCheckboxModule,
MatDialogModule,
MatFormFieldModule,
MatGridListModule,
MatInputModule,
MatRadioModule,
MatProgressBarModule,
MatProgressSpinnerModule,
MatSelectModule,
MatSnackBarModule,
MatTabsModule,
MatTableModule,
MatTooltipModule,
OverlayModule),
{ {
provide: MAT_DIALOG_DEFAULT_OPTIONS, provide: MAT_DIALOG_DEFAULT_OPTIONS,
useValue: { hasBackdrop: true }, useValue: { hasBackdrop: true },