From 448caed2491d8a6265b9506cb8c857903d97e13c Mon Sep 17 00:00:00 2001
From: toddlees <todd.lees@tcg.com>
Date: Fri, 27 May 2022 15:54:25 -0400
Subject: [PATCH] defect/312-contribution-amount

---
 .../transaction-container.component.spec.ts   |  2 ++
 .../transaction-group-b.component.html        | 21 ++++++++++++-------
 .../transaction-group-b.component.spec.ts     |  2 ++
 .../app/transactions/transactions.module.ts   |  2 ++
 4 files changed, 20 insertions(+), 7 deletions(-)

diff --git a/front-end/src/app/transactions/transaction-container/transaction-container.component.spec.ts b/front-end/src/app/transactions/transaction-container/transaction-container.component.spec.ts
index bdbae86919..28b66e5fdc 100644
--- a/front-end/src/app/transactions/transaction-container/transaction-container.component.spec.ts
+++ b/front-end/src/app/transactions/transaction-container/transaction-container.component.spec.ts
@@ -19,6 +19,7 @@ import { CalendarModule } from 'primeng/calendar';
 import { CheckboxModule } from 'primeng/checkbox';
 import { InputTextModule } from 'primeng/inputtext';
 import { InputTextareaModule } from 'primeng/inputtextarea';
+import { InputNumberModule } from 'primeng/inputnumber';
 
 describe('TransactionContainerComponent', () => {
   let component: TransactionContainerComponent;
@@ -42,6 +43,7 @@ describe('TransactionContainerComponent', () => {
         CalendarModule,
         CheckboxModule,
         InputTextModule,
+        InputNumberModule,
         InputTextareaModule,
       ],
       declarations: [TransactionContainerComponent, TransactionGroupBComponent],
diff --git a/front-end/src/app/transactions/transaction-group-b/transaction-group-b.component.html b/front-end/src/app/transactions/transaction-group-b/transaction-group-b.component.html
index 1b40fd85b5..1af8b65581 100644
--- a/front-end/src/app/transactions/transaction-group-b/transaction-group-b.component.html
+++ b/front-end/src/app/transactions/transaction-group-b/transaction-group-b.component.html
@@ -210,7 +210,13 @@ <h3>Contribution</h3>
       <div class="col-6">
         <div class="field">
           <label for="contribution_amount">CONTRIBUTION AMOUNT</label>
-          <input type="text" pInputText id="contribution_amount" formControlName="contribution_amount" />
+          <p-inputNumber
+            id="contribution_amount"
+            formControlName="contribution_amount"
+            mode="currency"
+            currency="USD"
+            locale="en-US"
+          ></p-inputNumber>
           <app-error-messages
             [form]="form"
             fieldName="contribution_amount"
@@ -221,14 +227,15 @@ <h3>Contribution</h3>
       <div class="col-6">
         <div class="field">
           <label for="contribution_aggregate">CONTRIBUTION AGGREGATE</label>
-          <input
-            type="text"
-            pInputText
+          <p-inputNumber
             id="contribution_aggregate"
             formControlName="contribution_aggregate"
-            class="readonly"
-            readonly
-          />
+            mode="currency"
+            currency="USD"
+            locale="en-US"
+            [readonly]="true"
+            styleClass="readonly"
+          ></p-inputNumber>
           <app-error-messages
             [form]="form"
             fieldName="contribution_aggregate"
diff --git a/front-end/src/app/transactions/transaction-group-b/transaction-group-b.component.spec.ts b/front-end/src/app/transactions/transaction-group-b/transaction-group-b.component.spec.ts
index 819cd475a4..dcc3892a5e 100644
--- a/front-end/src/app/transactions/transaction-group-b/transaction-group-b.component.spec.ts
+++ b/front-end/src/app/transactions/transaction-group-b/transaction-group-b.component.spec.ts
@@ -20,6 +20,7 @@ import { ContactTypes } from 'app/shared/models/contact.model';
 import { SchATransaction } from 'app/shared/models/scha-transaction.model';
 import { environment } from '../../../environments/environment';
 import { schema as OFFSET_TO_OPEX } from 'fecfile-validate/fecfile_validate_js/dist/OFFSET_TO_OPEX';
+import { InputNumberModule } from 'primeng/inputnumber';
 
 describe('TransactionGroupBComponent', () => {
   let httpTestingController: HttpTestingController;
@@ -63,6 +64,7 @@ describe('TransactionGroupBComponent', () => {
         CalendarModule,
         ButtonModule,
         CheckboxModule,
+        InputNumberModule,
         InputTextModule,
         InputTextareaModule,
       ],
diff --git a/front-end/src/app/transactions/transactions.module.ts b/front-end/src/app/transactions/transactions.module.ts
index 520b3f0811..5372a3e9b2 100644
--- a/front-end/src/app/transactions/transactions.module.ts
+++ b/front-end/src/app/transactions/transactions.module.ts
@@ -18,6 +18,7 @@ import { TransactionsRoutingModule } from './transactions-routing.module';
 import { TransactionContainerComponent } from './transaction-container/transaction-container.component';
 import { TransactionGroupBComponent } from './transaction-group-b/transaction-group-b.component';
 import { TransactionTypePickerComponent } from './transaction-type-picker/transaction-type-picker.component';
+import { InputNumberModule } from 'primeng/inputnumber';
 
 @NgModule({
   declarations: [TransactionContainerComponent, TransactionGroupBComponent, TransactionTypePickerComponent],
@@ -33,6 +34,7 @@ import { TransactionTypePickerComponent } from './transaction-type-picker/transa
     CheckboxModule,
     InputTextModule,
     InputTextareaModule,
+    InputNumberModule,
     CalendarModule,
     ToastModule,
     SharedModule,