From a6b12f8b344a7aab4ce1c49c5d90b755fb364e07 Mon Sep 17 00:00:00 2001
From: Brandon Clayton <bclayton@usgs.gov>
Date: Wed, 17 Jul 2024 09:06:09 -0600
Subject: [PATCH] use signals
---
.../plot-settings.component.html | 12 +++---
.../plot-settings/plot-settings.component.ts | 40 ++++++++++++++-----
2 files changed, 36 insertions(+), 16 deletions(-)
diff --git a/projects/nshmp-apps/src/app/dev/gmm/hanging-wall-effects/components/plot-settings/plot-settings.component.html b/projects/nshmp-apps/src/app/dev/gmm/hanging-wall-effects/components/plot-settings/plot-settings.component.html
index 38395ac80..a59c17095 100644
--- a/projects/nshmp-apps/src/app/dev/gmm/hanging-wall-effects/components/plot-settings/plot-settings.component.html
+++ b/projects/nshmp-apps/src/app/dev/gmm/hanging-wall-effects/components/plot-settings/plot-settings.component.html
@@ -5,16 +5,16 @@
<mat-expansion-panel-header>
<mat-panel-title>{{ panel.title }}</mat-panel-title>
</mat-expansion-panel-header>
- <nshmp-lib-ng-plot-settings [plot]="panel.plot$ | async" />
+ <nshmp-lib-no-ngrx-plot-settings
+ [plot]="panel.plot()"
+ (updatedPlot)="updatePlot($event)"
+ />
</mat-expansion-panel>
}
</mat-accordion>
- <nshmp-lib-ng-plot-reset-plot-settings
+ <nshmp-lib-no-ngrx-plot-reset-plot-settings
(resetClick)="facade.resetPlotSettings()"
- [resetDisabled]="
- (groundMotionPlotData$ | async)?.settingsForm?.isPristine &&
- (groundMotionPlotData$ | async)?.settingsForm?.isUntouched
- "
+ [resetDisabled]="resetDisabled"
/>
</div>
diff --git a/projects/nshmp-apps/src/app/dev/gmm/hanging-wall-effects/components/plot-settings/plot-settings.component.ts b/projects/nshmp-apps/src/app/dev/gmm/hanging-wall-effects/components/plot-settings/plot-settings.component.ts
index 261f8b8ce..8eccf4070 100644
--- a/projects/nshmp-apps/src/app/dev/gmm/hanging-wall-effects/components/plot-settings/plot-settings.component.ts
+++ b/projects/nshmp-apps/src/app/dev/gmm/hanging-wall-effects/components/plot-settings/plot-settings.component.ts
@@ -1,5 +1,4 @@
-import {AsyncPipe} from '@angular/common';
-import {Component} from '@angular/core';
+import {Component, computed, OnDestroy} from '@angular/core';
import {
MatAccordion,
MatExpansionPanel,
@@ -9,9 +8,10 @@ import {
import {
NshmpLibNgPlotResetPlotSettingsComponent,
NshmpLibNgPlotSettingsComponent,
+ NshmpPlot,
PlotSettingsPanel,
-} from '@ghsc/nshmp-lib-ng/plot';
-import {map} from 'rxjs';
+} from '@ghsc/nshmp-lib-no-ngrx/plot';
+import {Subscription} from 'rxjs';
import {AppFacade} from '../../state/app.facade';
import {Plots} from '../../state/app.state';
@@ -24,25 +24,45 @@ import {Plots} from '../../state/app.state';
MatExpansionPanel,
MatExpansionPanelHeader,
MatExpansionPanelTitle,
- AsyncPipe,
],
selector: 'app-plot-settings',
standalone: true,
styleUrl: './plot-settings.component.scss',
templateUrl: './plot-settings.component.html',
})
-export class PlotSettingsComponent {
+export class PlotSettingsComponent implements OnDestroy {
/** Ground motion plot */
- groundMotionPlotData$ = this.facade.plots$.pipe(
- map(plots => plots?.get(Plots.GROUND_MOTION))
- );
+ groundMotionPlot = computed(() => {
+ this.settingsFormSubscription?.unsubscribe();
+ const plot = this.facade.state().plots.get(Plots.GROUND_MOTION);
+
+ this.settingsFormSubscription = plot.settingsForm.valueChanges.subscribe(
+ () => {
+ this.resetDisabled =
+ plot.settingsForm.pristine && plot.settingsForm.untouched;
+ }
+ );
+
+ return plot;
+ });
panels: PlotSettingsPanel[] = [
{
- plot$: this.groundMotionPlotData$,
+ plot: this.groundMotionPlot,
title: 'Ground Motion Plot Settings',
},
];
+ resetDisabled = true;
+ private settingsFormSubscription = new Subscription();
+
constructor(public facade: AppFacade) {}
+
+ ngOnDestroy(): void {
+ this.settingsFormSubscription.unsubscribe();
+ }
+
+ updatePlot(plot: NshmpPlot): void {
+ this.facade.updatePlot(plot, Plots.GROUND_MOTION);
+ }
}
--
GitLab