Merge pull request #23 from anvilco/wt/use-onFinishSigning

Use `onFinishSigning` instead of `onFinish`
anvilco · Oct 20, 2021 · 20ba485 · 20ba485
2 parents 138a7fc + 3c392f1
commit 20ba485
Show file tree

Hide file tree

Showing 3 changed files with 25 additions and 30 deletions.
diff --git a/package.json b/package.json
@@ -29,8 +29,8 @@
   },
   "dependencies": {
     "@anvilco/anvil": "^2.4.0",
-    "@anvilco/react-signature-frame": "^1.4.6",
-    "@anvilco/react-signature-modal": "^1.4.6",
+    "@anvilco/react-signature-frame": "^1.5.0",
+    "@anvilco/react-signature-modal": "^1.5.0",
     "@babel/polyfill": "^7.11.5",
     "app-module-path": "^2.2.0",
     "dotenv": "^8.2.0",

diff --git a/src/client/routes/PacketDetailsPage/index.js b/src/client/routes/PacketDetailsPage/index.js
@@ -18,6 +18,7 @@ const PacketDetailsPage = () => {
   const { packetEid } = useParams()
   const [packetDetails, setPacketDetails] = useState(undefined)
   const [queryStringData, setQueryStringData] = useState(undefined)
+  const [signerCompleteDataType, setSignerCompleteDataType] = useState(undefined)
   const [generateURLResponse, setGenerateURLResponse] = useState(undefined)
   const [nextSignerNum, setNextSignerNum] = useState(1)
   const [signURL, setSignURL] = useState(undefined)
@@ -29,6 +30,7 @@ const PacketDetailsPage = () => {
       setPacketDetails(await getEtchPacket())
     }
     setQueryStringData(parseQueryString())
+    setSignerCompleteDataType('queryParams')
     fetchData()
   }, [])
 
@@ -89,26 +91,14 @@ const PacketDetailsPage = () => {
     window.location.assign(`/api/packet/download/${documentGroupEid}`)
   }
 
-  const handleIframeSignFinish = async (redirectURL) => {
-    console.log('RedirectURL:', redirectURL)
+  const handleIframeSignFinish = async (payload) => {
+    console.log('Payload:', payload)
     setIsSignFrameOpen(false)
-    setPacketDetails(await getEtchPacket())
-
-    // We don't need to trigger a redirect after iframe signing
-    // instead, send a GET request to retrieve the redirectURL query params
-    const response = await fetch(redirectURL)
-    setQueryStringData(parseQueryString(response.url))
-  }
-
-  const handleModalSignFinish = async (redirectURL) => {
-    console.log('RedirectURL:', redirectURL)
     setIsModalOpen(false)
     setPacketDetails(await getEtchPacket())
 
-    // We don't need to trigger a redirect after modal signing
-    // instead, send a GET request to retrieve the redirectURL query params
-    const response = await fetch(redirectURL)
-    setQueryStringData(parseQueryString(response.url))
+    setQueryStringData(payload)
+    setSignerCompleteDataType('onFinishSigning')
   }
 
   const renderHeader = () => {
@@ -155,7 +145,12 @@ const PacketDetailsPage = () => {
         <Content.Card>
           <h3>Signer Finished!</h3>
           <Description>
-            The <code>redirectURL</code> received the following query parameters.
+            {signerCompleteDataType === 'queryParams'
+              ? (
+                <>The <code>redirectURL</code> received the following query parameters.</>
+              ) : (
+                <>The signature frame's <code>onFinishSigning</code> callback returned a payload containing the following fields.</>
+              )}
           </Description>
           <p>
             Signature Packet EID: <b>{etchPacketEid}</b>
@@ -300,7 +295,7 @@ const PacketDetailsPage = () => {
           <AnvilSignatureFrame
             signURL={signURL}
             scroll="smooth"
-            onFinish={handleIframeSignFinish}
+            onFinishSigning={handleIframeSignFinish}
             anvilURL={anvilBaseURL}
           />
         </Flex>
@@ -313,7 +308,7 @@ const PacketDetailsPage = () => {
       signURL={signURL}
       isOpen={isModalOpen}
       onClose={() => setIsModalOpen(false)}
-      onFinish={handleModalSignFinish}
+      onFinishSigning={handleIframeSignFinish}
       anvilURL={anvilBaseURL}
     />
   )

diff --git a/yarn.lock b/yarn.lock
@@ -13,15 +13,15 @@
     limiter "^1.1.5"
     node-fetch "^2.6.0"
 
-"@anvilco/react-signature-frame@^1.4.6":
-  version "1.4.6"
-  resolved "https://registry.yarnpkg.com/@anvilco/react-signature-frame/-/react-signature-frame-1.4.6.tgz#ca65a1ccd77082d06d44bdbc8be13353eedad893"
-  integrity sha512-834FEqUhYv4QVboOoABPTVzzB7oR9ZPuwajDLAeehxxx3YgujasFrXElwbCpUgQS1fcokqdNwxTZrKzf/6gh2A==
-
-"@anvilco/react-signature-modal@^1.4.6":
-  version "1.4.6"
-  resolved "https://registry.yarnpkg.com/@anvilco/react-signature-modal/-/react-signature-modal-1.4.6.tgz#b8f71d74d3059956939d72792848d36233954091"
-  integrity sha512-382pVZlhilA2H+7VIitYNAq0B8xS4DaTp9Wa+jZS4Pb/6Yp4RYRTSUny4cuSZumvyCVHKOgQlxGT8UcjzSmHWA==
+"@anvilco/react-signature-frame@^1.5.0":
+  version "1.5.0"
+  resolved "https://registry.yarnpkg.com/@anvilco/react-signature-frame/-/react-signature-frame-1.5.0.tgz#bbcc279627b375246c937336b1bf39cd87d11126"
+  integrity sha512-YfykLLUwGvdVIPqr60Bi/oUe/Sl2//1d+ds/HwGyniy1OUi0Pd78L+fpewFHoNvBPTBKYh+ETY4QCQDh0ZfvgA==
+
+"@anvilco/react-signature-modal@^1.5.0":
+  version "1.5.0"
+  resolved "https://registry.yarnpkg.com/@anvilco/react-signature-modal/-/react-signature-modal-1.5.0.tgz#2efdf1d5bcc5311db567113f5d5f889583f7b81e"
+  integrity sha512-iOxapBv1lQjTRE1RAS8nWZrjiI5Yml74eHa/rvTDwYglpYRIYg/qvby8mD/yCZWqnz952ULVxHUts+EoQ3mDCQ==
 
 "@babel/code-frame@^7.0.0", "@babel/code-frame@^7.10.4":
   version "7.10.4"