From abb9ea99970dce4b855a0446e7b50c386e654d6b Mon Sep 17 00:00:00 2001
From: Timur Ercan <timur.ercan31@gmail.com>
Date: Tue, 7 Mar 2023 12:37:52 +0100
Subject: [PATCH 1/8] =?UTF-8?q?=F0=9F=90=9B=20cancel=20sign=20dialog=20exe?=
 =?UTF-8?q?ption?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 apps/web/components/editor/pdf-signer.tsx | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/apps/web/components/editor/pdf-signer.tsx b/apps/web/components/editor/pdf-signer.tsx
index fb4ce2224..3448772d6 100644
--- a/apps/web/components/editor/pdf-signer.tsx
+++ b/apps/web/components/editor/pdf-signer.tsx
@@ -45,6 +45,8 @@ export default function PDFSigner(props: any) {
       return;
     }
 
+    if (!dialogResult) return;
+
     const signature = {
       fieldId: dialogField.id,
       type: dialogResult.type,

From 12eae1bd7846251c908a6dd7cb122278604e8a82 Mon Sep 17 00:00:00 2001
From: Timur Ercan <timur.ercan31@gmail.com>
Date: Tue, 7 Mar 2023 13:07:27 +0100
Subject: [PATCH 2/8] =?UTF-8?q?=F0=9F=9A=A7=20fixed=20field=20size?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 apps/web/components/editor/editable-field.tsx | 7 ++-----
 apps/web/components/editor/signable-field.tsx | 7 ++-----
 packages/pdf/insertImageInPDF.ts              | 2 +-
 3 files changed, 5 insertions(+), 11 deletions(-)

diff --git a/apps/web/components/editor/editable-field.tsx b/apps/web/components/editor/editable-field.tsx
index 0135edfbd..c4966a0f0 100644
--- a/apps/web/components/editor/editable-field.tsx
+++ b/apps/web/components/editor/editable-field.tsx
@@ -53,18 +53,15 @@ export default function EditableField(props: FieldPropsType) {
         e.stopPropagation();
       }}
     >
+      {/* width: 192 height 96 */}
       <div
         hidden={props.hidden}
         ref={nodeRef}
-        className="cursor-move opacity-80 p-2 m-auto w-48 h-24 flex-row-reverse text-lg font-bold text-center absolute top-0 left-0 select-none"
+        className="cursor-move opacity-80 p-2 m-auto w-48 h-16 flex-row-reverse text-lg font-bold text-center absolute top-0 left-0 select-none"
         style={{
           background: stc(props.field.Recipient.email),
         }}
       >
