Merge pull request #3340 from bcgov/NDT-328-Close-Pending-modal-redesign

chore: changes to pending change request
bcgov · Jun 6, 2024 · 5db3b97 · 5db3b97
2 parents 8fe015c + 5d087e4
commit 5db3b97
Show file tree

Hide file tree

Showing 3 changed files with 10 additions and 14 deletions.
diff --git a/app/components/Analyst/PendingChangeRequest/PendingChangeRequest.tsx b/app/components/Analyst/PendingChangeRequest/PendingChangeRequest.tsx
@@ -160,7 +160,6 @@ const PendingChangeRequest = ({ application, isCbc = false }) => {
         }}
         value={isPending ? comment : null}
         onCancel={() => {
-          if (!isUpdateMode) handleChangePendingRequest(!isPending, comment);
           setIsUpdateMode(false);
           pendingChangeRequestModal.close();
         }}

diff --git a/app/components/Analyst/PendingChangeRequest/PendingChangeRequestModal.tsx b/app/components/Analyst/PendingChangeRequest/PendingChangeRequestModal.tsx
@@ -38,17 +38,14 @@ const PendingChangeRequestModal: React.FC<Props> = ({
       actions={[
         {
           id: 'pending-request-change-save-btn',
-          label: 'Save comment',
+          label: 'Save',
           onClick: () => onSave(formData.comment),
-          disabled: value === formData?.comment,
+          disabled: value && value === formData?.comment,
         },
         {
           id: 'pending-request-change-cancel-btn',
           label: 'Cancel',
-          onClick: () => {
-            setFormData({ comment: value });
-            onCancel();
-          },
+          onClick: onCancel,
           variant: 'secondary',
         },
       ]}

diff --git a/app/tests/components/Analyst/PendingChangeRequest.test.tsx b/app/tests/components/Analyst/PendingChangeRequest.test.tsx
@@ -149,7 +149,7 @@ describe('The Pending Change Request component', () => {
       target: { value: 'Edited comment.' },
     });
 
-    const saveButton = screen.getByRole('button', { name: 'Save comment' });
+    const saveButton = screen.getByRole('button', { name: 'Save' });
 
     await act(async () => {
       fireEvent.click(saveButton);
@@ -208,7 +208,7 @@ describe('The Pending Change Request component', () => {
       target: { value: 'Edited comment.' },
     });
 
-    const saveButton = screen.getByRole('button', { name: 'Save comment' });
+    const saveButton = screen.getByRole('button', { name: 'Save' });
 
     await act(async () => {
       fireEvent.click(saveButton);
@@ -307,7 +307,7 @@ describe('The Pending Change Request component', () => {
 
     const saveButton = screen.getByTestId('pending-request-change-save-btn');
 
-    expect(saveButton).toBeDisabled();
+    expect(saveButton).toBeEnabled();
 
     const cancelButton = screen.getByTestId(
       'pending-request-change-cancel-btn'
@@ -338,7 +338,7 @@ describe('The Pending Change Request component', () => {
       target: { value: 'This is a test comment.' },
     });
 
-    const saveButton = screen.getByRole('button', { name: 'Save comment' });
+    const saveButton = screen.getByRole('button', { name: 'Save' });
 
     await act(async () => {
       fireEvent.click(saveButton);
@@ -356,7 +356,7 @@ describe('The Pending Change Request component', () => {
     );
   });
 
-  it('create pending change request comments are mandatory', async () => {
+  it('create pending change request comments are optional', async () => {
     componentTestingHelper.loadQuery(mockEmptyQueryPayload);
     componentTestingHelper.renderComponent();
 
@@ -372,7 +372,7 @@ describe('The Pending Change Request component', () => {
       screen.getByText('Comments on pending changes (optional)')
     ).toBeVisible();
 
-    const cancelButton = screen.getByRole('button', { name: 'Cancel' });
+    const cancelButton = screen.getByRole('button', { name: 'Save' });
 
     await act(async () => {
       fireEvent.click(cancelButton);
@@ -390,7 +390,7 @@ describe('The Pending Change Request component', () => {
     );
   });
 
-  it('pending change request comment edit close button handle modal close only', async () => {
+  it('pending change request close button handle modal close only', async () => {
     componentTestingHelper.loadQuery();
     componentTestingHelper.renderComponent();