[QuickSignPDF] Fix Fabric canvas scale bug (#71)

src/PDFViewer/FabricPagePreview.tsx

@@ -54,8 +54,10 @@ const FabricPagePreview = forwardRef<FabricJSEditor, Props>(function (
 
   const onFabricReady = useCallback(
     (canvas) => {
-      canvas.width = viewport!.width;
-      canvas.height = viewport!.height;
+      if (viewport) {
+        canvas.width = viewport.width;
+        canvas.height = viewport.height;
+      }
       canvas.setZoom(scale || 1);
       onReady(canvas);
     },
@@ -67,8 +69,11 @@ const FabricPagePreview = forwardRef<FabricJSEditor, Props>(function (
   }, [load]);
 
   useEffect(() => {
-    editor?.canvas.setZoom(scale || 1);
-  }, [editor?.canvas, scale]);
+    if (!viewport || !editor) return;
+    editor.canvas.setZoom(scale || 1);
+    editor.canvas.setWidth(viewport.width);
+    editor.canvas.setHeight(viewport.height);
+  }, [editor, scale, viewport]);
 
   return (
     <div className="relative">
@@ -80,7 +85,7 @@ const FabricPagePreview = forwardRef<FabricJSEditor, Props>(function (
         height={viewport?.height}
       ></canvas>
       {/* Drawing Canvas */}
-      {viewport && (
+      {scale && (
         <FabricJSCanvas
           className="absolute top-0 right-0 left-0 bottom-0"
           onReady={onFabricReady}

src/QuickSignPDF/QuickSignPDF.tsx

@@ -1,15 +1,7 @@
 /**
  * To implement this, the DrawablePagePreview implements a double canvas
  * mechanism that overlay a drawable canvas over the PDF renderer canvas.
- *
- * Limitations:
- *  - Once the user hits download the drawings are BURNED into the PDF pages and
- *    humans can no longer draw on top of it. Not sure why this happens but it seems
- *    it seems we can only burn onto the PDF once. Need investigation.
- *  - We can't currently control the scale of the PDF preview because it affects
- *    the scale the paths are affected in scaled and position.
  */
-
 import {
   ArrowLeftCircleIcon,
   ArrowRightCircleIcon,