-        <div className="mb-2 pointer-events-none">
-          <Logo className="w-16 mx-auto"></Logo>
-        </div>
-        {/* width: 192 height 96 */}
         <div className="m-auto overflow-hidden flex-row-reverse text-lg font-bold text-center">
           {field.type}
           {field.type === "SIGNATURE" ? (
diff --git a/apps/web/components/editor/signable-field.tsx b/apps/web/components/editor/signable-field.tsx
index f21a36fd7..3b0c62a33 100644
--- a/apps/web/components/editor/signable-field.tsx
+++ b/apps/web/components/editor/signable-field.tsx
@@ -43,15 +43,12 @@ export default function SignableField(props: FieldPropsType) {
           if (!field?.signature) props.onClick(props.field);
         }}
         ref={nodeRef}
-        className="cursor-pointer opacity-80 p-2 m-auto w-auto flex-row-reverse text-lg font-bold text-center absolute top-0 left-0 select-none hover:brightness-50"
+        className="cursor-pointer opacity-80 py-4 m-auto w-48 h-16 flex-row-reverse text-lg font-bold text-center absolute top-0 left-0 select-none hover:brightness-50"
         style={{
           background: stc(props.field.Recipient.email),
         }}
       >
-        <div
-          hidden={field?.signature}
-          className="m-auto w-auto flex-row-reverse font-medium text-center px-12 py-2"
-        >
+        <div hidden={field?.signature} className="font-medium">
           {field.type === "SIGNATURE" ? "SIGN HERE" : ""}
         </div>
         <div
diff --git a/packages/pdf/insertImageInPDF.ts b/packages/pdf/insertImageInPDF.ts
index 7e50c3c27..cbc512c32 100644
--- a/packages/pdf/insertImageInPDF.ts
+++ b/packages/pdf/insertImageInPDF.ts
@@ -12,7 +12,7 @@ export async function insertImageInPDF(
   const pages = pdfDoc.getPages();
   const pdfPage = pages[page];
   const pngImage = await pdfDoc.embedPng(image);
-  const drawSize = { width: 213, height: 50 };
+  const drawSize = { width: 192, height: 96 };
 
   pdfPage.drawImage(pngImage, {
     x: positionX,

From 15cecace4ed4a1d77f2e34a42a3d033d5f46c64a Mon Sep 17 00:00:00 2001
From: Timur Ercan <timur.ercan31@gmail.com>
Date: Tue, 7 Mar 2023 16:21:57 +0100
Subject: [PATCH 3/8] =?UTF-8?q?=F0=9F=9A=A7=20signature=20placement?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/pdf/insertTextInPDF.ts | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/packages/pdf/insertTextInPDF.ts b/packages/pdf/insertTextInPDF.ts
index a05960d70..d7e829069 100644
--- a/packages/pdf/insertTextInPDF.ts
+++ b/packages/pdf/insertTextInPDF.ts
@@ -24,10 +24,12 @@ export async function insertTextInPDF(
   const textSize = useHandwritingFont ? 50 : 15;
   const textWidth = customFont.widthOfTextAtSize(text, textSize);
   const textHeight = customFont.heightAtSize(textSize);
+  const fieldSize = { width: 192, height: 64 };
+  const invertedYPosition = pdfPage.getHeight() - positionY - fieldSize.height;
 
   pdfPage.drawText(text, {
     x: positionX,
-    y: pdfPage.getHeight() - positionY - textHeight / 2,
+    y: invertedYPosition,
     size: textSize,
     font: useHandwritingFont ? customFont : helveticaFont,
     color: rgb(0, 0, 0),

From 96c6a592f468968ded82ec1d20ef65ce63258685 Mon Sep 17 00:00:00 2001
From: Timur Ercan <timur.ercan31@gmail.com>
Date: Tue, 7 Mar 2023 16:34:51 +0100
Subject: [PATCH 4/8] field placement cursor

---
 apps/web/components/editor/pdf-editor.tsx | 3 +++
 apps/web/components/editor/pdf-viewer.jsx | 3 +--
 2 files changed, 4 insertions(+), 2 deletions(-)

diff --git a/apps/web/components/editor/pdf-editor.tsx b/apps/web/components/editor/pdf-editor.tsx
index 00cd892e4..da2f3f9ff 100644
--- a/apps/web/components/editor/pdf-editor.tsx
+++ b/apps/web/components/editor/pdf-editor.tsx
@@ -48,6 +48,9 @@ export default function PDFEditor(props: any) {
     <>
       <div>
         <PDFViewer
+          style={{
+            cursor: `url("https://place-hold.it/110x64/37f095/FFFFFF&text=${selectedFieldType}") 55 32, auto`,
+          }}
           readonly={false}
           document={props.document}
           fields={fields}
diff --git a/apps/web/components/editor/pdf-viewer.jsx b/apps/web/components/editor/pdf-viewer.jsx
index fbabf2d61..2f8cd17f5 100644
--- a/apps/web/components/editor/pdf-viewer.jsx
+++ b/apps/web/components/editor/pdf-viewer.jsx
@@ -60,8 +60,7 @@ export default function PDFViewer(props) {
                 key={short.generate().toString()}
                 style={{
                   position: "relative",
-                  cursor:
-                    'url("https://place-hold.it/110x64/37f095/FFFFFF&text=Signature"), auto',
+                  ...props.style,
                 }}
                 className="mx-auto w-fit"
               >

From 624616169725ca82744d7a5a52e13ca9d895a97a Mon Sep 17 00:00:00 2001
From: Timur Ercan <timur.ercan31@gmail.com>
Date: Tue, 7 Mar 2023 16:35:45 +0100
Subject: [PATCH 5/8] =?UTF-8?q?create=20field=20position=20fix=20?=
 =?UTF-8?q?=F0=9F=90=9B?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/features/editor/createField.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/features/editor/createField.ts b/packages/features/editor/createField.ts
index 5f9158a85..f97c57bf6 100644
--- a/packages/features/editor/createField.ts
+++ b/packages/features/editor/createField.ts
@@ -8,7 +8,7 @@ export const createField = (
   customText = ""
 ): any => {
   var rect = e.target.getBoundingClientRect();
-  const fieldSize = { width: 192, height: 96 };
+  const fieldSize = { width: 192, height: 64 };
   var newFieldX = e.clientX - rect.left - fieldSize.width / 2; //x position within the element.
   var newFieldY = e.clientY - rect.top - fieldSize.height / 2; //y position within the element.
   if (newFieldX < 0) newFieldX = 0;

From a2e54e7faf994b9edc3343cdbafc0fe586521136 Mon Sep 17 00:00:00 2001
From: Timur Ercan <timur.ercan31@gmail.com>
Date: Tue, 7 Mar 2023 17:12:03 +0100
Subject: [PATCH 6/8] =?UTF-8?q?=F0=9F=92=84=20signable=20field=20size?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 apps/web/components/editor/signable-field.tsx | 15 +++++++++------
 1 file changed, 9 insertions(+), 6 deletions(-)

diff --git a/apps/web/components/editor/signable-field.tsx b/apps/web/components/editor/signable-field.tsx
index 3b0c62a33..cde6b8eb3 100644
--- a/apps/web/components/editor/signable-field.tsx
+++ b/apps/web/components/editor/signable-field.tsx
@@ -43,23 +43,26 @@ export default function SignableField(props: FieldPropsType) {
           if (!field?.signature) props.onClick(props.field);
         }}
         ref={nodeRef}
-        className="cursor-pointer opacity-80 py-4 m-auto w-48 h-16 flex-row-reverse text-lg font-bold text-center absolute top-0 left-0 select-none hover:brightness-50"
+        className="cursor-pointer opacity-80 m-auto w-48 h-16 flex-row-reverse text-lg font-bold text-center absolute top-0 left-0 select-none hover:brightness-50"
         style={{
           background: stc(props.field.Recipient.email),
         }}
       >
-        <div hidden={field?.signature} className="font-medium">
+        <div hidden={field?.signature} className="font-medium my-4">
           {field.type === "SIGNATURE" ? "SIGN HERE" : ""}
         </div>
         <div
           hidden={!field?.signature}
           className="font-qwigley text-5xl m-auto w-auto flex-row-reverse font-medium text-center"
         >
-          {field?.signature?.type === "type"
-            ? field?.signature.typedSignature
-            : ""}
+          {field?.signature?.type === "type" ? (
+            <div className="my-4">{field?.signature.typedSignature}</div>
+          ) : (
+            ""
+          )}
+
           {field?.signature?.type === "draw" ? (
-            <img className="w-50 h-20" src={field?.signature?.signatureImage} />
+            <img className="w-48 h-16" src={field?.signature?.signatureImage} />
           ) : (
             ""
           )}

From 72ea5e69626a3d4a593a6b9f4341e6bc3fced4d3 Mon Sep 17 00:00:00 2001
From: Timur Ercan <timur.ercan31@gmail.com>
Date: Tue, 7 Mar 2023 17:12:24 +0100
Subject: [PATCH 7/8] =?UTF-8?q?=F0=9F=92=84=20signature=20drawing=20matchi?=
 =?UTF-8?q?ng=20field?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/pdf/insertImageInPDF.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/pdf/insertImageInPDF.ts b/packages/pdf/insertImageInPDF.ts
index cbc512c32..3476964fe 100644
--- a/packages/pdf/insertImageInPDF.ts
+++ b/packages/pdf/insertImageInPDF.ts
@@ -12,7 +12,7 @@ export async function insertImageInPDF(
   const pages = pdfDoc.getPages();
   const pdfPage = pages[page];
   const pngImage = await pdfDoc.embedPng(image);
-  const drawSize = { width: 192, height: 96 };
+  const drawSize = { width: 192, height: 64 };
 
   pdfPage.drawImage(pngImage, {
     x: positionX,

From 4be341befe0df28830e13ac78103ab057c0f7636 Mon Sep 17 00:00:00 2001
From: Timur Ercan <timur.ercan31@gmail.com>
Date: Tue, 7 Mar 2023 17:35:41 +0100
Subject: [PATCH 8/8] =?UTF-8?q?=F0=9F=90=9B=20doc-144?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 apps/web/pages/documents/[id]/recipients.tsx | 15 +++------------
 1 file changed, 3 insertions(+), 12 deletions(-)

diff --git a/apps/web/pages/documents/[id]/recipients.tsx b/apps/web/pages/documents/[id]/recipients.tsx
index 40364c7da..8a833e436 100644
--- a/apps/web/pages/documents/[id]/recipients.tsx
+++ b/apps/web/pages/documents/[id]/recipients.tsx
@@ -117,7 +117,6 @@ const RecipientsPage: NextPageWithLayout = (props: any) => {
               color="primary"
               icon={PaperAirplaneIcon}
               onClick={() => {
-                setLoading(true);
                 setOpen(true);
               }}
               disabled={
@@ -361,12 +360,7 @@ const RecipientsPage: NextPageWithLayout = (props: any) => {
         </div>
       </div>
       <Transition.Root show={open} as={Fragment}>
-        <Dialog
-          as="div"
-          className="relative z-10"
-          initialFocus={cancelButtonRef}
-          onClose={setOpen}
-        >
+        <Dialog as="div" className="relative z-10" onClose={setOpen}>
           <Transition.Child
             as={Fragment}
             enter="ease-out duration-300"
@@ -417,16 +411,13 @@ const RecipientsPage: NextPageWithLayout = (props: any) => {
                     </div>
                   </div>
                   <div className="mt-5 sm:mt-6 sm:grid sm:grid-flow-row-dense sm:grid-cols-2 sm:gap-3">
-                    <Button
-                      color="secondary"
-                      onClick={() => setOpen(false)}
-                      ref={cancelButtonRef}
-                    >
+                    <Button color="secondary" onClick={() => setOpen(false)}>
                       Cancel
                     </Button>
                     <Button
                       onClick={() => {
                         setOpen(false);
+                        setLoading(true);
                         sendSigningRequests(props.document).finally(() => {
                           setLoading(false);
                         });