From 04354725d8715c80ef8d4a6daea44c26c8363efb Mon Sep 17 00:00:00 2001 From: Brandon Clayton <bclayton@usgs.gov> Date: Tue, 26 Nov 2024 14:27:47 -0700 Subject: [PATCH] add gmm dashboard --- .../src/app/gmm/dashboard/app.component.html | 19 ++++++++ .../src/app/gmm/dashboard/app.component.scss | 0 .../app/gmm/dashboard/app.component.spec.ts | 30 ++++++++++++ .../src/app/gmm/dashboard/app.component.ts | 47 +++++++++++++++++++ projects/nshmp-apps/src/app/gmm/gmm.routes.ts | 5 ++ .../src/shared/models/applications.model.ts | 2 + .../src/shared/utils/applications.utils.ts | 5 ++ 7 files changed, 108 insertions(+) create mode 100644 projects/nshmp-apps/src/app/gmm/dashboard/app.component.html create mode 100644 projects/nshmp-apps/src/app/gmm/dashboard/app.component.scss create mode 100644 projects/nshmp-apps/src/app/gmm/dashboard/app.component.spec.ts create mode 100644 projects/nshmp-apps/src/app/gmm/dashboard/app.component.ts diff --git a/projects/nshmp-apps/src/app/gmm/dashboard/app.component.html b/projects/nshmp-apps/src/app/gmm/dashboard/app.component.html new file mode 100644 index 000000000..ee3e46652 --- /dev/null +++ b/projects/nshmp-apps/src/app/gmm/dashboard/app.component.html @@ -0,0 +1,19 @@ +<nshmp-lib-ng-template #template [navigationList]="navigationList" [title]=""> + <!-- Dashboard --> + <nshmp-lib-ng-dashboard [sections]="sections"> + <nshmp-lib-ng-dashboard-title> + USGS Earthquake Hazard Toolbox: + <br /> + Ground Motion Model Applications + </nshmp-lib-ng-dashboard-title> + <nshmp-lib-ng-dashboard-description /> + </nshmp-lib-ng-dashboard> + + <!-- About page --> + <nshmp-lib-ng-about-page> + <nshmp-lib-ng-about-content + [showSavingSettingPanel]="false" + [showUsingApplicationPanel]="false" + /> + </nshmp-lib-ng-about-page> +</nshmp-lib-ng-template> diff --git a/projects/nshmp-apps/src/app/gmm/dashboard/app.component.scss b/projects/nshmp-apps/src/app/gmm/dashboard/app.component.scss new file mode 100644 index 000000000..e69de29bb diff --git a/projects/nshmp-apps/src/app/gmm/dashboard/app.component.spec.ts b/projects/nshmp-apps/src/app/gmm/dashboard/app.component.spec.ts new file mode 100644 index 000000000..10ce8a002 --- /dev/null +++ b/projects/nshmp-apps/src/app/gmm/dashboard/app.component.spec.ts @@ -0,0 +1,30 @@ +import {provideHttpClient} from '@angular/common/http'; +import {ComponentFixture, TestBed} from '@angular/core/testing'; +import {provideNoopAnimations} from '@angular/platform-browser/animations'; +import {provideRouter} from '@angular/router'; + +import {AppComponent} from './app.component'; + +describe('AppComponent', () => { + let component: AppComponent; + let fixture: ComponentFixture<AppComponent>; + + beforeEach(async () => { + await TestBed.configureTestingModule({ + imports: [AppComponent], + providers: [ + provideHttpClient(), + provideNoopAnimations(), + provideRouter([]), + ], + }).compileComponents(); + + fixture = TestBed.createComponent(AppComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/projects/nshmp-apps/src/app/gmm/dashboard/app.component.ts b/projects/nshmp-apps/src/app/gmm/dashboard/app.component.ts new file mode 100644 index 000000000..682b13bdf --- /dev/null +++ b/projects/nshmp-apps/src/app/gmm/dashboard/app.component.ts @@ -0,0 +1,47 @@ +import {Component} from '@angular/core'; +import { + NshmpLibNgAboutContentComponent, + NshmpLibNgAboutPageComponent, +} from '@ghsc/nshmp-lib-ng/about'; +import { + ApplicationSections, + NshmpLibNgDashboardComponent, + NshmpLibNgDashboardDescriptionComponent, + NshmpLibNgDashboardTitleComponent, + NshmpLibNgTemplateComponent, +} from '@ghsc/nshmp-lib-ng/nshmp'; +import { + gmmApps, + navigation, +} from 'projects/nshmp-apps/src/shared/utils/navigation.utils'; + +@Component({ + imports: [ + NshmpLibNgTemplateComponent, + NshmpLibNgAboutPageComponent, + NshmpLibNgDashboardComponent, + NshmpLibNgDashboardTitleComponent, + NshmpLibNgDashboardDescriptionComponent, + NshmpLibNgAboutContentComponent, + ], + selector: 'app-app', + standalone: true, + styleUrl: './app.component.scss', + templateUrl: './app.component.html', +}) +export class AppComponent { + /** Navigation list for menu */ + navigationList = navigation(); + + sections: ApplicationSections[] = [ + { + gridClass: 'grid-col-10', + sections: [ + { + applications: gmmApps().map(navigation => ({navigation})), + gridClass: 'grid-col-12 tablet-lg:grid-col-8 grid-offset-1', + }, + ], + }, + ]; +} diff --git a/projects/nshmp-apps/src/app/gmm/gmm.routes.ts b/projects/nshmp-apps/src/app/gmm/gmm.routes.ts index 2e31bb684..15ec2ed76 100644 --- a/projects/nshmp-apps/src/app/gmm/gmm.routes.ts +++ b/projects/nshmp-apps/src/app/gmm/gmm.routes.ts @@ -2,6 +2,11 @@ import {Routes} from '@angular/router'; /** GMM routes */ const routes: Routes = [ + { + loadComponent: () => + import('./dashboard/app.component').then(com => com.AppComponent), + path: '', + }, { loadComponent: () => import('./distance/app.component').then(com => com.AppComponent), diff --git a/projects/nshmp-apps/src/shared/models/applications.model.ts b/projects/nshmp-apps/src/shared/models/applications.model.ts index a61a95a97..b5f124407 100644 --- a/projects/nshmp-apps/src/shared/models/applications.model.ts +++ b/projects/nshmp-apps/src/shared/models/applications.model.ts @@ -77,6 +77,8 @@ export interface DesignMapsApplications { * GMM applications. */ export interface GmmApplications { + /** GMM dashboard */ + dashboard: Navigation; /** Ground motion vs. distance application */ distance: Navigation; /** Ground motion vs magnitude application */ diff --git a/projects/nshmp-apps/src/shared/utils/applications.utils.ts b/projects/nshmp-apps/src/shared/utils/applications.utils.ts index 6f08a6257..2bcd035fd 100644 --- a/projects/nshmp-apps/src/shared/utils/applications.utils.ts +++ b/projects/nshmp-apps/src/shared/utils/applications.utils.ts @@ -19,6 +19,11 @@ export function apps(): Applications { }, }, gmm: { + dashboard: { + display: 'GMM Dashboard', + routerLink: '/gmm', + showInDashboard: false, + }, distance: { display: 'Ground Motion vs. Distance', routerLink: '/gmm/distance', -- GitLab