use params instead of headers

front-end/src/app/reports/f3x/create-workflow/create-f3x-step1.component.spec.ts

@@ -1,26 +1,28 @@
-import { HttpClientTestingModule, HttpTestingController } from '@angular/common/http/testing';
+import { HttpClientTestingModule } from '@angular/common/http/testing';
 import { ComponentFixture, TestBed } from '@angular/core/testing';
 import { Router } from '@angular/router';
 import { FormBuilder, ReactiveFormsModule } from '@angular/forms';
 import { RouterTestingModule } from '@angular/router/testing';
 import { provideMockStore } from '@ngrx/store/testing';
+import { of } from 'rxjs';
 import { F3xReportCodes, F3xSummary } from 'app/shared/models/f3x-summary.model';
+import { F3xSummaryService } from 'app/shared/services/f3x-summary.service';
 import { UserLoginData } from 'app/shared/models/user.model';
 import { LabelPipe } from 'app/shared/pipes/label.pipe';
 import { SharedModule } from 'app/shared/shared.module';
-import { environment } from 'environments/environment';
 import { MessageService } from 'primeng/api';
 import { CalendarModule } from 'primeng/calendar';
 import { RadioButtonModule } from 'primeng/radiobutton';
 import { SelectButtonModule } from 'primeng/selectbutton';
 import { CreateF3XStep1Component, F3xReportTypeCategories } from './create-f3x-step1.component';
 
 describe('CreateF3XStep1Component', () => {
-  let httpTestingController: HttpTestingController;
   let component: CreateF3XStep1Component;
   let router: Router;
   let fixture: ComponentFixture<CreateF3XStep1Component>;
+  let f3xSummaryService: F3xSummaryService;
   const f3x: F3xSummary = F3xSummary.fromJSON({
+    id: 999,
     coverage_from_date: '20220525',
     form_type: 'F3XN',
     report_code: 'Q1',
@@ -44,6 +46,7 @@ describe('CreateF3XStep1Component', () => {
       ],
       declarations: [CreateF3XStep1Component, LabelPipe],
       providers: [
+        F3xSummaryService,
         FormBuilder,
         MessageService,
         provideMockStore({
@@ -52,11 +55,11 @@ describe('CreateF3XStep1Component', () => {
         }),
       ],
     }).compileComponents();
-    httpTestingController = TestBed.inject(HttpTestingController);
   });
 
   beforeEach(() => {
     router = TestBed.inject(Router);
+    f3xSummaryService = TestBed.inject(F3xSummaryService);
     fixture = TestBed.createComponent(CreateF3XStep1Component);
     component = fixture.componentInstance;
     fixture.detectChanges();
@@ -82,11 +85,24 @@ describe('CreateF3XStep1Component', () => {
   });
 
   it('#save should save a new f3x record', () => {
+    spyOn(f3xSummaryService, 'create').and.returnValue(of(f3x));
+    const navigateSpy = spyOn(router, 'navigateByUrl');
+    component.form.patchValue({ ...f3x });
+    component.save();
+    expect(navigateSpy).toHaveBeenCalledWith('/reports');
+
+    navigateSpy.calls.reset();
+    component.form.patchValue({ ...f3x });
+    component.save('continue');
+    expect(navigateSpy).toHaveBeenCalledWith('/reports/f3x/create/step2/999');
+  });
+
+  it('#save should not save with invalid f3x record', () => {
+    spyOn(f3xSummaryService, 'create').and.returnValue(of(f3x));
     component.form.patchValue({ ...f3x });
+    component.form.patchValue({ form_type: 'NO-GOOD' });
     component.save();
-    const req = httpTestingController.expectOne(`${environment.apiUrl}/f3x-summaries/`);
-    expect(req.request.method).toEqual('POST');
-    httpTestingController.verify();
+    expect(component.form.invalid).toBe(true);
   });
 
   it('back button should go back to report list page', () => {

front-end/src/app/reports/f3x/create-workflow/create-f3x-step1.component.ts

@@ -14,7 +14,7 @@ import { LabelList, LabelUtils, PrimeOptions, StatesCodeLabels } from 'app/share
 import { selectCommitteeAccount } from 'app/store/committee-account.selectors';
 import { ValidateService } from 'app/shared/services/validate.service';
 import { schema as f3xSchema } from 'fecfile-validate/fecfile_validate_js/dist/F3X';
-import { Subject, takeUntil, combineLatest, switchMap, Observable, of } from 'rxjs';
+import { Subject, takeUntil } from 'rxjs';
 import { Store } from '@ngrx/store';
 import { FormBuilder, FormControl, FormGroup } from '@angular/forms';
 import { environment } from 'environments/environment';
@@ -90,18 +90,11 @@ export class CreateF3XStep1Component implements OnInit, OnDestroy {
   ) {}
 
   ngOnInit(): void {
-    const existingReport$: Observable<F3xSummary | undefined> = this.activatedRoute.paramMap.pipe(
-      switchMap((paramMap): Observable<F3xSummary | undefined> => {
-        const id = paramMap.get('id');
-        if (id) {
-          return this.f3xSummaryService.get(parseInt(id));
-        }
-        return of(undefined);
-      })
-    );
-    combineLatest([this.store.select(selectCommitteeAccount), existingReport$])
+    const report: F3xSummary = this.activatedRoute.snapshot.data['report'];
+    this.store
+      .select(selectCommitteeAccount)
       .pipe(takeUntil(this.destroy$))
-      .subscribe(([committeeAccount, existingReport]) => {
+      .subscribe((committeeAccount) => {
         const filingFrequency = this.userCanSetFilingFrequency ? 'Q' : committeeAccount.filing_frequency;
         this.form.addControl('filing_frequency', new FormControl());
         this.form.addControl('report_type_category', new FormControl());
@@ -125,8 +118,8 @@ export class CreateF3XStep1Component implements OnInit, OnDestroy {
               report_code: this.getReportCodes()[0],
             });
           });
-        if (existingReport) {
-          this.form.patchValue(existingReport);
+        if (report) {
+          this.form.patchValue(report);
         }
       });
     this.stateOptions = LabelUtils.getPrimeOptions(StatesCodeLabels);

front-end/src/app/reports/f3x/create-workflow/create-f3x-step2.component.html

@@ -30,6 +30,7 @@ <h3>Committee address</h3>
             [form]="form"
             fieldName="change_of_address"
             [formSubmitted]="formSubmitted"
+            patternErrorMessage="Please select 'Yes' or 'No'"
           ></app-error-messages>
         </div>
       </div>

front-end/src/app/reports/f3x/create-workflow/create-f3x-step2.component.spec.ts

@@ -26,7 +26,6 @@ describe('CreateF3xStep2Component', () => {
   let httpTestingController: HttpTestingController;
   let reportService: F3xSummaryService;
   const committeeAccount: CommitteeAccount = CommitteeAccount.fromJSON({});
-  const mockParamMap = new Map([['id', 1]]);
 
   beforeEach(async () => {
     const userLoginData: UserLoginData = {
@@ -65,7 +64,11 @@ describe('CreateF3xStep2Component', () => {
         {
           provide: ActivatedRoute,
           useValue: {
-            paramMap: of(mockParamMap),
+            snapshot: {
+              data: {
+                report: F3xSummary.fromJSON({}),
+              },
+            },
           },
         },
       ],
@@ -94,14 +97,18 @@ describe('CreateF3xStep2Component', () => {
     component.form.patchValue({ change_of_address: 'X' });
 
     component.save('back');
-    let req = httpTestingController.expectOne(`${environment.apiUrl}/f3x-summaries/${component.report.id}/`);
+    let req = httpTestingController.expectOne(
+      `${environment.apiUrl}/f3x-summaries/${component.report.id}/?fields_to_validate=change_of_address,street_1,street_2,city,state,zip,memo_checkbox,memo`
+    );
     expect(req.request.method).toEqual('PUT');
     req.flush(component.report);
     expect(navigateSpy).toHaveBeenCalledWith('/reports');
 
     navigateSpy.calls.reset();
     component.save('continue');
-    req = httpTestingController.expectOne(`${environment.apiUrl}/f3x-summaries/${component.report.id}/`);
+    req = httpTestingController.expectOne(
+      `${environment.apiUrl}/f3x-summaries/${component.report.id}/?fields_to_validate=change_of_address,street_1,street_2,city,state,zip,memo_checkbox,memo`
+    );
     expect(req.request.method).toEqual('PUT');
     req.flush(component.report);
     expect(navigateSpy).toHaveBeenCalledWith('/reports');

front-end/src/app/reports/f3x/create-workflow/create-f3x-step2.component.ts

@@ -1,24 +1,23 @@
 import { Component, OnDestroy, OnInit } from '@angular/core';
 import { Router, ActivatedRoute } from '@angular/router';
 import { FormBuilder, FormGroup } from '@angular/forms';
-import { mergeMap, Observable, Subject, takeUntil, skipUntil } from 'rxjs';
+import { Observable, Subject, takeUntil } from 'rxjs';
 import { Store } from '@ngrx/store';
 import { refreshCommitteeAccountDetailsAction } from '../../../store/committee-account.actions';
-import { CommitteeAccount } from 'app/shared/models/committee-account.model';
 import { selectCommitteeAccount } from 'app/store/committee-account.selectors';
 import { LabelUtils, PrimeOptions, StatesCodeLabels, CountryCodeLabels } from 'app/shared/utils/label.utils';
 import { ValidateService } from 'app/shared/services/validate.service';
 import { schema as f3xSchema } from 'fecfile-validate/fecfile_validate_js/dist/F3X';
 import { F3xSummary } from 'app/shared/models/f3x-summary.model';
 import { F3xSummaryService } from 'app/shared/services/f3x-summary.service';
+import { CommitteeAccount } from 'app/shared/models/committee-account.model';
 
 @Component({
   selector: 'app-create-f3x-step2',
   templateUrl: './create-f3x-step2.component.html',
   styleUrls: ['./create-f3x-step2.component.scss'],
 })
 export class CreateF3xStep2Component implements OnInit, OnDestroy {
-  report: F3xSummary | null = null;
   formProperties: string[] = [
     'change_of_address',
     'street_1',
@@ -29,19 +28,19 @@ export class CreateF3xStep2Component implements OnInit, OnDestroy {
     'memo_checkbox',
     'memo',
   ];
+  report: F3xSummary | undefined;
   stateOptions: PrimeOptions = [];
   countryOptions: PrimeOptions = [];
   formSubmitted = false;
   destroy$: Subject<boolean> = new Subject<boolean>();
-  committeeAccount: CommitteeAccount | null = null;
-  committeeAccount$: Observable<CommitteeAccount> | null = null;
+  committeeAccount$: Observable<CommitteeAccount> = this.store.select(selectCommitteeAccount);
 
   form: FormGroup = this.fb.group(this.validateService.getFormGroupFields(this.formProperties));
 
   constructor(
     private router: Router,
-    private route: ActivatedRoute,
-    private reportService: F3xSummaryService,
+    private activatedRoute: ActivatedRoute,
+    private f3xSummaryService: F3xSummaryService,
     private validateService: ValidateService,
     private fb: FormBuilder,
     private store: Store
@@ -50,32 +49,21 @@ export class CreateF3xStep2Component implements OnInit, OnDestroy {
   ngOnInit(): void {
     // Refresh committee account details whenever page loads
     this.store.dispatch(refreshCommitteeAccountDetailsAction());
-
-    this.committeeAccount$ = this.store.select(selectCommitteeAccount);
-    this.committeeAccount$
-      .pipe(takeUntil(this.destroy$))
-      .subscribe((committeeAccount: CommitteeAccount) => (this.committeeAccount = committeeAccount));
     this.stateOptions = LabelUtils.getPrimeOptions(StatesCodeLabels);
     this.countryOptions = LabelUtils.getPrimeOptions(CountryCodeLabels);
 
-    this.route.paramMap
-      .pipe(
-        takeUntil(this.destroy$),
-        skipUntil(this.committeeAccount$),
-        mergeMap((params): Observable<F3xSummary> => {
-          const id = Number(params.get('id'));
-          return this.reportService.get(id);
-        })
-      )
-      .subscribe((report: F3xSummary) => {
-        this.report = report;
+    this.report = this.activatedRoute.snapshot.data['report'];
+    this.store
+      .select(selectCommitteeAccount)
+      .pipe(takeUntil(this.destroy$))
+      .subscribe((committeeAccount) => {
         this.form.patchValue({
-          change_of_address: this.report.change_of_address ? this.report.change_of_address : 'not-selected',
-          street_1: this.report.street_1 ? this.report.street_1 : this.committeeAccount?.street_1,
-          street_2: this.report.street_2 ? this.report.street_2 : this.committeeAccount?.street_2,
-          city: this.report.city ? this.report.city : this.committeeAccount?.city,
-          state: this.report.state ? this.report.state : this.committeeAccount?.state,
-          zip: this.report.zip ? this.report.zip : this.committeeAccount?.zip,
+          change_of_address: this.report?.change_of_address ? this.report.change_of_address : 'not-selected',
+          street_1: this.report?.street_1 ? this.report.street_1 : committeeAccount?.street_1,
+          street_2: this.report?.street_2 ? this.report.street_2 : committeeAccount?.street_2,
+          city: this.report?.city ? this.report.city : committeeAccount?.city,
+          state: this.report?.state ? this.report.state : committeeAccount?.state,
+          zip: this.report?.zip ? this.report.zip : committeeAccount?.zip,
           memo_checkbox: false,
           memo: '',
         });
@@ -103,7 +91,7 @@ export class CreateF3xStep2Component implements OnInit, OnDestroy {
       ...this.form.value,
     });
 
-    this.reportService.update(payload, this.formProperties).subscribe(() => {
+    this.f3xSummaryService.update(payload, this.formProperties).subscribe(() => {
       if (jump === 'continue' && this.report?.id) {
         this.router.navigateByUrl('/reports');
       }

front-end/src/app/reports/reports-routing.module.ts

@@ -3,6 +3,7 @@ import { Routes, RouterModule } from '@angular/router';
 import { ReportListComponent } from './report-list/report-list.component';
 import { CreateF3XStep1Component } from './f3x/create-workflow/create-f3x-step1.component';
 import { CreateF3xStep2Component } from './f3x/create-workflow/create-f3x-step2.component';
+import { ReportResolver } from 'app/shared/resolvers/report.resolver';
 
 const routes: Routes = [
   {
@@ -14,9 +15,15 @@ const routes: Routes = [
     path: 'f3x/create/step1',
     component: CreateF3XStep1Component,
   },
+  {
+    path: 'f3x/create/step1/:id',
+    component: CreateF3XStep1Component,
+    resolve: { report: ReportResolver },
+  },
   {
     path: 'f3x/create/step2/:id',
     component: CreateF3xStep2Component,
+    resolve: { report: ReportResolver },
   },
   { path: '**', redirectTo: '' },
 ];

front-end/src/app/shared/resolvers/report.resolver.spec.ts

@@ -0,0 +1,52 @@
+import { TestBed } from '@angular/core/testing';
+import { HttpClientTestingModule, HttpTestingController } from '@angular/common/http/testing';
+import { ActivatedRouteSnapshot, convertToParamMap } from '@angular/router';
+import { provideMockStore } from '@ngrx/store/testing';
+import { F3xSummaryService } from '../services/f3x-summary.service';
+import { ReportResolver } from './report.resolver';
+import { F3xSummary } from '../models/f3x-summary.model';
+import { environment } from '../../../environments/environment';
+
+describe('ReportResolver', () => {
+  let resolver: ReportResolver;
+  let httpTestingController: HttpTestingController;
+
+  beforeEach(() => {
+    TestBed.configureTestingModule({
+      imports: [HttpClientTestingModule],
+      providers: [F3xSummaryService, provideMockStore({})],
+    });
+    httpTestingController = TestBed.inject(HttpTestingController);
+    resolver = TestBed.inject(ReportResolver);
+  });
+
+  it('should be created', () => {
+    expect(resolver).toBeTruthy();
+  });
+
+  it('should return an F3X report', () => {
+    const f3xSummary: F3xSummary = F3xSummary.fromJSON({ id: 999 });
+    const route = {
+      paramMap: convertToParamMap({ id: 999 }),
+    };
+
+    resolver.resolve(route as ActivatedRouteSnapshot).subscribe((response: F3xSummary | undefined) => {
+      expect(response).toEqual(f3xSummary);
+    });
+
+    const req = httpTestingController.expectOne(`${environment.apiUrl}/f3x-summaries/${f3xSummary.id}`);
+    expect(req.request.method).toEqual('GET');
+    req.flush(f3xSummary);
+    httpTestingController.verify();
+  });
+
+  it('should return undefined', () => {
+    const route = {
+      paramMap: convertToParamMap({ id: undefined }),
+    };
+
+    resolver.resolve(route as ActivatedRouteSnapshot).subscribe((response: F3xSummary | undefined) => {
+      expect(response).toEqual(undefined);
+    });
+  });
+});

front-end/src/app/shared/resolvers/report.resolver.ts

@@ -0,0 +1,25 @@
+import { Injectable } from '@angular/core';
+import { Resolve, ActivatedRouteSnapshot } from '@angular/router';
+import { Observable, of } from 'rxjs';
+import { F3xSummary } from '../models/f3x-summary.model';
+import { F3xSummaryService } from '../services/f3x-summary.service';
+
+@Injectable({
+  providedIn: 'root',
+})
+export class ReportResolver implements Resolve<F3xSummary | undefined> {
+  constructor(private f3xSummaryService: F3xSummaryService) {}
+
+  /**
+   * Returns the report record for the id passed in the URL
+   * @param {ActivatedRouteSnapshot} route
+   * @returns {Observable<F3xSummary | undefined>}
+   */
+  resolve(route: ActivatedRouteSnapshot): Observable<F3xSummary | undefined> {
+    const id = route.paramMap.get('id');
+    if (id) {
+      return this.f3xSummaryService.get(Number(id));
+    }
+    return of(undefined);
+  }
+}