Sign Button Remove Asyn | Add Loader | Added Decline Reason in Transaction View | ... 08-10

src/components/process/processStepTwo/NavTwo.tsx

@@ -28,6 +28,7 @@ interface NavTwoProps {
     isPreview?: boolean
     aId?: string | null
     tId?: string | null
+    onSendClick?: () => void;
 }
 
 
@@ -65,7 +66,8 @@ const NavTwo: React.FC<NavTwoProps> = ({
     setIsSend,
     isPreview = false,
     aId = null,
-    tId = null
+    tId = null,
+    onSendClick,
 }) => {
     let transactionTemplateToggle = TRANSACTION_TEMPLATE_TOGGLE.TRANSACTIONS;
     const dispatch = useDispatch();
@@ -175,55 +177,25 @@ const NavTwo: React.FC<NavTwoProps> = ({
             return
         }
 
-        if (isSend === null) {
-            setIsSend(false);
-        }
-        setIsSend(!isSend);
+        // if (isSend === null) {
+        //     setIsSend(false);
+        // }
+        // setIsSend(!isSend);
 
-        setTimeout(() => {
+        // setTimeout(() => {
             if (transactionTemplateToggle === TRANSACTION_TEMPLATE_TOGGLE.TRANSACTIONS) {
                 if (isSignSend) {
                     window.open(`./../../../sign/${selfUserSign.recipientId}`, "_self");
                 }
                 else {
-                    navigate(`/transaction-sent/${accountId}/${transactionId}`, { replace: true })
+                    onSendClick();
                 }
             } else {
                 navigate(`/templates`);
-                // toast.success("Template Saved...!", {
-                //     position: "top-center",
-                //     autoClose: 1500,
-                //     hideProgressBar: false,
-                //     closeOnClick: false,
-                //     pauseOnHover: true,
-                //     draggable: true,
-                //     progress: undefined,
-                //     theme: "light",
-                //     transition: Bounce,
-                // });
             }
-        }, 1000)
+        // }, 1000)
     }
 
-
-    // const handleSetIsFields = (setTo: boolean) => {
-    //     if (setTo !== undefined && setTo !== isFields) {
-    //         setIsFields(setTo)
-    //         if(setTo === true) {
-    //             setIsPages(false)
-    //         }
-    //     };
-    // }
-
-    // const handleSetIsPages = (setTo: boolean) => {
-    //     if (setTo !== undefined && setTo !== isPages) {
-    //         setIsPages(setTo)
-    //         if(setTo === true) {
-    //             setIsFields(false)
-    //         }
-    //     };
-    // }
-
     const zoom = (percentage: number, contentClass: string) => {
         const content = document.querySelector(`.${contentClass}`);
         if (content) {

src/components/process/processStepTwo/ProcessStepTwo.tsx

@@ -1,8 +1,8 @@
-import { useEffect, useState } from 'react'
+import { useEffect, useRef, useState } from 'react'
 
 import NavTwo from './NavTwo';
 import LeftSideBar from './LeftSideBar';
-import DocumentContainer from './DocumentContainer';
+import DocumentContainer, { DocumentContainerRef } from './DocumentContainer';
 
 import { useDispatch, useSelector } from 'react-redux';
 import { RootState } from '../../../store/store';
@@ -48,21 +48,27 @@ const ProcessStepTwo = () => {
   }
 
   const handleSetIsPages = (setTo: boolean) => {
-        if (setTo !== undefined && setTo !== isPages) {
-            setIsPages(setTo)
-            if(setTo === true) {
-                setIsFields(false)
-            }
-        };
-    }
+    if (setTo !== undefined && setTo !== isPages) {
+      setIsPages(setTo)
+      if (setTo === true) {
+        setIsFields(false)
+      }
+    };
+  }
+
+  const docRef = useRef<DocumentContainerRef>(null);
+
+  const handleSendClick = () => {
+    docRef.current?.handleTransactionProcess();
+  };
 
   return (
     <div className={`min-w-full relative h-screen bg-slate-100 overflow-hidden ${(globalLoader.isLoading) ? 'pointer-events-none' : ''}`}>
-      <NavTwo transactionSaving={transactionSaving} isFields={isFields} isPages={isPages} setIsPages={setIsPages} setIsFields={setIsFields} isSend={isSend} setIsSend={setIsSend} />
+      <NavTwo transactionSaving={transactionSaving} isFields={isFields} isPages={isPages} setIsPages={setIsPages} setIsFields={setIsFields} isSend={isSend} setIsSend={setIsSend} onSendClick={handleSendClick} />
 
       <div className='sm:grid sm:grid-cols-12 sm:gap-1 mt-1 h-[calc(100vh-46px)] overflow-hidden'>
         <LeftSideBar isFields={isFields} isPages={isPages} selectedRecipientIndx={selectedRecipient} setSelectedRecipient={setSelectedRecipient} handleSetIsFields={handleSetIsFields} handleSetIsPages={handleSetIsPages} />
-        <DocumentContainer transactionSaving={transactionSaving} setTransactionSaving={setTransactionSaving} isSend={isSend} setIsSend={setIsSend} />
+        <DocumentContainer ref={docRef} transactionSaving={transactionSaving} setTransactionSaving={setTransactionSaving} isSend={isSend} setIsSend={setIsSend} />
       </div>
 
       {globalLoader.isLoading && <Loader />}

src/components/transactions/TransactionView.tsx

@@ -205,6 +205,9 @@ const TransactionView = () => {
                                                         {"message" in recipient && <p className="text-xs text-gray-500 italic">
                                                             {recipient.message}
                                                         </p>}
+                                                        {"declineReason" in recipient && <p className="text-xs text-gray-500 italic">
+                                                            {recipient.declineReason}
+                                                        </p>}
                                                     </div>
                                                 </div>