Update to move report code label to backend

front-end/src/app/layout/sidebar/menus/f3x/f3x-menu.component.html

@@ -3,7 +3,7 @@
     <div class="col-12">
       <div class="title-2">REPORT PROGRESS</div>
       <div class="report-type">{{ formLabel }}</div>
-      <div class="sub-heading">{{ report_code | reportCodeLabel }}</div>
+      <div class="sub-heading">{{ subLabel }}</div>
       <div class="sub-heading">
         {{ coverage_from_date | fecDate }} — <wbr />
         {{ coverage_through_date | fecDate }}

front-end/src/app/layout/sidebar/menus/f3x/f3x-menu.component.ts

@@ -4,7 +4,6 @@ import { MenuItem } from 'primeng/api';
 import { Report } from '../../../../shared/models/report.model';
 import { ReportService } from '../../../../shared/services/report.service';
 import { ReportSidebarSection, SidebarState } from '../../sidebar.component';
-import { F3xReportCodes } from 'app/shared/utils/report-code.utils';
 import { AbstractMenuComponent } from '../abstract-menu.component';
 import { takeUntil } from 'rxjs';
 import { Form3X } from '../../../../shared/models/form-3x.model';
@@ -17,7 +16,7 @@ import { Router } from '@angular/router';
 })
 export class F3XMenuComponent extends AbstractMenuComponent implements OnInit {
   formLabel?: string;
-  report_code?: F3xReportCodes;
+  subLabel?: string;
   coverage_from_date?: Date;
   coverage_through_date?: Date;
 
@@ -31,7 +30,7 @@ export class F3XMenuComponent extends AbstractMenuComponent implements OnInit {
     if (!this.activeReport$) return;
     this.activeReport$.pipe(takeUntil(this.destroy$)).subscribe((report) => {
       this.formLabel = report?.formLabel;
-      this.report_code = (report as Form3X).report_code;
+      this.subLabel = report?.formSubLabel;
       this.coverage_from_date = (report as Form3X).coverage_from_date;
       this.coverage_through_date = (report as Form3X).coverage_through_date;
     });

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

@@ -74,7 +74,7 @@ <h3>Report type</h3>
               [inputId]="reportCode"
               name="report_code"
               [value]="reportCode"
-              label="{{ reportCode | reportCodeLabel }}"
+              label="{{ reportCodeLabelMap ? reportCodeLabelMap[reportCode] : '' }}"
               [class]="
                 usedReportCodes?.includes(reportCode)
                   ? 'p-disabled border-none bg-transparent aria-disabled=&quot;true&quot;'

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

@@ -18,9 +18,9 @@ import { FecDatePipe } from 'app/shared/pipes/fec-date.pipe';
 import { F3xCoverageDates } from '../../../shared/models/form-3x.model';
 import { ReportService } from '../../../shared/services/report.service';
 import { ListRestResponse } from '../../../shared/models/rest-api.model';
-import { F3xReportCodes } from 'app/shared/utils/report-code.utils';
-import { of } from 'rxjs';
+import { firstValueFrom, of } from 'rxjs';
 import { buildNonOverlappingCoverageValidator } from 'app/shared/utils/validators.utils';
+import { F3xReportCodes } from 'app/shared/utils/report-code.utils';
 
 describe('CreateF3XStep1Component', () => {
   let component: CreateF3XStep1Component;
@@ -47,16 +47,22 @@ describe('CreateF3XStep1Component', () => {
   const ninth = new Date('01/09/2024');
   const eighth = new Date('01/08/2024');
   const tenth = new Date('01/10/2024');
-  const thirdThroughFifth = F3xCoverageDates.fromJSON({
-    report_code: 'Q1',
-    coverage_from_date: third,
-    coverage_through_date: fifth,
-  });
-  const seventhThroughNinth = F3xCoverageDates.fromJSON({
-    report_code: 'Q2',
-    coverage_from_date: seventh,
-    coverage_through_date: ninth,
-  });
+  const thirdThroughFifth = F3xCoverageDates.fromJSON(
+    {
+      report_code: 'Q1',
+      coverage_from_date: third,
+      coverage_through_date: fifth,
+    },
+    'APRIL 15 QUARTERLY REPORT (Q1)',
+  );
+  const seventhThroughNinth = F3xCoverageDates.fromJSON(
+    {
+      report_code: 'Q2',
+      coverage_from_date: seventh,
+      coverage_through_date: ninth,
+    },
+    'JULY 15 QUARTERLY REPORT (Q2)',
+  );
 
   beforeEach(async () => {
     await TestBed.configureTestingModule({
@@ -75,7 +81,7 @@ describe('CreateF3XStep1Component', () => {
 
     router = TestBed.inject(Router);
     form3XService = TestBed.inject(Form3XService);
-    form3XService.getF3xCoverageDates = () => of([]);
+    form3XService.getF3xCoverageDates = () => firstValueFrom(of([]));
     reportService = TestBed.inject(ReportService);
     fixture = TestBed.createComponent(CreateF3XStep1Component);
     component = fixture.componentInstance;
@@ -104,7 +110,7 @@ describe('CreateF3XStep1Component', () => {
     beforeEach(async () => {
       router = TestBed.inject(Router);
       form3XService = TestBed.inject(Form3XService);
-      form3XService.getF3xCoverageDates = () => of([thirdThroughFifth]);
+      form3XService.getF3xCoverageDates = () => firstValueFrom(of([thirdThroughFifth]));
       reportService = TestBed.inject(ReportService);
       fixture = TestBed.createComponent(CreateF3XStep1Component);
       component = fixture.componentInstance;
@@ -169,6 +175,7 @@ describe('CreateF3XStep1Component', () => {
         coverage_through_date: new FormControl(controlThroughDate),
       });
       validator(group);
+      console.log(group.get('coverage_from_date')?.errors);
       expect(group.get('coverage_from_date')?.errors).toEqual(
         expectedFromMessage ? { invaliddate: { msg: expectedFromMessage } } : null,
       );

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

@@ -7,12 +7,12 @@ import { Form3XService } from 'app/shared/services/form-3x.service';
 import { LabelUtils, PrimeOptions, StatesCodeLabels } from 'app/shared/utils/label.utils';
 import {
   electionReportCodes,
-  F3X_REPORT_CODE_MAP,
   F3xReportCodes,
   monthlyElectionYearReportCodes,
   monthlyNonElectionYearReportCodes,
   quarterlyElectionYearReportCodes,
   quarterlyNonElectionYearReportCodes,
+  getCoverageDatesFunction,
 } from 'app/shared/utils/report-code.utils';
 import { SchemaUtils } from 'app/shared/utils/schema.utils';
 import { selectActiveReport } from 'app/store/active-report.selectors';
@@ -51,6 +51,7 @@ export class CreateF3XStep1Component extends DestroyerComponent implements OnIni
   public usedReportCodes?: F3xReportCodes[];
   public thisYear = new Date().getFullYear();
   committeeAccount?: CommitteeAccount;
+  reportCodeLabelMap?: { [key in F3xReportCodes]: string };
 
   constructor(
     private store: Store,
@@ -65,6 +66,7 @@ export class CreateF3XStep1Component extends DestroyerComponent implements OnIni
 
   ngOnInit(): void {
     const reportId = this.activatedRoute.snapshot.data['reportId'];
+    this.form3XService.getReportCodeLabelMap().then((map) => (this.reportCodeLabelMap = map));
     this.store
       .select(selectActiveReport)
       .pipe(takeUntil(this.destroy$))
@@ -121,7 +123,7 @@ export class CreateF3XStep1Component extends DestroyerComponent implements OnIni
         startWith(this.form.controls['report_type_category'].value),
       ),
     ]).subscribe(([reportCode, filingFrequency, reportTypeCategory]) => {
-      const coverageDatesFunction = F3X_REPORT_CODE_MAP.get(reportCode)?.coverageDatesFunction;
+      const coverageDatesFunction = getCoverageDatesFunction(reportCode);
       if (coverageDatesFunction) {
         const isElectionYear = F3xReportTypeCategories.ELECTION_YEAR === reportTypeCategory;
         const [coverage_from_date, coverage_through_date] = coverageDatesFunction(

front-end/src/app/reports/submission-workflow/submit-report-status.component.html

@@ -38,7 +38,7 @@ <h3>
         <div class="col-12" *ngIf="reportCode">
           <h5>YOUR REPORT TYPE:</h5>
           <h3>
-            {{ reportCode | reportCodeLabel }}
+            {{ reportCodeLabelMap ? reportCodeLabelMap[reportCode] : '' }}
           </h3>
           <br />
         </div>

front-end/src/app/reports/submission-workflow/submit-report-status.component.spec.ts

@@ -1,15 +1,17 @@
 import { ComponentFixture, TestBed } from '@angular/core/testing';
-import { RouterTestingModule } from '@angular/router/testing';
-import { ActivatedRoute } from '@angular/router';
+import { ActivatedRoute, provideRouter } from '@angular/router';
 import { provideMockStore } from '@ngrx/store/testing';
 import { testMockStore } from 'app/shared/utils/unit-test.utils';
 import { Form3X } from 'app/shared/models/form-3x.model';
 import { SharedModule } from 'app/shared/shared.module';
 import { CardModule } from 'primeng/card';
 import { DividerModule } from 'primeng/divider';
 import { SubmitReportStatusComponent } from './submit-report-status.component';
+import { Form3XService } from 'app/shared/services/form-3x.service';
+import { ApiService } from 'app/shared/services/api.service';
+import { HttpClientTestingModule } from '@angular/common/http/testing';
 
-describe('ReportSummaryComponent', () => {
+describe('SubmitReportStatusComponent', () => {
   let component: SubmitReportStatusComponent;
   let fixture: ComponentFixture<SubmitReportStatusComponent>;
   const f3x: Form3X = Form3X.fromJSON({
@@ -21,10 +23,11 @@ describe('ReportSummaryComponent', () => {
 
   beforeEach(async () => {
     await TestBed.configureTestingModule({
-      imports: [SharedModule, DividerModule, CardModule, RouterTestingModule.withRoutes([])],
+      imports: [SharedModule, DividerModule, CardModule, HttpClientTestingModule],
       declarations: [SubmitReportStatusComponent],
       providers: [
         provideMockStore(testMockStore),
+        provideRouter([]),
         {
           provide: ActivatedRoute,
           useValue: {
@@ -35,6 +38,8 @@ describe('ReportSummaryComponent', () => {
             },
           },
         },
+        Form3XService,
+        ApiService,
       ],
     }).compileComponents();
   });

front-end/src/app/reports/submission-workflow/submit-report-status.component.ts

@@ -6,6 +6,7 @@ import { selectActiveReport } from 'app/store/active-report.selectors';
 import { DestroyerComponent } from 'app/shared/components/app-destroyer.component';
 import { Report } from 'app/shared/models/report.model';
 import { F3xReportCodes } from 'app/shared/utils/report-code.utils';
+import { Form3XService } from 'app/shared/services/form-3x.service';
 
 @Component({
   selector: 'app-report-summary',
@@ -16,21 +17,24 @@ export class SubmitReportStatusComponent extends DestroyerComponent implements O
   report?: Report;
   reportCode?: F3xReportCodes;
   coverageDates?: { [key: string]: Date | undefined };
+  reportCodeLabelMap?: { [key in F3xReportCodes]: string };
 
   constructor(
     private store: Store,
     public router: Router,
+    private form3XService: Form3XService,
   ) {
     super();
   }
 
   ngOnInit(): void {
+    this.form3XService.getReportCodeLabelMap().then((map) => (this.reportCodeLabelMap = map));
     this.store
       .select(selectActiveReport)
       .pipe(takeUntil(this.destroy$))
       .subscribe((report) => {
         this.report = report;
-        this.reportCode = report.reportCode;
+        this.reportCode = report.report_code as F3xReportCodes;
         this.coverageDates = report.coverageDates;
       });
   }

front-end/src/app/shared/components/contact-dialog/contact-dialog.component.ts

@@ -54,7 +54,7 @@ export class TransactionData {
       const report = getReportFromJSON(r);
       if (report.report_type === ReportTypes.F24) return; // We will display the Form 3X version of the transaction #1977
       this.form_type = report.formLabel;
-      this.report_code_label = report.reportLabel;
+      this.report_code_label = report.report_code_label ?? '';
     });
   }
 }

front-end/src/app/shared/components/inputs/linked-report-input/linked-report-input.component.spec.ts

@@ -55,6 +55,7 @@ describe('LinkedReportInputComponent', () => {
       coverage_from_date: '2020-01-15',
       coverage_through_date: '2020-04-29',
       report_code: F3xReportCodes.Q1,
+      report_code_label: 'APRIL 15 (Q1)',
     });
 
     component.committeeF3xReports = firstValueFrom(of([testF3X]));

front-end/src/app/shared/components/inputs/linked-report-input/linked-report-input.component.ts

@@ -4,7 +4,6 @@ import { BaseInputComponent } from '../base-input.component';
 import { Report, ReportTypes } from 'app/shared/models/report.model';
 import { ReportService } from 'app/shared/services/report.service';
 import { Form3X } from 'app/shared/models/form-3x.model';
-import { getReportCodeLabel } from 'app/shared/utils/report-code.utils';
 import { FecDatePipe } from 'app/shared/pipes/fec-date.pipe';
 import { FormControl } from '@angular/forms';
 import { buildCorrespondingForm3XValidator } from 'app/shared/utils/validators.utils';
@@ -79,7 +78,7 @@ export class LinkedReportInputComponent extends BaseInputComponent implements On
   getForm3XLabel(report: Form3X | undefined): string {
     if (!report) return '';
 
-    let label = getReportCodeLabel(report.report_code);
+    let label = report.report_code_label ?? '';
     const stringsToRemove = [' MID-YEAR-REPORT', ' YEAR-END', ' QUARTERLY REPORT', ' MONTHLY REPORT'];
     for (const string of stringsToRemove) {
       label = label?.replaceAll(string, '');

front-end/src/app/shared/models/form-1m.model.ts

@@ -31,10 +31,6 @@ export class Form1M extends Report {
     return 'NOTIFICATION OF MULTICANDIDATE STATUS';
   }
 
-  get reportLabel(): string {
-    return '';
-  }
-
   committee_type?: CommitteeType;
 
   @Transform(BaseModel.dateTransform) affiliated_date_form_f1_filed?: Date;

front-end/src/app/shared/models/form-24.model.spec.ts

@@ -46,12 +46,14 @@ describe('Form24', () => {
         committee_name: 'foo',
         report_version: undefined,
         report_type_24_48: '24',
+        report_code_label: '24 HOUR',
       };
       const form = Form24.fromJSON(data);
-      expect(form.reportLabel).toBe('24 HOUR');
+      expect(form.report_code_label).toBe('24 HOUR');
 
       form.report_type_24_48 = '48';
-      expect(form.reportLabel).toBe('48 HOUR');
+      form.report_code_label = '48 HOUR';
+      expect(form.report_code_label).toBe('48 HOUR');
     });
   });
 

front-end/src/app/shared/models/form-24.model.ts

@@ -23,10 +23,6 @@ export class Form24 extends Report {
     return '';
   }
 
-  get reportLabel(): string {
-    return `${this.report_type_24_48} HOUR`;
-  }
-
   override get canAmend(): boolean {
     return this.report_status === ReportStatus.SUBMIT_SUCCESS;
   }

front-end/src/app/shared/models/form-3x.model.spec.ts

@@ -1,7 +1,7 @@
+import { F3xReportCodes } from '../utils/report-code.utils';
 import { F3xFormTypes, Form3X } from './form-3x.model';
 import { UploadSubmission } from './upload-submission.model';
 import { WebPrintSubmission } from './webprint-submission.model';
-import { F3xReportCodes } from '../utils/report-code.utils';
 
 describe('Form3X', () => {
   it('should create an instance', () => {
@@ -75,6 +75,7 @@ describe('Form3X', () => {
         form_type: F3xFormTypes.F3XT,
         committee_name: 'foo',
         report_code: F3xReportCodes.Q1,
+        report_code_label: 'APRIL 15 QUARTERLY REPORT (Q1)',
       };
       const form3X = Form3X.fromJSON(data);
       expect(form3X.formSubLabel).toEqual('APRIL 15 QUARTERLY REPORT (Q1)');

front-end/src/app/shared/models/form-3x.model.ts

@@ -1,8 +1,8 @@
 import { plainToClass, plainToInstance, Transform } from 'class-transformer';
 import { schema as f3xSchema } from 'fecfile-validate/fecfile_validate_js/dist/F3X';
-import { F3xReportCodes, getReportCodeLabel } from '../utils/report-code.utils';
 import { BaseModel } from './base.model';
 import { Report, ReportStatus, ReportTypes } from './report.model';
+import { F3xReportCodes } from '../utils/report-code.utils';
 
 export enum F3xFormTypes {
   F3XN = 'F3XN',
@@ -16,9 +16,11 @@ export class F3xCoverageDates {
   @Transform(BaseModel.dateTransform) coverage_from_date: Date | undefined;
   @Transform(BaseModel.dateTransform) coverage_through_date: Date | undefined;
   report_code: F3xReportCodes | undefined;
+  report_code_label?: string;
 
   // prettier-ignore
-  static fromJSON(json: any): F3xCoverageDates { // eslint-disable-line @typescript-eslint/no-explicit-any
+  static fromJSON(json: any, reportCodeLabel: string): F3xCoverageDates { // eslint-disable-line @typescript-eslint/no-explicit-any
+        json.report_code_label = reportCodeLabel;
         return plainToClass(F3xCoverageDates, json);
     }
 }
@@ -31,7 +33,6 @@ export class Form3X extends Report {
   form_type = F3xFormTypes.F3XN;
   override hasChangeOfAddress = true;
   change_of_address: boolean | undefined;
-  report_code: F3xReportCodes | undefined;
   election_code: string | undefined;
   @Transform(BaseModel.dateTransform) date_of_election: Date | undefined;
   state_of_election: string | undefined;
@@ -148,10 +149,6 @@ export class Form3X extends Report {
   L38_net_operating_expenditures_ytd: number | undefined;
   calculation_status: string | undefined;
 
-  override get reportCode(): F3xReportCodes | undefined {
-    return this.report_code;
-  }
-
   override get coverageDates(): { [date: string]: Date | undefined } {
     return { coverage_from_date: this.coverage_from_date, coverage_through_date: this.coverage_through_date };
   }
@@ -165,11 +162,7 @@ export class Form3X extends Report {
   }
 
   get formSubLabel() {
-    return getReportCodeLabel(this.report_code) ?? '';
-  }
-
-  get reportLabel(): string {
-    return getReportCodeLabel(this.reportCode) ?? '';
+    return this.report_code_label ?? '';
   }
 
   static fromJSON(json: unknown): Form3X {

front-end/src/app/shared/models/form-99.model.ts

@@ -24,10 +24,6 @@ export class Form99 extends Report {
     return textCodes.find(({ value }) => value === this.text_code)?.label ?? '';
   }
 
-  get reportLabel(): string {
-    return '';
-  }
-
   treasurer_last_name: string | undefined;
   treasurer_first_name: string | undefined;
   treasurer_middle_name: string | undefined;