diff --git a/src/components/auth/LoginForm.tsx b/src/components/auth/LoginForm.tsx index bb4bb4a..0d21871 100644 --- a/src/components/auth/LoginForm.tsx +++ b/src/components/auth/LoginForm.tsx @@ -109,14 +109,14 @@ function LoginForm() { console.log(res.status, "Response Status Line 42 LoginForm.tsx", res); if (res.status === 200) { toast.dismiss(); - console.log('User Logined Successfully Line 45 LoginForm.tsx headerCookie:', res.headers.authorization); + // console.log('User Logined Successfully Line 45 LoginForm.tsx headerCookie:', res.headers.authorization); // Cookies.set("authorization", res.headers.authorization, { // path: "/", // secure: true, // Required for HTTPS // sameSite: "Lax", // Required for cross-origin requests // }); - dispatch(updateUser({ ...res.data, authorized: true, accessToken: res.headers.authorization })); + // dispatch(updateUser({ ...res.data, authorized: true, accessToken: res.headers.authorization })); setTimeout(() => navigate('/'), 1000); // Redirect after 1 second toast.success("Login Successful", { position: "top-center", diff --git a/src/components/auth/RegisterForm.tsx b/src/components/auth/RegisterForm.tsx index aa25ca0..5fca512 100644 --- a/src/components/auth/RegisterForm.tsx +++ b/src/components/auth/RegisterForm.tsx @@ -65,7 +65,7 @@ function RegisterForm() { console.log(res, "line 58"); toast.dismiss(); // dispatch(updateUser({ ...res.data, authorized: true, accessToken: res.headers.authorization })); - dispatch(updateUser({ ...res.data, authorized: true })); + // dispatch(updateUser({ ...res.data, authorized: true })); navigate('/') } }) diff --git a/src/components/client/SignDocument.tsx b/src/components/client/SignDocument.tsx index 42710a6..bb62107 100644 --- a/src/components/client/SignDocument.tsx +++ b/src/components/client/SignDocument.tsx @@ -258,6 +258,8 @@ const SignDocument = () => { } + console.log(tagJson, "Line 261") + const handleFormSubmit = (e: React.FormEvent) => { e.preventDefault(); const submitData: TagsSubmitDataObj = { @@ -615,9 +617,10 @@ const SignDocument = () => { > { - selectedDocuments && selectedDocuments.length > 0 && selectedDocuments.map((doc, indxDoc) => { + selectedDocuments && selectedDocuments.length > 0 && selectedDocuments.map((doc) => { + console.log(tagJson, "tagJsontagJsontagJson") return ( -
+

{doc.name}

@@ -626,12 +629,13 @@ const SignDocument = () => { { tagJson && tagJson.length > 0 && doc.images && doc.images.length > 0 && doc.images.map((page, indx) => { const key = `${doc.documentId}_${page.index}`; - const currDocTags = tagJson.filter((val, indx) => val.documentIndex === indxDoc) + const currDocTags = tagJson.filter((val) => val.pageIndex === page.index) + console.log(currDocTags, tagJson, page, doc, "innnnnnnnnnnnn") return (
handleDrop(e, doc.documentId, indxDoc, page.index)} + // onDrop={(e) => handleDrop(e, doc.documentId, doc.documentId, page.index)} // onDragOver={handleDragOver} className='drop-page-in shadow-md relative' > @@ -640,7 +644,7 @@ const SignDocument = () => { {currDocTags.map((item, index) => { - if (item.pageNumber !== page.index) return; + if (item.pageIndex !== page.index) return; return (
{ className="absolute rounded dropped-item text-sm" // onClick={() => handleTagClick(key, index)} style={{ - left: `${item.dimension.left}px`, - top: `${item.dimension.top}px`, - width: `${item.dimension.width}px`, - height: `${item.dimension.height}px`, - border: `${((!hideTags && focusElement) && !transparentTags && focusElement.documentIndex === item.documentIndex && focusElement.focusElementIndx === index) ? '2px dashed #1c398e' : 'none'}`, + left: `${item.dimensions.left}px`, + top: `${item.dimensions.top}px`, + width: `${item.dimensions.width}px`, + height: `${item.dimensions.height}px`, + border: `${((!hideTags && focusElement) && !transparentTags && focusElement.documentId === item.documentId && focusElement.focusElementIndx === index) ? '2px dashed #1c398e' : 'none'}`, // display: `${hideTags ? 'none' : 'block'}` }} > @@ -665,7 +669,7 @@ const SignDocument = () => { id={item.id} tabIndex={1} className={`h-full text-[14px] font-medium w-full border-slate-100 rounded ${(transparentTags || hideTags) ? "pointer-events-none" : "bg-slate-200 shadow-sm opacity-80"} flex justify-start items-end`} - // style={{ height: item.dimension.height + "px" }} + // style={{ height: item.dimensions.height + "px" }} > {/* { { item.subType === "SINGLE_LINE" &&

{ const val = e.currentTarget.textContent; handleTagUpdate(index, val as string); @@ -734,11 +738,11 @@ const SignDocument = () => {

} @@ -752,7 +756,7 @@ const SignDocument = () => { id={item.id} onClick={() => handleSignClick(index)} className={`flex justify-center items-center h-full w-full rounded cursor-pointer ${transparentTags || hideTags ? "pointer-events-none bg-transparent" : "bg-slate-200 shadow-sm border-slate-100 opacity-80"}`} - // style={{ height: item.dimension.height + "px" }} + // style={{ height: item.dimensions.height + "px" }} > {/* */} { @@ -763,8 +767,8 @@ const SignDocument = () => { : } @@ -779,15 +783,15 @@ const SignDocument = () => { id={item.id} onClick={() => handleSignClick(index)} className={`flex justify-center items-center h-full w-full rounded cursor-pointer ${transparentTags || hideTags ? "pointer-events-none" : "bg-slate-200 shadow-sm border-slate-100 opacity-80"}`} - // style={{ height: item.dimension.height + "px" }} + // style={{ height: item.dimensions.height + "px" }} > {((!transparentTags && !hideTags) && !(saved.save && (index in signConfObj) && signConfObj[index].accepted)) ? : @@ -803,7 +807,7 @@ const SignDocument = () => { id={item.id} onClick={() => handleStampClick(index)} className={`flex justify-center items-center h-full w-full rounded cursor-pointer ${transparentTags || hideTags ? "pointer-events-none" : "bg-slate-200 shadow-sm border-slate-100 opacity-80"}`} - // style={{ height: item.dimension.height + "px" }} + // style={{ height: item.dimensions.height + "px" }} > {!transparentTags && !hideTags ? @@ -820,7 +824,7 @@ const SignDocument = () => { id={item.id} // onClick={() => handleSignClick(index)} className={`flex justify-center items-center h-full w-full rounded cursor-pointer ${transparentTags || hideTags ? "pointer-events-none" : "bg-slate-200 shadow-sm border-slate-100 opacity-80"}`} - // style={{ height: item.dimension.height + "px" }} + // style={{ height: item.dimensions.height + "px" }} > {!transparentTags && !hideTags ? @@ -909,7 +913,7 @@ const SignDocument = () => { {/* Focus Show Element */} - {(!transparentTags && !hideTags) && (focusElement && focusElement.documentIndex === item.documentIndex && focusElement.focusElementIndx === index) && + {(!transparentTags && !hideTags) && (focusElement && focusElement.documentId === item.documentId && focusElement.focusElementIndx === index) && <>
{
{/* */} diff --git a/src/components/dashboard/Dashboard.tsx b/src/components/dashboard/Dashboard.tsx index 73194a5..d9c2391 100644 --- a/src/components/dashboard/Dashboard.tsx +++ b/src/components/dashboard/Dashboard.tsx @@ -40,7 +40,7 @@ function Dashboard() { // window.location.href = '/login'; // return; // } - console.log("OUT MIC CHECK", transactionStatus, TRANSACTION_STATUS_ENUMS.TRANSACTION_SEND_SUCCESS, TRANSACTION_STATUS_ENUMS.TRANSACTION_INITIATED); + // console.log("OUT MIC CHECK", transactionStatus, TRANSACTION_STATUS_ENUMS.TRANSACTION_SEND_SUCCESS, TRANSACTION_STATUS_ENUMS.TRANSACTION_INITIATED); // Clear all if transaction success if (transactionStatus === TRANSACTION_STATUS_ENUMS.TRANSACTION_SEND_SUCCESS || transactionStatus === TRANSACTION_STATUS_ENUMS.TRANSACTION_INITIATED || transactionStatus === TRANSACTION_STATUS_ENUMS.TRANSACTION_SEND_FAILURE) { diff --git a/src/components/process/processStepOne/DocumentCard.tsx b/src/components/process/processStepOne/DocumentCard.tsx index 9ee982d..e6d13d2 100644 --- a/src/components/process/processStepOne/DocumentCard.tsx +++ b/src/components/process/processStepOne/DocumentCard.tsx @@ -8,6 +8,7 @@ import { AppDispatch } from '../../../store/store' import { IoMdClose } from 'react-icons/io' import api from '../../../config/api' import { useParams } from 'react-router-dom' +import axios from 'axios' interface DocumentCardProps { id: string; @@ -33,7 +34,7 @@ const DocumentCard: React.FC = ({ id, name, isCompleted }) => let isCompleted = false; let updateTimeout: ReturnType | null = null; let lastUpdate = 0; - const delay = 2000; + const delay = 1000; const docProgSSE = new EventSource(`http://192.168.2.112:8083/api/progress/${id}`); @@ -66,6 +67,8 @@ const DocumentCard: React.FC = ({ id, name, isCompleted }) => lastUpdate = Date.now(); }, delay - sinceLast); } + + }); docProgSSE.onerror = (error) => { @@ -112,7 +115,7 @@ const DocumentCard: React.FC = ({ id, name, isCompleted }) => draggable > setDocumentDel({ docId: id, isDel: false }) } + onClick={() => setDocumentDel({ docId: id, isDel: false })} className='absolute right-2.5 top-2.5 text-slate-400 text-xl hover:text-red-500 cursor-pointer transition-all' /> {/* Draggable handle */} = ({ isSend }) => { return null; } - - // const transactionId = useSelector((state: RootState) => state.transaction.transactionId) const navigate = useNavigate(); const dispatch = useDispatch(); @@ -127,7 +125,29 @@ const DocumentContainer: React.FC = ({ isSend }) => { accountId: string, transactionId: string ) => { - const requests = Object.entries(tagsData).map(([recipientId, tags]) => { + // tagsData = tagsData.filter((tag, indx) => (("update" in tag && tag.update) || !("id" in tag)) ) + // Filter Tags that needs to update + const updatedData = {} + + // debugger + + for (const [recipientId, tags] of Object.entries(tagsData)) { + console.log(recipientId, tags, "line 133") + const updateTags = [] + for (const tag of tags) { + if ("update" in tag && tag.update) { + updateTags.push(tag) + } + if (updateTags.length && "update" in updateTags[updateTags.length - 1]) { + delete updateTags[updateTags.length - 1].update + } + } + + updatedData[recipientId] = updateTags + } + + + const requests = Object.entries(updatedData).map(([recipientId, tags]) => { return api.put( `/api/accounts/${accountId}/transactions/${transactionId}/recipients/${recipientId}/tags`, tags @@ -136,7 +156,12 @@ const DocumentContainer: React.FC = ({ isSend }) => { try { const responses = await Promise.all(requests); - console.log("All recipient tags submitted:", responses); + const droppedItemsUpdateFalse = Object.fromEntries( + Object.entries(droppedItems).map(([recipientId, tags]) => { + return [recipientId, tags.map(tag => ({ ...tag, update: false }))]; + }) + ) + setDroppedItems(droppedItemsUpdateFalse); } catch (error) { console.error("Error submitting recipient tags:", error); } @@ -205,6 +230,7 @@ const DocumentContainer: React.FC = ({ isSend }) => { }, // "required": (dropTag.type.toUpperCase() !== "SIGNATURE" && dropTag.type.toUpperCase() !== "INITIALS") ? dropTag.required : true, "required": false, + "update": "update" in dropTag ? dropTag.update : false, "readOnly": false, } @@ -301,6 +327,7 @@ const DocumentContainer: React.FC = ({ isSend }) => { pageIndex: pageIndex, recipientId: dragElemData.recipientId, recipientIndx: dragElemData.recipientIndx, + update: true, isDeleted: false } @@ -387,7 +414,7 @@ const DocumentContainer: React.FC = ({ isSend }) => { ...droppedItems, [key]: Array.isArray(droppedItems[key]) // Ensure it's an array ? droppedItems[key].map((item, i) => - i === index ? { ...item, dimensions: { ...item.dimensions, left, top } } : item + i === index ? { ...item, dimensions: { ...item.dimensions, left, top }, update: true } : item ) : [], // Provide a fallback in case it's undefined or not an array }); @@ -443,7 +470,7 @@ const DocumentContainer: React.FC = ({ isSend }) => { ...droppedItems, [key]: Array.isArray(droppedItems[key]) // Ensure it's an array ? droppedItems[key].map((item, i) => - i === index ? { ...item, dimensions: { ...item.dimensions, width: newWidth, height: newHeight } } : item + i === index ? { ...item, dimensions: { ...item.dimensions, width: newWidth, height: newHeight }, update: true } : item ) : [], // Provide a fallback in case it's undefined or not an array }); @@ -471,11 +498,11 @@ const DocumentContainer: React.FC = ({ isSend }) => { if ("id" in tag) { try { const response = await api.delete(`/api/accounts/${accountId}/transactions/${transactionId}/recipients/${recipientId}/tags/${tag.id}`) - if(response.status !== 200) throw "Tag Deletion error" + if (response.status !== 200) throw "Tag Deletion error" } catch (err) { console.error("Tag Deletion error") return; - } + } } setSelectedTag(null) setDroppedItems(prevState => ({ @@ -485,109 +512,108 @@ const DocumentContainer: React.FC = ({ isSend }) => { ) })); })() - } - const handleAddRadio = (e: React.MouseEvent, key: string, index: number) => { - // const dataToSet: DroppedItemsObj = { - // ...droppedItems, - // [key]: [...(droppedItems[key] || []), - // { - // ...prepData, - // radioGroups: dragElemData.label === "radio" ? [{ ...prepData }] : [] - // }], - // } + // const handleAddRadio = (e: React.MouseEvent, key: string, index: number) => { + // // const dataToSet: DroppedItemsObj = { + // // ...droppedItems, + // // [key]: [...(droppedItems[key] || []), + // // { + // // ...prepData, + // // radioGroups: dragElemData.label === "radio" ? [{ ...prepData }] : [] + // // }], + // // } - // const lastRadioElemRect = e.currentTarget?.parentElement.previousSibling.getBoundingClientRect(); - // console.log(lastRadioElemRect, "lastRadioElemRect") + // // const lastRadioElemRect = e.currentTarget?.parentElement.previousSibling.getBoundingClientRect(); + // // console.log(lastRadioElemRect, "lastRadioElemRect") - const setNewData = droppedItems; + // const setNewData = droppedItems; - if (Array.isArray(setNewData[key][index].radioGroups) && setNewData[key][index].radioGroups?.length > 0) { - setNewData[key][index].radioGroups?.push(setNewData[key][index].radioGroups[0]) - } + // if (Array.isArray(setNewData[key][index].radioGroups) && setNewData[key][index].radioGroups?.length > 0) { + // setNewData[key][index].radioGroups?.push(setNewData[key][index].radioGroups[0]) + // } - setDroppedItems(setNewData); - }; + // setDroppedItems(setNewData); + // }; - const handleRadioTagMouseDown = (event: React.MouseEvent, key: string, index: number, radioIndex: number) => { + // const handleRadioTagMouseDown = (event: React.MouseEvent, key: string, index: number, radioIndex: number) => { - event.preventDefault(); + // event.preventDefault(); - let targetContainer = event?.currentTarget?.parentElement; - let targetElement = event?.currentTarget; + // let targetContainer = event?.currentTarget?.parentElement; + // let targetElement = event?.currentTarget; - if (!targetContainer || !targetElement) return; + // if (!targetContainer || !targetElement) return; - const containerRect = targetContainer.getBoundingClientRect(); - const elementRect = targetElement.getBoundingClientRect(); + // const containerRect = targetContainer.getBoundingClientRect(); + // const elementRect = targetElement.getBoundingClientRect(); - // Calculate the initial offset (where the mouse was clicked inside the element) - const offsetX = event.clientX - elementRect.left; - const offsetY = event.clientY - elementRect.top; + // // Calculate the initial offset (where the mouse was clicked inside the element) + // const offsetX = event.clientX - elementRect.left; + // const offsetY = event.clientY - elementRect.top; - const handleMouseMove = (event: PointerEvent) => { - // Get new X and Y positions relative to the container - // let x = offsetX; - // let y = offsetY; + // const handleMouseMove = (event: PointerEvent) => { + // // Get new X and Y positions relative to the container + // // let x = offsetX; + // // let y = offsetY; - let x = event.clientX - elementRect.left; - let y = event.clientY - elementRect.top; + // let x = event.clientX - elementRect.left; + // let y = event.clientY - elementRect.top; - const newData = droppedItems; + // const newData = droppedItems; - if (newData[key][index].radioGroups && newData[key][index].radioGroups.length > 0) { - newData[key][index].radioGroups[radioIndex].dimensions.left = x; - newData[key][index].radioGroups[radioIndex].dimensions.top = y; + // if (newData[key][index].radioGroups && newData[key][index].radioGroups.length > 0) { + // newData[key][index].radioGroups[radioIndex].dimensions.left = x; + // newData[key][index].radioGroups[radioIndex].dimensions.top = y; - let topMin = Number.POSITIVE_INFINITY; - let topMax = Number.NEGATIVE_INFINITY; - let leftMin = Number.POSITIVE_INFINITY; - let leftMax = Number.NEGATIVE_INFINITY; + // let topMin = Number.POSITIVE_INFINITY; + // let topMax = Number.NEGATIVE_INFINITY; + // let leftMin = Number.POSITIVE_INFINITY; + // let leftMax = Number.NEGATIVE_INFINITY; - for (const radio of newData[key][index].radioGroups) { - if (radio.dimensions.left < leftMin) { - leftMin = radio.dimensions.left; - } - if (radio.dimensions.left > leftMax) { - leftMax = radio.dimensions.left; - } - if (radio.dimensions.top < topMin) { - topMin = radio.dimensions.top; - } - if (radio.dimensions.top > topMax) { - topMax = radio.dimensions.top; - } - } + // for (const radio of newData[key][index].radioGroups) { + // if (radio.dimensions.left < leftMin) { + // leftMin = radio.dimensions.left; + // } + // if (radio.dimensions.left > leftMax) { + // leftMax = radio.dimensions.left; + // } + // if (radio.dimensions.top < topMin) { + // topMin = radio.dimensions.top; + // } + // if (radio.dimensions.top > topMax) { + // topMax = radio.dimensions.top; + // } + // } - newData[key][index].radioPosition = { - topMin: topMin, - topMax: topMax, - leftMin: leftMin, - leftMax: leftMax, - width: leftMax - leftMin, - height: topMax - topMin - } + // newData[key][index].radioPosition = { + // topMin: topMin, + // topMax: topMax, + // leftMin: leftMin, + // leftMax: leftMax, + // width: leftMax - leftMin, + // height: topMax - topMin + // } - newData[key][index].dimensions.left = x; - newData[key][index].dimensions.top = y; - } + // newData[key][index].dimensions.left = x; + // newData[key][index].dimensions.top = y; + // } - setDroppedItems({ ...newData }); - }; + // setDroppedItems({ ...newData }); + // }; - const handleMouseUp = () => { - document.removeEventListener("pointermove", handleMouseMove); - document.removeEventListener("pointerup", handleMouseUp); - }; + // const handleMouseUp = () => { + // document.removeEventListener("pointermove", handleMouseMove); + // document.removeEventListener("pointerup", handleMouseUp); + // }; - // Add event listeners - document.addEventListener("pointermove", handleMouseMove); - document.addEventListener("pointerup", handleMouseUp); - } + // // Add event listeners + // document.addEventListener("pointermove", handleMouseMove); + // document.addEventListener("pointerup", handleMouseUp); + // } return ( diff --git a/src/components/process/processStepTwo/RightSideBar.tsx b/src/components/process/processStepTwo/RightSideBar.tsx index 6161286..5e2ce22 100644 --- a/src/components/process/processStepTwo/RightSideBar.tsx +++ b/src/components/process/processStepTwo/RightSideBar.tsx @@ -126,7 +126,7 @@ const RightSideBar: React.FC = ({ selectedTag, setDroppedItems ...prev, [selTagKey]: Array.isArray(prev[selTagKey]) // Ensure it's an array ? prev[selTagKey].map((item, i) => - i === selTagIndx ? { ...item, [changeTo]: changeWith || "", format: "" } : item + i === selTagIndx ? { ...item, [changeTo]: changeWith || "", format: "", update: "id" in item ? true : false } : item ) : [], }// Provide a fallback in case it's undefined or not an array @@ -138,7 +138,7 @@ const RightSideBar: React.FC = ({ selectedTag, setDroppedItems ...prev, [selTagKey]: Array.isArray(prev[selTagKey]) ? prev[selTagKey].map((item, i) => - i === selTagIndx ? { ...item, [changeTo]: changeWith, maskType: "All", maskCharacter: "ASTERISK" } : item + i === selTagIndx ? { ...item, [changeTo]: changeWith, maskType: "All", maskCharacter: "ASTERISK", update: "id" in item ? true : false } : item ) : [], } @@ -154,7 +154,7 @@ const RightSideBar: React.FC = ({ selectedTag, setDroppedItems ...prev, [selTagKey]: Array.isArray(prev[selTagKey]) // Ensure it's an array ? prev[selTagKey].map((item, i) => - i === selTagIndx ? { ...item, [changeTo]: changeWith, decimalPlace: decPlace, isCurrency } : item + i === selTagIndx ? { ...item, [changeTo]: changeWith, decimalPlace: decPlace, isCurrency, update: "id" in item ? true : false } : item ) : [], }// Provide a fallback in case it's undefined or not an array @@ -170,7 +170,7 @@ const RightSideBar: React.FC = ({ selectedTag, setDroppedItems ...prev, [selTagKey]: Array.isArray(prev[selTagKey]) // Ensure it's an array ? prev[selTagKey].map((item, i) => - i === selTagIndx ? { ...item, [changeTo]: changeWith + " " + val } : item + i === selTagIndx ? { ...item, [changeTo]: changeWith + " " + val, update: "id" in item ? true : false } : item ) : [], }// Provide a fallback in case it's undefined or not an array @@ -182,7 +182,7 @@ const RightSideBar: React.FC = ({ selectedTag, setDroppedItems ...prev, [selTagKey]: Array.isArray(prev[selTagKey]) // Ensure it's an array ? prev[selTagKey].map((item, i) => - i === selTagIndx ? { ...item, [changeTo]: changeWith } : item + i === selTagIndx ? { ...item, [changeTo]: changeWith, update: "id" in item ? true : false } : item ) : [], }// Provide a fallback in case it's undefined or not an array @@ -274,7 +274,7 @@ const RightSideBar: React.FC = ({ selectedTag, setDroppedItems [selTagKey]: Array.isArray(prev[selTagKey]) ? prev[selTagKey].map((item, i) => { if (i === selTagIndx) { - return { ...item, options: item.options ? [...item.options, selectedOption] : [selectedOption] }; + return { ...item, options: item.options ? [...item.options, selectedOption] : [selectedOption], update: "id" in item ? true : false }; } return item; }) diff --git a/vite.config.ts b/vite.config.ts index 6a4b501..4a95a51 100644 --- a/vite.config.ts +++ b/vite.config.ts @@ -10,7 +10,8 @@ export default defineConfig({ allowedHosts: [ 'quality-friendly-goldfish.ngrok-free.app', 'officially-powerful-goat.ngrok-free.app', - '89f0-49-36-189-120.ngrok-free.app' + '89f0-49-36-189-120.ngrok-free.app', + 'c8ee-49-36-191-130.ngrok-free.app' ], }, build: {