From 23f766717cb2404ea522424c69f1d84c5b3ca0e7 Mon Sep 17 00:00:00 2001
From: Chandra Y <cyemparala@tacc.utexas.edu>
Date: Wed, 4 Dec 2024 10:58:10 -0600
Subject: [PATCH] Bug/WP-792: disable submit if form is not modified. (#384)

---
 .../Admin/EditExceptionModal/EditExceptionModal.tsx   |  2 +-
 .../components/Admin/ViewUsers/EditRecordModal.tsx    | 11 +++++------
 .../Forms/Registrations/RegistrationForm.tsx          |  4 ++--
 .../Submitter/Exceptions/ExceptionFormPage.tsx        |  3 +++
 .../Submitter/Extensions/ExtensionsForm.tsx           |  4 +++-
 5 files changed, 14 insertions(+), 10 deletions(-)

diff --git a/apcd_cms/src/client/src/components/Admin/EditExceptionModal/EditExceptionModal.tsx b/apcd_cms/src/client/src/components/Admin/EditExceptionModal/EditExceptionModal.tsx
index cb7601ae..2e0639ec 100644
--- a/apcd_cms/src/client/src/components/Admin/EditExceptionModal/EditExceptionModal.tsx
+++ b/apcd_cms/src/client/src/components/Admin/EditExceptionModal/EditExceptionModal.tsx
@@ -396,7 +396,7 @@ const EditExceptionModal: React.FC<EditRecordModalProps> = ({
               <Button
                 type="primary"
                 attr="submit"
-                disabled={formik.isSubmitting}
+                disabled={!formik.dirty || formik.isSubmitting}
               >
                 Submit
               </Button>
diff --git a/apcd_cms/src/client/src/components/Admin/ViewUsers/EditRecordModal.tsx b/apcd_cms/src/client/src/components/Admin/ViewUsers/EditRecordModal.tsx
index 12e56dfa..3d0bb5d9 100644
--- a/apcd_cms/src/client/src/components/Admin/ViewUsers/EditRecordModal.tsx
+++ b/apcd_cms/src/client/src/components/Admin/ViewUsers/EditRecordModal.tsx
@@ -3,7 +3,6 @@ import {
   Modal,
   ModalBody,
   ModalHeader,
-  Button,
   Label,
   FormGroup,
   Row,
@@ -15,6 +14,7 @@ import * as Yup from 'yup';
 import { UserRow } from 'hooks/admin';
 import styles from './ViewUsers.module.scss';
 import { formatDate } from 'utils/dateUtil';
+import Button from 'core-components/Button';
 
 interface EditRecordModalProps {
   isOpen: boolean;
@@ -123,7 +123,7 @@ const EditRecordModal: React.FC<EditRecordModalProps> = ({
             validationSchema={validationSchema}
             onSubmit={handleSave}
           >
-            {({ isSubmitting }) => (
+            {({ isSubmitting, dirty }) => (
               <Form>
                 <Row>
                   <Col md={3}>
@@ -236,10 +236,9 @@ const EditRecordModal: React.FC<EditRecordModalProps> = ({
                 </Row>
                 <br />
                 <Button
-                  type="submit"
-                  color="primary"
-                  disabled={isSubmitting}
-                  className={styles.customSubmitButton}
+                  type="primary"
+                  attr="submit"
+                  disabled={isSubmitting || !dirty}
                 >
                   Submit
                 </Button>
diff --git a/apcd_cms/src/client/src/components/Forms/Registrations/RegistrationForm.tsx b/apcd_cms/src/client/src/components/Forms/Registrations/RegistrationForm.tsx
index 3289296f..d097709a 100644
--- a/apcd_cms/src/client/src/components/Forms/Registrations/RegistrationForm.tsx
+++ b/apcd_cms/src/client/src/components/Forms/Registrations/RegistrationForm.tsx
@@ -268,7 +268,7 @@ export const RegistrationForm: React.FC<{
           validationSchema={validationSchema}
           onSubmit={handleSubmit}
         >
-          {({ values, setFieldValue, resetForm }) => (
+          {({ values, setFieldValue, resetForm, dirty }) => (
             useEffect(() => {
               if (isSuccess) {
                 resetForm();
@@ -499,7 +499,7 @@ export const RegistrationForm: React.FC<{
                     type="submit"
                     color="primary"
                     className="form-button"
-                    disabled={registrationSubmissionPending}
+                    disabled={registrationSubmissionPending || !dirty}
                   >
                     Submit
                   </Button>
diff --git a/apcd_cms/src/client/src/components/Submitter/Exceptions/ExceptionFormPage.tsx b/apcd_cms/src/client/src/components/Submitter/Exceptions/ExceptionFormPage.tsx
index 596116cc..4441127c 100644
--- a/apcd_cms/src/client/src/components/Submitter/Exceptions/ExceptionFormPage.tsx
+++ b/apcd_cms/src/client/src/components/Submitter/Exceptions/ExceptionFormPage.tsx
@@ -201,6 +201,7 @@ export const ExceptionFormPage: React.FC = () => {
           isValid,
           submitCount,
           handleSubmit,
+          dirty,
         }) => {
           // To reset values to initial values if the form submits successfully
           useEffect(() => {
@@ -420,6 +421,7 @@ export const ExceptionFormPage: React.FC = () => {
                       <Button
                         type="primary"
                         attr="submit"
+                        disabled={isSubmitting || !dirty}
                         isLoading={isSubmitting}
                         onClick={() => setIsSuccess(false)}
                       >
@@ -439,6 +441,7 @@ export const ExceptionFormPage: React.FC = () => {
                     <Button
                       type="primary"
                       attr="submit"
+                      disabled={isSubmitting || !dirty}
                       isLoading={isSubmitting}
                       onClick={() => setIsSuccess(false)}
                     >
diff --git a/apcd_cms/src/client/src/components/Submitter/Extensions/ExtensionsForm.tsx b/apcd_cms/src/client/src/components/Submitter/Extensions/ExtensionsForm.tsx
index 3419c980..7860ee08 100644
--- a/apcd_cms/src/client/src/components/Submitter/Extensions/ExtensionsForm.tsx
+++ b/apcd_cms/src/client/src/components/Submitter/Extensions/ExtensionsForm.tsx
@@ -129,7 +129,7 @@ export const ExtensionRequestForm: React.FC = () => {
         validationSchema={validationSchema}
         onSubmit={handleSubmit}
       >
-        {({ values, isSubmitting, setFieldValue, resetForm }) => {
+        {({ values, isSubmitting, setFieldValue, resetForm, dirty }) => {
           useEffect(() => {
             if (isSuccess) {
               resetForm();
@@ -269,6 +269,7 @@ export const ExtensionRequestForm: React.FC = () => {
                       <Button
                         type="primary"
                         attr="submit"
+                        disabled={isSubmitting || !dirty}
                         isLoading={isSubmitting}
                         onClick={() => setIsSuccess(false)}
                       >
@@ -288,6 +289,7 @@ export const ExtensionRequestForm: React.FC = () => {
                     <Button
                       type="primary"
                       attr="submit"
+                      disabled={isSubmitting || !dirty}
                       isLoading={isSubmitting}
                       onClick={() => setIsSuccess(false)}
                     >