src/components/accounts/Account.tsx

@@ -19,8 +19,6 @@ import {
     FaCalendarAlt
 } from 'react-icons/fa';
 import TransactionDataTable from "./TransactionDataTable";
-import { useSelector } from "react-redux";
-import { RootState } from "../../store/store";
 
 interface Transaction {
     id: number;
@@ -123,8 +121,6 @@ const Account = () => {
 
     const [isModalOpen, setIsModalOpen] = useState(false);
 
-    const userData = useSelector((state: RootState) => state.user);
-
     // const getUserDetails = async () => {
     //     try {
     //         let res = await api.get('/api/user/details')
@@ -174,7 +170,7 @@ const Account = () => {
         };
 
         try {
-            const res = await api.get(`/api/accounts/${userData.account.id}/dashboard`, { params: payload });
+            const res = await api.get('/api/dashboard', { params: payload });
             console.log("Dashboard Data:", res.data);
             const cardDataArray = mapApiDataToCards(res.data);
             setCards(cardDataArray);

src/components/contacts/Contacts.tsx

@@ -5,7 +5,6 @@ import ContactFormModal, { ContactData } from './ContactsFormModal';
 import { Bounce, toast } from 'react-toastify';
 import { IoMdAdd } from 'react-icons/io';
 import LoaderUi from '../../helper/LoaderUi';
-import logoRecord from '../../assets/record.svg'
 
 type ContactSchema = [{
     id: number,
@@ -147,15 +146,7 @@ const Contacts = () => {
                                 </tr>
                             ) : contacts.length === 0 ? (
                                 <tr>
-                                                <td colSpan="4" className="text-center py-10 text-gray-500">
+                                    <td colSpan="4" className="text-center py-4">No contacts found.</td>
-                                                  <div className="flex flex-col items-center justify-center">
-                                                    <img
-                                                      src={logoRecord}
-                                                      alt="Record Not Found"
-                                                      className="w-70 h-70 mb-4 opacity-70" // adjust size and appearance
-                                                    />
-                                                  </div>
-                                                </td>
                                 </tr>
                             ) : (
                                 contacts.map((contact) => (

src/components/home/Home.tsx

@@ -14,8 +14,6 @@ import {
     FaFilter,
     FaCalendarAlt
 } from 'react-icons/fa';
-import { useSelector } from 'react-redux';
-import { RootState } from '../../store/store';
 
 interface CardData {
     title: string;
@@ -84,8 +82,6 @@ const Home = () => {
     const [cards, setCards] = useState<CardData[]>([]);
     const [isLoading, setIsLoading] = useState<boolean>(false);
 
-    const userData = useSelector((state : RootState) => state.user);
-
     console.log("activeAccountId", activeAccountId);
     console.log("cards", cards);
 
@@ -98,7 +94,7 @@ const Home = () => {
         };
 
         try {
-            const res = await api.get(`/api/accounts/${userData.account.id}/dashboard`, { params: payload });
+            const res = await api.get('/api/dashboard', { params: payload });
             setDashboardData(res.data);
             console.log("Dashboard Data:", res.data);
             const cardDataArray = mapApiDataToCards(res.data);

src/components/process/CompletionScreen/DocumentCompletionScreen.tsx

@@ -19,8 +19,7 @@ import { Link, useNavigate, useParams } from "react-router-dom";
 import Loader from "../../dashboard/Loader";
 import confetti from 'canvas-confetti'
 import { IoClose } from "react-icons/io5";
-import { IoMdClose, IoMdHome } from "react-icons/io";
+import { IoMdHome } from "react-icons/io";
-import { Bounce, toast } from "react-toastify";
 
 type Signer = {
     id: number;
@@ -223,19 +222,6 @@ const DocumentCompletionScreen = () => {
     }, [])
 
     useEffect(() => {
-        // toast.dismiss();
-        // toast.success("Your document has been successfully sent for signature.", {
-        //     position: "top-center",
-        //     autoClose: 1500,
-        //     hideProgressBar: false,
-        //     closeOnClick: false,
-        //     pauseOnHover: true,
-        //     draggable: true,
-        //     progress: undefined,
-        //     theme: "light",
-        //     transition: Bounce,
-        // });
-
         if (showConfetti) {
             const duration = 3000;
             const end = Date.now() + duration;
@@ -247,63 +233,76 @@ const DocumentCompletionScreen = () => {
                 }
 
                 confetti({
-                    particleCount: 5,    // fewer particles per burst for smoothness
+                    particleCount: 80, // more particles
-                    angle: 90,           // falling straight down
+                    angle: Math.random() * 360, // fire in random direction
-                    spread: 30,          // slight spread
+                    spread: 220, // wider spread
-                    startVelocity: 8,    // gentle falling speed
+                    startVelocity: 15, // more power
+                    scalar: 1.2, // bigger pieces (default is 1)
                     origin: {
-                        x: Math.random(), // random horizontal position across the top
+                        x: Math.random(),
-                        y: 0,
+                        y: Math.random() * 0.6,
                     },
-                    scalar: 1,
                     zIndex: 9999,
                 });
-            }, 50);  // fire every 50ms for continuous effect
+            }, 350); // fire every 150ms
-
-            return () => clearInterval(interval);
         }
     }, [showConfetti]);
 
-
-
     return (
         <>
+            <>
+                {
+                    showConfetti && (
+                        <div className="absolute top-0 left-0 w-full h-full z-[9999] bg-white/80 backdrop-blur-sm flex items-center justify-center">
+                            {/* <Confetti width={width} height={height} /> */}
+
+                            <div className="relative bg-white bg-opacity-90 backdrop-blur-lg border border-green-200 shadow-xl rounded-md px-8 py-6 w-[90%] max-w-sm text-center animate-fade-in-up">
+                                {/* Close Icon */}
+                                <button
+                                    onClick={() => setShowConfetti(false)} // or whatever logic hides the modal
+                                    className="absolute top-2 right-2 text-gray-500 hover:text-gray-700"
+                                    aria-label="Close"
+                                >
+                                    <IoClose className="text-2xl" />
+                                </button>
+
+                                {/* Success Icon */}
+                                <FaCheckCircle className="text-green-500 text-5xl mb-4 mx-auto drop-shadow-lg" />
+
+                                {/* Message */}
+                                <h2 className="text-2xl font-semibold text-gray-800 mb-1">Transaction Successful</h2>
+                                <p className="text-gray-600 text-sm">Your transaction has been created and saved successfully.</p>
+                            </div>
+                        </div>
+                    )
+                }
+            </>
             <div className="min-h-screen bg-[var(--mainViewBg)]">
                 {/* Top Banner */}
-                <div className='fixed top-0 w-full flex items-center justify-between bg-white shadow z-50 px-4 py-3'>
+
-                    <div className='flex items-center gap-2'>
+                <div className="w-full px-6 py-2  bg-white border-b rounded-sm border-gray-200">
-                        <Link to={"/"}>
+                    <div className="max-w-[97vw] mx-auto px-2 py-2.5">
-                            <IoMdHome
+                        <div className="flex items-center justify-between">
-                                className='text-2xl text-slate-500 cursor-pointer hover:text-[var(--primary)] transition'
+                            <div className="flex items-center gap-3">
-                            />
+                                <Link to='/' className="w-5 h-5 text-green-700  rounded-full flex items-center justify-center">
+                                    <IoMdHome className="h-10 w-10" />
                                 </Link>
-                        <p className="text-base font-normal text-gray-700 border-l pl-4">🎉 Awesome! The document’s been sent for signature. 🎉</p>
+                                {/* <div className="w-5 h-5 bg-white text-green-800 rounded-full flex items-center justify-center">
+                                    <FaCheck className="text-sm" />
+                                </div> */}
+                                <div>
+                                    <h2 className="text-md font-semibold text-gray-900">Awesome! Your document is sent for signature</h2>
+                                </div>
                             </div>
-
-                    <div
-                        id="add-tags-btn-step-one"
-                        className='flex items-center gap-3'>
-
                             <Link to={`/accounts/${accountId}/transactions/${transactionId}`} className="flex items-center gap-2 cursor-pointer text-xs px-4 py-2 ml-3 rounded-sm bg-[var(--primary)]">
                                 <FaPen className=" text-white text-md" />
                                 <span className="tracking-wide text-white">Edit</span>
                             </Link>
-
-                        {/* <button
-                            onClick={() => handleNextClick(false)}
-                            className="text-sm px-4 py-2 rounded bg-[var(--primary)] text-white shadow hover:bg-[var(--primaryLight2)] transition cursor-pointer"
-                        >
-                            {signType === SignTypeEnum.selfSign ? "Sign" : "Next"}
-                        </button> */}
-
                         </div>
                     </div>
-
+                </div>
-
-
-
                 {(selectedRecipients.length > 0 && selectedDocuments.length > 0) ?
-                    <div className="p-3 mt-[55px]">
+                    <div className="p-3">
                         <div className="max-w-[97vw] mx-auto">
                             {/* Header */}
                             <div className="grid grid-cols-1 lg:grid-cols-12 gap-2">

src/components/process/processStepOne/ProcessStepOne.tsx

@@ -196,7 +196,6 @@ const ProcessStepOne = () => {
       const recipientsData = selectedRecipients.map((recipient, index) => ({
         id: "id" in recipient ? recipient.id : null,
         routingOrder: "routingOrder" in recipient && recipient.routingOrder ? recipient.routingOrder : 1,
-        provideOwnTags: userData.email === recipient.email ? true : false,
         type: recipient.type,
         firstName: recipient.firstName,
         lastName: recipient.lastName,
@@ -265,16 +264,19 @@ const ProcessStepOne = () => {
         }
 
       } else {
-       await dispatch(addRecipientAsync({ recipientsData: recipientsDataTemp, accountId, transactionId }));
+        dispatch(addRecipientAsync({ recipientsData: recipientsDataTemp, accountId, transactionId }));
       }
       dispatch(showLoader("Processing Message..."));
 
+      console.log(`1/api/accounts/${accountId}/${transactionTemplateToggle}/${transactionId}`)
+
       let res = await api.put(`/api/accounts/${accountId}/${transactionTemplateToggle}/${transactionId}`, {
         name: templateName,
         subject: emailDtls.subject, message: emailDtls.message,
         status: "CREATED"
       })
 
+      console.log("Line 158", res.data)
       if (isSendNow) {
         dispatch(updateTransactionStatus(TRANSACTION_STATUS_ENUMS.TRANSACTION_SEND_SUCCESS));
         setTimeout(() => {

src/components/process/processStepOne/RecipientAddCard.tsx

@@ -11,7 +11,6 @@ import { FiEdit, FiTrash } from "react-icons/fi";
 import { v4 as uuidv4 } from 'uuid';
 
 
-
 interface ContactType {
   id: string;
   email: string;

src/components/process/processStepTwo/DocumentContainer.tsx

@@ -20,7 +20,6 @@ import Loader from '../../dashboard/Loader';
 // import { TRANSACTION_TEMPLATE_TOGGLE } from "../../../store/slices/selectedRecipientsSlice";
 import { handleGroupBorderPosition } from '../../../utlity/tagGroupConUtils';
 import { hideLoader, showLoader } from '../../../store/slices/loaderSlice';
-import { IsSendInterface } from './ProcessStepTwo';
 
 export interface DroppedItemsObj {
     [key: string]: DroppedItem[]
@@ -75,12 +74,9 @@ const DocumentContainer: React.FC<DocumentContainerProps> = ({ isSend }) => {
         selectedDocuments.length === 0 && dispatch(fetchDocuments({ accountId, transactionId }));
     }, [])
 
-    console.log(droppedItems, "line 78")
-
     // FETCHING TAG - START
     useEffect(() => {
         if (selectedRecipients.length === 0) return;
-
         const fetchTags = async () => {
             try {
                 const requests = selectedRecipients.map((recipient) =>
@@ -180,22 +176,17 @@ const DocumentContainer: React.FC<DocumentContainerProps> = ({ isSend }) => {
                     return [recipientId, tags.map(tag => ({ ...tag, update: false }))];
                 })
             )
-
-            console.log(droppedItemsUpdateFalse, "Line 182")
-
             setDroppedItems(droppedItemsUpdateFalse);
         } catch (error) {
             console.error("Error submitting recipient tags:", error);
         }
     };
 
+    // Save Tags - START
+    useEffect(() => {
+        if (isSend === null) return;
 
-    const handleTransactionProcess = async (save: boolean = false) => {
+        dispatch(showLoader("Loading ..."))
-        console.log(droppedItems, "called Line 189");
-        
-        if (!save && isSend === null) return;
-
-        !save && dispatch(showLoader("Loading ..."))
 
         let updatedTags = { ...droppedItems }
 
@@ -300,37 +291,17 @@ const DocumentContainer: React.FC<DocumentContainerProps> = ({ isSend }) => {
 
         tagsData = groupByRecipientId(tagsData);
 
-        console.log(tagsData, "Line 302");
+        sendTagsToRecipients(tagsData, accountId, transactionId);
 
-        await sendTagsToRecipients(tagsData, accountId, transactionId);
+        (async () => {
-
+            const res = await api.put(`/api/accounts/${accountId}/${transactionTemplateToggle}/${transactionId}`, { status: "SENT" })
-
+            // const res = await api.put(`/api/accounts/${accountId}/transactions/${transactionId}`, { status: "SENT" })
-        // SENDING Transaction - START
+            console.log(res, "Check123")
-        // if (!save) {
+            dispatch(hideLoader())
-        //     const res = await api.put(`/api/accounts/${accountId}/${transactionTemplateToggle}/${transactionId}`, { status: "SENT" })
+        })()
-        //     // const res = await api.put(`/api/accounts/${accountId}/transactions/${transactionId}`, { status: "SENT" })
-        //     console.log(res, "Check123")
-        //     dispatch(hideLoader())
-        // }
-
-        // SENDING Transaction - END
-
-    }
-
-    // Save Tags - START
-    useEffect(() => {
-        handleTransactionProcess()
     }, [isSend])
     // Save Tags - END
 
-    // useEffect(() => {
-    //     setTimeout(() => {
-    //         setInterval(async () => {
-    //             await handleTransactionProcess(true);
-    //         }, 8000)
-    //     }, 8000)
-    // }, [])
-
     const handleDragOver = (event: React.DragEvent<HTMLDivElement>) => {
         event.preventDefault(); // Allows the drop event to work
     };
@@ -1055,9 +1026,9 @@ const DocumentContainer: React.FC<DocumentContainerProps> = ({ isSend }) => {
                                                         const IconComponent = typeToIconMap[type] || <FaQuestionCircle />;
                                                         const selectedRecipient = selectedRecipients.filter((obj, indx) => obj.id === item.recipientId);
                                                         return (
-                                                            <React.Fragment key={index}>
+                                                            <>
                                                                 <div
-                                                                    // key={index}
+                                                                    key={index}
                                                                     draggable="false"
                                                                     className="absolute rounded dropped-item"
                                                                     onClick={() => handleTagClick(key, index)}
@@ -1119,7 +1090,6 @@ const DocumentContainer: React.FC<DocumentContainerProps> = ({ isSend }) => {
 
                                                                 </div>
 
-                                                                <>
                                                                 {
                                                                     "group" in item && item.group && "isGroupExist" in item && !item.isGroupExist &&
                                                                     <>
@@ -1132,9 +1102,8 @@ const DocumentContainer: React.FC<DocumentContainerProps> = ({ isSend }) => {
                                                                     </>
 
                                                                 }
-                                                                </>
 
-                                                            </React.Fragment>
+                                                            </>
                                                         )
                                                     }
 
@@ -1177,11 +1146,7 @@ const DocumentContainer: React.FC<DocumentContainerProps> = ({ isSend }) => {
 
             </div >
 
-                {
+            {selectedTag && <RightSideBar selectedTag={droppedItems[selectedTag.key][selectedTag.index]} setDroppedItems={setDroppedItems} selTagKey={selectedTag.key} selTagIndx={selectedTag.index} DirectionalControlsProps={{
-                    console.log(selectedTag, droppedItems, "Line 1175")
-                }
-
-            {selectedTag && selectedTag !== null && "key" in selectedTag && "index" in selectedTag && <RightSideBar selectedTag={droppedItems[selectedTag.key][selectedTag.index]} setDroppedItems={setDroppedItems} selTagKey={selectedTag.key} selTagIndx={selectedTag.index} DirectionalControlsProps={{
                 onMove: directionalControlsHandler,
                 onPositionChange: handleDirectPositionChange,
                 disabled: false,

src/components/process/processStepTwo/NavTwo.tsx

@@ -7,7 +7,7 @@ import { FaCheck, FaSignature } from 'react-icons/fa'
 import { IoIosDocument } from 'react-icons/io'
 import { LuTableOfContents } from 'react-icons/lu'
 import { MdKeyboardArrowDown } from 'react-icons/md'
-import { RiResetRightLine } from 'react-icons/ri'
+import { RiResetLeftLine, RiResetRightLine } from 'react-icons/ri'
 import { fetchRecipients, toggleToTemplates, TRANSACTION_TEMPLATE_TOGGLE } from '../../../store/slices/selectedRecipientsSlice'
 import { fetchDocuments } from '../../../store/slices/documentSlice'
 import { useNavigate, useParams } from 'react-router-dom'
@@ -66,68 +66,28 @@ const NavTwo: React.FC<NavTwoProps> = ({ isFields, setIsFields, isSend, setIsSen
 
     const [isFitDd, setIsFitDd] = useState<boolean>(false)
     const [selFitIndx, setSelFitIndx] = useState<number>(0);
-    const [selfUserSign, setSelfUserSign] = useState({ sign: false, recipientId: 0 });
 
     const navigate = useNavigate()
 
     const selectedRecipients = useSelector((state: RootState) => state.selectedRecipients.recipients)
     const selectedDocuments = useSelector((state: RootState) => state.documents.documents)
-    const userDetails = useSelector((state: RootState) => state.user);
 
     useEffect(() => {
-        if (selectedRecipients.length || selectedDocuments.length) return;
+        selectedRecipients.length === 0 && dispatch(fetchRecipients({ accountId, transactionId }));
-        (async () => {
+        selectedDocuments.length === 0 && dispatch(fetchDocuments({ accountId, transactionId }));
-            selectedRecipients.length === 0 && await dispatch(fetchRecipients({ accountId, transactionId }));
-            selectedDocuments.length === 0 && await dispatch(fetchDocuments({ accountId, transactionId }));
-        })()
     }, [])
 
-    useEffect(() => {
-        if (selectedRecipients.length > 0) {
-            let minRoutingOrder: number = Infinity;
-            let userEmailPresent = {
-                present: false,
-                routingOrder: 0,
-                recipientId: 0
-            };
-            // Getting Minimum RoutingOrder
-            for (let i = 0; i < selectedRecipients.length; i++) {
-                const recipient = selectedRecipients[i]
-                if (recipient.routingOrder < minRoutingOrder) {
-                    minRoutingOrder = recipient.routingOrder;
-                }
-
-                if (recipient.email === userDetails.email) {
-                    userEmailPresent.present = true;
-                    userEmailPresent.routingOrder = recipient.routingOrder;
-                    userEmailPresent.recipientId = recipient.id;
-                }
-            }
-
-            if (userEmailPresent.present && userEmailPresent.routingOrder === minRoutingOrder) {
-                setSelfUserSign({ sign: true, recipientId: userEmailPresent.recipientId })
-            }
-        }
-    }, [selectedRecipients])
-
     const [nav2RecToggle, setNav2RecToggle] = useState<boolean>(false);
     const [nav2DocToggle, setNav2DocToggle] = useState<boolean>(false);
 
-    function handleSend(isSignSend: boolean = false) {
+    function handleSend() {
         // dispatch(showLoader("Loading ..."));
         if (isSend === null) {
             setIsSend(false);
         }
-        setIsSend(!isSend);
+        setIsSend(!isSend)
-
-        setTimeout(() => {
         if (transactionTemplateToggle === TRANSACTION_TEMPLATE_TOGGLE.TRANSACTIONS) {
-                if (isSignSend) {
+            navigate(`/document-completion-screen/${accountId}/${transactionId}`)
-                    navigate(`./../../../sign/${selfUserSign.recipientId}`);
-                }
-                //  else {
-                //     navigate(`/document-completion-screen/${accountId}/${transactionId}`)
-                // }
         } else {
             navigate(`/templates`);
             toast.success("Template Saved...!", {
@@ -142,7 +102,6 @@ const NavTwo: React.FC<NavTwoProps> = ({ isFields, setIsFields, isSend, setIsSen
                 transition: Bounce,
             });
         }
-        }, 0)
     }
 
     const handleSetIsFields = (setTo: boolean) => {
@@ -164,24 +123,24 @@ const NavTwo: React.FC<NavTwoProps> = ({ isFields, setIsFields, isSend, setIsSen
         zoom(Number(indx), 'zoom-con')
     }, [selFitIndx])
 
-    // useEffect(() => {
+    useEffect(() => {
-    //     let timeoutId: number;
+        let timeoutId: number;
-    //     const timeOutIn = 8000;
+        const timeOutIn = 8000;
 
-    //     const updateLabel = () => {
+        const updateLabel = () => {
-    //         if (document.visibilityState === 'visible') {
+            if (document.visibilityState === 'visible') {
-    //             setTransactionSaving(true);
+                setTransactionSaving(true);
-    //             setTimeout(() => {
+                setTimeout(() => {
-    //                 setTransactionSaving(false);
+                    setTransactionSaving(false);
-    //             }, 4000)
+                }, 4000)
-    //         }
+            }
-    //         timeoutId = setTimeout(updateLabel, timeOutIn);
+            timeoutId = setTimeout(updateLabel, timeOutIn);
-    //     };
+        };
-    //     timeoutId = setTimeout(updateLabel, timeOutIn);
+        timeoutId = setTimeout(updateLabel, timeOutIn);
 
-    //     // Cleanup on unmount
+        // Cleanup on unmount
-    //     return () => clearTimeout(timeoutId);
+        return () => clearTimeout(timeoutId);
-    // }, []);
+    }, []);
 
     useEffect(() => {
         if (!transactionSaving) return;
@@ -327,15 +286,6 @@ const NavTwo: React.FC<NavTwoProps> = ({ isFields, setIsFields, isSend, setIsSen
                         </p>
                         <FaSignature className='text-white text-md' />
                     </div>
-                    {transactionTemplateToggle !== TRANSACTION_TEMPLATE_TOGGLE.TEMPLATES && selfUserSign.sign && <div
-                        id='send-and-sign-dash-btn'
-                        onClick={() => handleSend(selfUserSign.sign)}
-                        className='flex items-center gap-2 cursor-pointer text-xs px-4 py-2 ml-3 rounded-sm bg-[var(--primary)]'>
-                        <p className='tracking-wide text-white'>
-                            Sign & Send
-                        </p>
-                        <FaSignature className='text-white text-md' />
-                    </div>}
 
 
 

src/components/process/processStepTwo/ProcessStepTwo.tsx

@@ -9,16 +9,10 @@ import { RootState } from '../../../store/store';
 import Loader from '../../dashboard/Loader';
 import { hideLoader } from '../../../store/slices/loaderSlice';
 
-export interface IsSendInterface {
-  send: boolean | null;
-  save: boolean;
-}
-
 const ProcessStepTwo = () => {
   
   const [isFields, setIsFields] = useState(true);
   const [selectedRecipient, setSelectedRecipient] = useState(0);
-
   const [isSend, setIsSend] = useState<boolean | null>(null);
   const globalLoader = useSelector((state: RootState) => state.loader)
   const dispatch = useDispatch();

src/components/setting/Signature/Signature.tsx

@@ -114,7 +114,7 @@ const SignatureManager: React.FC = () => {
                     <div className="max-w-[84vw] mx-auto">
                         <>
                             {/* Header */}
-                            <div className="flex items-center justify-between mb-3">
+                            <div className="flex items-center justify-between mb-8">
                                 <div>
                                     <h1 className="text-[17px] font-medium text-gray-500 mb-2">Signatures</h1>
                                     <p className="text-gray-300 text-sm">Add or update your name and signature styles.</p>
@@ -126,7 +126,7 @@ const SignatureManager: React.FC = () => {
                             </div>
 
                             {/* Table Card */}
-                            <div className="bg-white rounded-md  overflow-hidden border border-gray-100">
+                            <div className="bg-white rounded-md shadow-md overflow-hidden border border-gray-100">
                                 {/* Table Header */}
                                 <div className="bg-gray-50 border-b border-gray-200">
                                     <div className="grid grid-cols-12 gap-4 px-6 py-4">
@@ -206,7 +206,7 @@ const SignatureManager: React.FC = () => {
 
                                                     {/* Dropdown Menu */}
                                                     {activeDropdown === signature.id && (
-                                                        <div className="absolute right-0 mt-0.5  w-28 bg-white rounded-lg border border-gray-200 z-10 py-1">
+                                                        <div className="absolute right-0 mt-0.5  w-28 bg-white rounded-lg shadow-xl border border-gray-200 z-10 py-1">
                                                             <button
                                                                 onClick={() => handleEdit(signature.id)}
                                                                 className="w-full px-4 py-1 text-left text-gray-500  hover:bg-blue-50 hover:text-blue-700 flex items-center gap-3 text-sm  transition-colors duration-150"
@@ -232,7 +232,7 @@ const SignatureManager: React.FC = () => {
 
                             {/* Empty State (if no signatures) */}
                             {signatures.length === 0 && (
-                                <div className=" rounded-xl p-12 text-center mt-8">
+                                <div className=" rounded-xl shadow-lg p-12 text-center mt-8">
                                     <div className="text-gray-400 mb-4">
                                         <FiEdit3 className="w-16 h-16 mx-auto" />
                                     </div>

src/components/setting/UserProfile.tsx

@@ -24,7 +24,7 @@ const UserProfile: React.FC<UserProfileProps> = ({ userData }) => {
         <div className="bg-white rounded-md shadow-sm flex w-full p-6">
             {/* Profile Picture */}
             <div className="flex-shrink-0 text-center">
-                <div className="w-20 h-20 bg-[var(--primary)] text-white font-bold text-2xl rounded-full flex items-center justify-center shadow-lg">
+                <div className="w-20 h-20 bg-green-800 text-white font-bold text-2xl rounded-full flex items-center justify-center shadow-lg">
                     {userData.name.slice(0,2).toUpperCase()}
                 </div>
             </div>

src/components/templates/Templates.tsx

@@ -7,7 +7,6 @@ import { useNavigate } from "react-router-dom";
 import { useSelector } from "react-redux";
 import { FaSpinner } from "react-icons/fa";
 import LoaderUi from "../../helper/LoaderUi";
-import logoRecord from '../../assets/record.svg';
 
 
 
@@ -210,16 +209,9 @@ const Templates = () => {
             <tbody>
               <tr>
                 <td colSpan="6" className="text-center py-10 text-gray-500">
-                  <div className="flex flex-col items-center justify-center">
+                  No templates found.
-                    <img
-                      src={logoRecord}
-                      alt="Record Not Found"
-                      className="w-70 h-70 mb-4 opacity-70" // adjust size and appearance
-                    />
-                  </div>
                 </td>
               </tr>
-
             </tbody>
 
           )}

src/components/transactions/TransactionView.tsx

@@ -79,8 +79,8 @@ const TransactionView = () => {
                             <div className='mt-2'>
                                 {/* new Date(transactionDetails?.transaction?.lastModifiedAt * 1000) */}
                                 <p className='text-slate-600'>From <span className='text-blue-600'>{transactionDetails?.transaction.createdBy.firstName + " " + transactionDetails?.transaction.createdBy.lastName}</span></p>
-                                <p className=''><span className='text-slate-600 font-semibold'>Last Change on</span> <span className='text-slate-400'>{(transactionDetails?.transaction?.lastModifiedAt)}</span></p>
+                                <p className=''><span className='text-slate-600 font-semibold'>Last Change on</span> <span className='text-slate-400'>{new Date(transactionDetails?.transaction?.lastModifiedAt * 1000).toISOString()}</span></p>
-                                <p className='text-slate-600'>Created at <span>{(transactionDetails?.transaction?.createdAt)}</span></p>
+                                <p className='text-slate-600'>Created at <span>{new Date(transactionDetails?.transaction?.createdAt * 1000).toISOString()}</span></p>
                             </div>
 
                             <p className='text-slate-600 text-[0.98rem] mt-2 font-semibold'>{transactionDetails?.transaction.status}</p>

src/types/images.d.ts

@@ -1,4 +0,0 @@
-declare module '*.png' {
-  const value: string;
-  export default value;
-}