Show loader on form submissions

src/components/forms/AccountForm.js

@@ -190,7 +190,9 @@ const AccountForm = props => {
   }, []);
 
   const handleSumit = async (e) => {
+    let isMounted = true;
     try {
+      setShowLoader(true);
       e.preventDefault();
       setErrorMessage('');
       setInvalidName(false);
@@ -296,8 +298,10 @@ const AccountForm = props => {
       });
 
       if (props.type === 'setup') {
+        isMounted = false;
         history.push('/create-application');
       } else {
+        isMounted = false;
         history.push('/internal/accounts');
         const dispatchMessage = props.type === 'add'
           ? 'Account created successfully'
@@ -314,6 +318,7 @@ const AccountForm = props => {
       if (err.response && err.response.status === 401) {
         localStorage.removeItem('token');
         sessionStorage.clear();
+        isMounted = false;
         history.push('/');
         dispatch({
           type: 'ADD',
@@ -324,6 +329,10 @@ const AccountForm = props => {
         setErrorMessage((err.response && err.response.data && err.response.data.msg) || 'Something went wrong, please try again.');
         console.log(err.response || err);
       }
+    } finally {
+      if (isMounted) {
+        setShowLoader(false);
+      }
     }
   };
 

src/components/forms/ApplicationForm.js

@@ -216,7 +216,9 @@ const ApplicationForm = props => {
 
 
   const handleSumit = async (e) => {
+    let isMounted = true;
     try {
+      setShowLoader(true);
       e.preventDefault();
       setErrorMessage('');
       setInvalidName(false);
@@ -350,8 +352,10 @@ const ApplicationForm = props => {
       });
 
       if (props.type === 'setup') {
+        isMounted = false;
         history.push('/configure-sip-trunk');
       } else {
+        isMounted = false;
         history.push('/internal/applications');
         const dispatchMessage = props.type === 'add'
           ? 'Application created successfully'
@@ -367,6 +371,7 @@ const ApplicationForm = props => {
       if (err.response && err.response.status === 401) {
         localStorage.removeItem('token');
         sessionStorage.clear();
+        isMounted = false;
         history.push('/');
         dispatch({
           type: 'ADD',
@@ -377,6 +382,10 @@ const ApplicationForm = props => {
         setErrorMessage((err.response && err.response.data && err.response.data.msg) || 'Something went wrong, please try again.');
         console.log(err.response || err);
       }
+    } finally {
+      if (isMounted) {
+        setShowLoader(false);
+      }
     }
   };
 

src/components/forms/PhoneNumberForm.js

@@ -184,7 +184,9 @@ const PhoneNumberForm = props => {
   }, []);
 
   const handleSubmit = async e => {
+    let isMounted = true;
     try {
+      setShowLoader(true);
       e.preventDefault();
       setErrorMessage('');
       setInvalidPhoneNumber(false);
@@ -287,6 +289,7 @@ const PhoneNumberForm = props => {
         message: dispatchMessage
       });
 
+      isMounted = false;
       history.push('/internal/phone-numbers');
     } catch (err) {
       setErrorMessage(
@@ -294,6 +297,10 @@ const PhoneNumberForm = props => {
         'Something went wrong, please try again.'
       );
       console.log(err.response || err);
+    } finally {
+      if (isMounted) {
+        setShowLoader(false);
+      }
     }
   };
 

src/components/forms/SipTrunkForm.js

@@ -210,7 +210,9 @@ const SipTrunkForm = props => {
   };
 
   const handleSumit = async e => {
+    let isMounted = true;
     try {
+      setShowLoader(true);
       e.preventDefault();
       setErrorMessage('');
       resetInvalidFields();
@@ -492,8 +494,10 @@ const SipTrunkForm = props => {
       }
 
       if (props.type === 'setup') {
+        isMounted = false;
         history.push('/setup-complete');
       } else {
+        isMounted = false;
         history.push('/internal/sip-trunks');
         const dispatchMessage = props.type === 'add'
           ? 'SIP trunk created successfully'
@@ -509,6 +513,7 @@ const SipTrunkForm = props => {
       if (err.response && err.response.status === 401) {
         localStorage.removeItem('token');
         sessionStorage.clear();
+        isMounted = false;
         history.push('/');
         dispatch({
           type: 'ADD',
@@ -519,6 +524,10 @@ const SipTrunkForm = props => {
         setErrorMessage((err.response && err.response.data && err.response.data.msg) || 'Something went wrong, please try again.');
         console.log(err.response || err);
       }
+    } finally {
+      if (isMounted) {
+        setShowLoader(false);
+      }
     }
   };