Merge pull request #2078 from fecgov/revert-2073-feature/1493

Revert "Feature/1493 - Fixed issues with form submission not working without blur. And fixed issue with currency input breaking."

front-end/cypress/e2e/pages/f3xCashOnHandPage.ts

@@ -12,7 +12,7 @@ export const defaultFormData: F3xCashOnHandFormData = {
 
 export class F3xCashOnHandPage {
   static enterFormData(formData: F3xCashOnHandFormData) {
-    cy.get('app-input-number[formcontrolname="L6a_cash_on_hand_jan_1_ytd"]').safeType(formData['cashOnHand']);
+    cy.get('p-inputnumber[formcontrolname="L6a_cash_on_hand_jan_1_ytd"]').safeType(formData['cashOnHand']);
     PageUtils.calendarSetValue('p-calendar[formcontrolname="cash_on_hand_date"]', formData['date']);
   }
 }

front-end/src/app/layout/feedback-overlay/feedback-overlay.component.ts

@@ -3,7 +3,6 @@ import { FormBuilder, FormGroup, Validators } from '@angular/forms';
 import { Store } from '@ngrx/store';
 import { Feedback } from 'app/shared/models/feedback.model';
 import { FeedbackService } from 'app/shared/services/feedback.service';
-import { blurActiveInput } from 'app/shared/utils/form.utils';
 import { singleClickEnableAction } from 'app/store/single-click.actions';
 import { OverlayPanel } from 'primeng/overlaypanel';
 
@@ -48,7 +47,6 @@ export class FeedbackOverlayComponent {
 
   save() {
     this.formSubmitted = true;
-    blurActiveInput(this.form);
     if (this.form.invalid) {
       this.store.dispatch(singleClickEnableAction());
       return;

front-end/src/app/login/debug-login/debug-login.component.html

@@ -5,12 +5,26 @@ <h3>Debug Login Form</h3>
   <div class="col-12">
     <form [formGroup]="form" (ngSubmit)="doSignIn()">
       <span class="field login-field p-float-label">
-        <input pInputText id="emailId" name="emailId" type="text" formControlName="emailId" />
+        <input
+          pInputText
+          id="emailId"
+          name="emailId"
+          type="text"
+          formControlName="emailId"
+          (keydown.enter)="doSignIn()"
+        />
         <label class="p-float-label" for="emailId">Email</label>
         <app-error-messages [form]="form" fieldName="emailId"></app-error-messages>
       </span>
       <span class="field login-field p-float-label">
-        <input pInputText id="committeeId" name="committeeId" type="text" formControlName="committeeId" />
+        <input
+          pInputText
+          id="committeeId"
+          name="committeeId"
+          type="text"
+          formControlName="committeeId"
+          (keydown.enter)="doSignIn()"
+        />
         <label for="committeeId">Committee ID</label>
         <app-error-messages
           [form]="form"
@@ -26,6 +40,7 @@ <h3>Debug Login Form</h3>
           formControlName="loginPassword"
           [feedback]="false"
           [toggleMask]="true"
+          (keydown.enter)="doSignIn()"
         />
         <label for="loginPassword">Password</label>
         <app-error-messages [form]="form" fieldName="loginPassword"></app-error-messages>

front-end/src/app/login/debug-login/debug-login.component.ts

@@ -3,7 +3,6 @@ import { FormBuilder, FormGroup, Validators } from '@angular/forms';
 import { Router } from '@angular/router';
 import { committeeIdValidator, emailValidator } from 'app/shared/utils/validators.utils';
 import { LoginService } from '../../shared/services/login.service';
-import { blurActiveInput } from 'app/shared/utils/form.utils';
 
 @Component({
   selector: 'app-debug-login',
@@ -30,7 +29,6 @@ export class DebugLoginComponent {
    *
    */
   public doSignIn(): void {
-    blurActiveInput(this.form);
     if (this.form.invalid) {
       return;
     }

front-end/src/app/login/security-notice/security-notice.component.ts

@@ -7,7 +7,6 @@ import { UserLoginData } from 'app/shared/models/user.model';
 import { LoginService } from 'app/shared/services/login.service';
 import { UsersService } from 'app/shared/services/users.service';
 import { DateUtils } from 'app/shared/utils/date.utils';
-import { blurActiveInput } from 'app/shared/utils/form.utils';
 import { singleClickEnableAction } from 'app/store/single-click.actions';
 import { userLoginDataUpdatedAction } from 'app/store/user-login-data.actions';
 import { selectUserLoginData } from 'app/store/user-login-data.selectors';
@@ -50,7 +49,6 @@ export class SecurityNoticeComponent extends DestroyerComponent implements OnIni
 
   signConsentForm() {
     this.formSubmitted = true;
-    blurActiveInput(this.form);
     if (this.form.invalid || !this.userLoginData) {
       this.store.dispatch(singleClickEnableAction());
       return;

front-end/src/app/reports/f1m/main-form/main-form.component.ts

@@ -16,7 +16,6 @@ import { selectActiveReport } from 'app/store/active-report.selectors';
 import { singleClickEnableAction } from 'app/store/single-click.actions';
 import { TransactionContactUtils } from 'app/shared/components/transaction-type-base/transaction-contact.utils';
 import { AffiliatedContact, CandidateContact, F1MCandidateTag, f1mCandidateTags, F1MContact } from './contact';
-import { blurActiveInput } from 'app/shared/utils/form.utils';
 
 @Component({
   selector: 'app-main-form',
@@ -229,7 +228,7 @@ export class MainFormComponent extends MainFormBaseComponent implements OnInit {
 
   public override save(jump: 'continue' | undefined = undefined) {
     this.formSubmitted = true;
-    blurActiveInput(this.form);
+
     if (this.form.invalid) {
       this.store.dispatch(singleClickEnableAction());
       return;

front-end/src/app/reports/f3x/create-workflow/cash-on-hand.component.html

@@ -12,10 +12,13 @@ <h5>
         <div class="col-6">
           <div class="field">
             <label for="L6a_cash_on_hand_jan_1_ytd">BEGINNING CASH ON HAND</label>
-            <app-input-number
+            <p-inputNumber
               inputId="L6a_cash_on_hand_jan_1_ytd"
               formControlName="L6a_cash_on_hand_jan_1_ytd"
-            ></app-input-number>
+              mode="currency"
+              currency="USD"
+              locale="en-US"
+            ></p-inputNumber>
             <app-error-messages
               [form]="form"
               fieldName="L6a_cash_on_hand_jan_1_ytd"

front-end/src/app/reports/f3x/create-workflow/cash-on-hand.component.ts

@@ -11,7 +11,6 @@ import { schema as f3xSchema } from 'fecfile-validate/fecfile_validate_js/dist/F
 import { MessageService } from 'primeng/api';
 import { takeUntil } from 'rxjs';
 import { singleClickEnableAction } from '../../../store/single-click.actions';
-import { blurActiveInput } from 'app/shared/utils/form.utils';
 
 @Component({
   selector: 'app-cash-on-hand',
@@ -49,7 +48,6 @@ export class CashOnHandComponent extends DestroyerComponent implements OnInit {
 
   public save(): void {
     this.formSubmitted = true;
-    blurActiveInput(this.form);
     if (this.form.invalid) {
       this.store.dispatch(singleClickEnableAction());
       return;

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

@@ -25,7 +25,6 @@ import { DestroyerComponent } from 'app/shared/components/app-destroyer.componen
 import { singleClickEnableAction } from '../../../store/single-click.actions';
 import { buildAfterDateValidator, buildNonOverlappingCoverageValidator } from 'app/shared/utils/validators.utils';
 import { CommitteeAccount } from 'app/shared/models/committee-account.model';
-import { blurActiveInput } from 'app/shared/utils/form.utils';
 
 @Component({
   selector: 'app-create-f3x-step1',
@@ -45,9 +44,7 @@ export class CreateF3XStep1Component extends DestroyerComponent implements OnIni
   userCanSetFilingFrequency: boolean = environment.userCanSetFilingFrequency;
   stateOptions: PrimeOptions = [];
   formSubmitted = false;
-  form: FormGroup = this.fb.group(SchemaUtils.getFormGroupFieldsNoBlur(this.formProperties, this.fb), {
-    updateOn: 'blur',
-  });
+  form: FormGroup = this.fb.group(SchemaUtils.getFormGroupFields(this.formProperties));
 
   readonly F3xReportTypeCategories = F3xReportTypeCategories;
   public existingCoverage: F3xCoverageDates[] | undefined;
@@ -183,7 +180,6 @@ export class CreateF3XStep1Component extends DestroyerComponent implements OnIni
 
   public async save(jump: 'continue' | undefined = undefined) {
     this.formSubmitted = true;
-    blurActiveInput(this.form);
     if (this.form.invalid) {
       this.store.dispatch(singleClickEnableAction());
       return;

front-end/src/app/reports/shared/main-form-base.component.ts

@@ -13,7 +13,6 @@ import { Report } from 'app/shared/models/report.model';
 import { singleClickEnableAction } from 'app/store/single-click.actions';
 import { ReportService } from 'app/shared/services/report.service';
 import { JsonSchema } from 'app/shared/interfaces/json-schema.interface';
-import { blurActiveInput } from 'app/shared/utils/form.utils';
 
 @Component({
   template: '',
@@ -41,9 +40,7 @@ export abstract class MainFormBaseComponent extends DestroyerComponent implement
 
   ngOnInit(): void {
     this.reportId = this.activatedRoute.snapshot.params['reportId'];
-    this.form = this.fb.group(SchemaUtils.getFormGroupFieldsNoBlur(this.formProperties, this.fb), {
-      updateOn: 'blur',
-    });
+    this.form = this.fb.group(SchemaUtils.getFormGroupFields(this.formProperties));
     const activeReport$ = this.store.select(selectActiveReport).pipe(takeUntil(this.destroy$));
     const committeeAccount$ = this.store.select(selectCommitteeAccount).pipe(takeUntil(this.destroy$));
 
@@ -75,7 +72,7 @@ export abstract class MainFormBaseComponent extends DestroyerComponent implement
 
   public save(jump: 'continue' | undefined = undefined) {
     this.formSubmitted = true;
-    blurActiveInput(this.form);
+
     if (this.form.invalid) {
       this.store.dispatch(singleClickEnableAction());
       return;

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

@@ -6,7 +6,6 @@ import { DestroyerComponent } from 'app/shared/components/app-destroyer.componen
 import { CommitteeAccount } from 'app/shared/models/committee-account.model';
 import { Report } from 'app/shared/models/report.model';
 import { getReportFromJSON, ReportService } from 'app/shared/services/report.service';
-import { blurActiveInput } from 'app/shared/utils/form.utils';
 import { CountryCodeLabels, LabelUtils, PrimeOptions, StatesCodeLabels } from 'app/shared/utils/label.utils';
 import { SchemaUtils } from 'app/shared/utils/schema.utils';
 import { buildGuaranteeUniqueValuesValidator, emailValidator } from 'app/shared/utils/validators.utils';
@@ -35,9 +34,7 @@ export class SubmitReportStep1Component extends DestroyerComponent implements On
   stateOptions: PrimeOptions = [];
   countryOptions: PrimeOptions = [];
   formSubmitted = false;
-  form: FormGroup = this.fb.group(SchemaUtils.getFormGroupFieldsNoBlur(this.formProperties, this.fb), {
-    updateOn: 'blur',
-  });
+  form: FormGroup = this.fb.group(SchemaUtils.getFormGroupFields(this.formProperties));
   getBackUrl?: (report?: Report) => string;
   getContinueUrl?: (report?: Report) => string;
 
@@ -96,7 +93,6 @@ export class SubmitReportStep1Component extends DestroyerComponent implements On
 
   public async continue(): Promise<void> {
     this.formSubmitted = true;
-    blurActiveInput(this.form);
     if (this.form.invalid || this.report == undefined) {
       this.store.dispatch(singleClickEnableAction());
       return;

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

@@ -9,7 +9,6 @@ import { Report } from 'app/shared/models/report.model';
 import { ApiService } from 'app/shared/services/api.service';
 import { Form3XService } from 'app/shared/services/form-3x.service';
 import { getReportFromJSON, ReportService } from 'app/shared/services/report.service';
-import { blurActiveInput } from 'app/shared/utils/form.utils';
 import { SchemaUtils } from 'app/shared/utils/schema.utils';
 import { passwordValidator } from 'app/shared/utils/validators.utils';
 import { selectActiveReport } from 'app/store/active-report.selectors';
@@ -104,7 +103,6 @@ export class SubmitReportStep2Component extends DestroyerComponent implements On
 
   public submitClicked(): void {
     this.formSubmitted = true;
-    blurActiveInput(this.form);
     if (this.form.invalid) {
       return;
     }

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

@@ -32,7 +32,6 @@ import { TableLazyLoadEvent } from 'primeng/table';
 import { getReportFromJSON } from '../../services/report.service';
 import { ReportTypes } from 'app/shared/models/report.model';
 import { QueryParams } from 'app/shared/services/api.service';
-import { blurActiveInput } from 'app/shared/utils/form.utils';
 
 export class TransactionData {
   id: string;
@@ -357,7 +356,7 @@ export class ContactDialogComponent extends DestroyerComponent implements OnInit
 
   public saveContact(closeDialog = true) {
     this.formSubmitted = true;
-    blurActiveInput(this.form);
+
     if (this.form.invalid) {
       return;
     }

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

@@ -106,7 +106,7 @@ describe('ContactLookupComponent', () => {
         ];
         spyOn(testContactService, 'candidateLookup').and.returnValue(Promise.resolve(testCandidateLookupResponse));
         const testEvent = { query: 'hi' };
-        component.contactTypeFormControl.setValue(ContactTypes.CANDIDATE);
+        component.contactTypeFormControl.setValue('CAN');
         component.onDropdownSearch(testEvent);
         tick(500);
         expect(component.contactLookupList[1].items.length === 0).toBeTrue();
@@ -115,7 +115,7 @@ describe('ContactLookupComponent', () => {
       it('#onDropdownSearch CAN undefined fecfile_candidates', fakeAsync(() => {
         spyOn(testContactService, 'candidateLookup').and.returnValue(Promise.resolve(testCandidateLookupResponse));
         const testEvent = { query: 'hi' };
-        component.contactTypeFormControl.setValue(ContactTypes.CANDIDATE);
+        component.contactTypeFormControl.setValue('CAN');
         component.onDropdownSearch(testEvent);
         tick(500);
         expect(component.contactLookupList[0].items.length === 0).toBeTrue();
@@ -132,7 +132,7 @@ describe('ContactLookupComponent', () => {
         ];
         spyOn(testContactService, 'candidateLookup').and.returnValue(Promise.resolve(testCandidateLookupResponse));
         const testEvent = { query: 'hi' };
-        component.contactTypeFormControl.setValue(ContactTypes.CANDIDATE);
+        component.contactTypeFormControl.setValue('CAN');
         component.onDropdownSearch(testEvent);
         tick(500);
         expect(
@@ -163,7 +163,7 @@ describe('ContactLookupComponent', () => {
         ];
         spyOn(testContactService, 'committeeLookup').and.returnValue(of(testCommitteeLookupResponse));
         const testEvent = { query: 'hi' };
-        component.contactTypeFormControl.setValue(ContactTypes.COMMITTEE);
+        component.contactTypeFormControl.setValue('COM');
         component.onDropdownSearch(testEvent);
         expect(component.contactLookupList[1].items.length === 0).toBeTrue();
       }));
@@ -178,7 +178,7 @@ describe('ContactLookupComponent', () => {
         ];
         spyOn(testContactService, 'committeeLookup').and.returnValue(of(testCommitteeLookupResponse));
         const testEvent = { query: 'hi' };
-        component.contactTypeFormControl.setValue(ContactTypes.COMMITTEE);
+        component.contactTypeFormControl.setValue('COM');
         component.onDropdownSearch(testEvent);
         expect(component.contactLookupList[0].items.length === 0).toBeTrue();
       }));
@@ -199,7 +199,7 @@ describe('ContactLookupComponent', () => {
         ];
         spyOn(testContactService, 'committeeLookup').and.returnValue(of(testCommitteeLookupResponse));
         const testEvent = { query: 'hi' };
-        component.contactTypeFormControl.setValue(ContactTypes.COMMITTEE);
+        component.contactTypeFormControl.setValue('COM');
         component.onDropdownSearch(testEvent);
         expect(
           JSON.stringify(component.contactLookupList) ===
@@ -223,7 +223,7 @@ describe('ContactLookupComponent', () => {
       it('#onDropdownSearch IND undefined fecfile_individuals', fakeAsync(() => {
         spyOn(testContactService, 'individualLookup').and.returnValue(of(testIndividualLookupResponse));
         const testEvent = { query: 'hi' };
-        component.contactTypeFormControl.setValue(ContactTypes.INDIVIDUAL);
+        component.contactTypeFormControl.setValue('IND');
         component.onDropdownSearch(testEvent);
         tick(500);
         expect(component.contactLookupList[0].items.length === 0).toBeTrue();
@@ -240,7 +240,7 @@ describe('ContactLookupComponent', () => {
         ];
         spyOn(testContactService, 'individualLookup').and.returnValue(of(testIndividualLookupResponse));
         const testEvent = { query: 'hi' };
-        component.contactTypeFormControl.setValue(ContactTypes.INDIVIDUAL);
+        component.contactTypeFormControl.setValue('IND');
         component.onDropdownSearch(testEvent);
         tick(500);
         expect(
@@ -267,7 +267,7 @@ describe('ContactLookupComponent', () => {
       it('#onDropdownSearch ORG undefined fecfile_organizations', fakeAsync(() => {
         spyOn(testContactService, 'organizationLookup').and.returnValue(of(testOrganizationLookupResponse));
         const testEvent = { query: 'hi' };
-        component.contactTypeFormControl.setValue(ContactTypes.ORGANIZATION);
+        component.contactTypeFormControl.setValue('ORG');
         component.onDropdownSearch(testEvent);
         tick(500);
         expect(component.contactLookupList[0].items.length === 0).toBeTrue();
@@ -283,7 +283,7 @@ describe('ContactLookupComponent', () => {
         ];
         spyOn(testContactService, 'organizationLookup').and.returnValue(of(testOrganizationLookupResponse));
         const testEvent = { query: 'hi' };
-        component.contactTypeFormControl.setValue(ContactTypes.ORGANIZATION);
+        component.contactTypeFormControl.setValue('ORG');
         component.onDropdownSearch(testEvent);
         tick(500);
         expect(

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

@@ -57,8 +57,8 @@ export class ContactLookupComponent extends DestroyerComponent implements OnInit
   contactTypeLabels: LabelList = ContactTypeLabels;
   candidateOfficeLabel?: string;
 
-  contactTypeFormControl = new FormControl<ContactTypes | null>(null, { updateOn: 'change' });
-  searchBoxFormControl = new FormControl('', { updateOn: 'change' });
+  contactTypeFormControl = new FormControl();
+  searchBoxFormControl = new FormControl();
 
   searchTerm = '';
 
@@ -77,13 +77,10 @@ export class ContactLookupComponent extends DestroyerComponent implements OnInit
       this.candidateOfficeLabel = LabelUtils.get(CandidateOfficeTypeLabels, this.candidateOffice);
     }
 
-    this.contactTypeFormControl.valueChanges
-      .pipe(takeUntil(this.destroy$))
-      .subscribe((contactType: ContactTypes | null) => {
-        if (!contactType) return;
-        this.contactType = contactType;
-        this.contactTypeSelect.emit(contactType);
-      });
+    this.contactTypeFormControl.valueChanges.pipe(takeUntil(this.destroy$)).subscribe((contactType: ContactTypes) => {
+      this.contactType = contactType;
+      this.contactTypeSelect.emit(contactType);
+    });
   }
 
   // eslint-disable-next-line @typescript-eslint/no-explicit-any