From 602e23c719a0d583b194d627761efff14fb9b074 Mon Sep 17 00:00:00 2001 From: Stixx Date: Wed, 27 Nov 2024 17:00:59 +0100 Subject: [PATCH 1/4] fix: clicking on marked fileds is losing input text/squiggle, squiggle field is mobile friendly --- src/components/MarkFormField/style.module.scss | 2 +- src/components/PDFView/PdfMarking.tsx | 4 ++-- src/utils/const.ts | 2 +- 3 files changed, 4 insertions(+), 4 deletions(-) diff --git a/src/components/MarkFormField/style.module.scss b/src/components/MarkFormField/style.module.scss index 0125140..686595f 100644 --- a/src/components/MarkFormField/style.module.scss +++ b/src/components/MarkFormField/style.module.scss @@ -122,7 +122,7 @@ align-items: center; grid-gap: 15px; box-shadow: 0 -2px 4px 0 rgb(0, 0, 0, 0.1); - max-width: 750px; + max-width: 450px; &.expanded { display: flex; diff --git a/src/components/PDFView/PdfMarking.tsx b/src/components/PDFView/PdfMarking.tsx index e11ee65..222c393 100644 --- a/src/components/PDFView/PdfMarking.tsx +++ b/src/components/PDFView/PdfMarking.tsx @@ -70,8 +70,8 @@ const PdfMarking = (props: PdfMarkingProps) => { const handleMarkClick = (id: number) => { const nextMark = currentUserMarks.find((mark) => mark.mark.id === id) - setSelectedMark(nextMark!) - setSelectedMarkValue(nextMark?.mark.value ?? EMPTY) + + if (nextMark) handleCurrentUserMarkChange(nextMark) } const handleCurrentUserMarkChange = (mark: CurrentUserMark) => { diff --git a/src/utils/const.ts b/src/utils/const.ts index bf38404..522f242 100644 --- a/src/utils/const.ts +++ b/src/utils/const.ts @@ -119,6 +119,6 @@ export const SIGNATURE_PAD_OPTIONS = { } as const export const SIGNATURE_PAD_SIZE = { - width: 600, + width: 300, height: 300 } From 413da78c5c06b5b35740692f6b7c00125a7c8969 Mon Sep 17 00:00:00 2001 From: enes Date: Fri, 29 Nov 2024 11:15:10 +0100 Subject: [PATCH 2/4] fix(mark): css position --- src/components/DrawPDFFields/style.module.scss | 16 ++++++++++++---- src/components/PDFView/PdfMarkItem.tsx | 2 +- src/pages/verify/style.module.scss | 4 ---- 3 files changed, 13 insertions(+), 9 deletions(-) diff --git a/src/components/DrawPDFFields/style.module.scss b/src/components/DrawPDFFields/style.module.scss index 0a89fbf..7ae0de3 100644 --- a/src/components/DrawPDFFields/style.module.scss +++ b/src/components/DrawPDFFields/style.module.scss @@ -38,10 +38,6 @@ visibility: hidden; } - &.edited { - outline: 1px dotted #01aaad; - } - .resizeHandle { position: absolute; right: -5px; @@ -99,3 +95,15 @@ height: 21px; } } + +.signingRectangle { + position: absolute; + outline: 1px solid #01aaad; + z-index: 40; + background-color: #01aaad4b; + cursor: pointer; + + &.edited { + outline: 1px dotted #01aaad; + } +} diff --git a/src/components/PDFView/PdfMarkItem.tsx b/src/components/PDFView/PdfMarkItem.tsx index 0eaa49d..a1dddb3 100644 --- a/src/components/PDFView/PdfMarkItem.tsx +++ b/src/components/PDFView/PdfMarkItem.tsx @@ -32,7 +32,7 @@ const PdfMarkItem = forwardRef(
Date: Fri, 29 Nov 2024 12:17:23 +0100 Subject: [PATCH 3/4] fix(create): remove small drawn fields Closes #234 --- src/components/DrawPDFFields/index.tsx | 19 +++++++++++++++++++ 1 file changed, 19 insertions(+) diff --git a/src/components/DrawPDFFields/index.tsx b/src/components/DrawPDFFields/index.tsx index 09c7d8f..687b7e3 100644 --- a/src/components/DrawPDFFields/index.tsx +++ b/src/components/DrawPDFFields/index.tsx @@ -22,6 +22,11 @@ import { AvatarIconButton } from '../UserAvatarIconButton' import { UserAvatar } from '../UserAvatar' import _ from 'lodash' +const MINIMUM_RECT_SIZE = { + width: 21, + height: 21 +} as const + const DEFAULT_START_SIZE = { width: 140, height: 40 @@ -91,6 +96,7 @@ export const DrawPDFFields = (props: Props) => { window.removeEventListener('pointerup', handlePointerUp) window.removeEventListener('pointercancel', handlePointerUp) } + // eslint-disable-next-line react-hooks/exhaustive-deps }, []) const refreshPdfFiles = () => { @@ -149,6 +155,18 @@ export const DrawPDFFields = (props: Props) => { * @param event Pointer event */ const handlePointerUp = () => { + sigitFiles.forEach((s) => { + s.pages?.forEach((p) => { + // Remove small rects (accidentaly created) + p.drawnFields = p.drawnFields.filter( + (f) => + !( + f.width < MINIMUM_RECT_SIZE.width || + f.height < MINIMUM_RECT_SIZE.height + ) + ) + }) + }) setMouseState((prev) => { return { ...prev, @@ -157,6 +175,7 @@ export const DrawPDFFields = (props: Props) => { resizing: false } }) + refreshPdfFiles() } /** From 6193c20ac30e849c0e6f36b18c0f4c529e31bdd0 Mon Sep 17 00:00:00 2001 From: enes Date: Fri, 29 Nov 2024 12:45:37 +0100 Subject: [PATCH 4/4] refactor(create): update comment --- src/components/DrawPDFFields/index.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/DrawPDFFields/index.tsx b/src/components/DrawPDFFields/index.tsx index 687b7e3..b9fd162 100644 --- a/src/components/DrawPDFFields/index.tsx +++ b/src/components/DrawPDFFields/index.tsx @@ -157,7 +157,7 @@ export const DrawPDFFields = (props: Props) => { const handlePointerUp = () => { sigitFiles.forEach((s) => { s.pages?.forEach((p) => { - // Remove small rects (accidentaly created) + // Remove drawn fields below the MINIMUM_RECT_SIZE threshhold p.drawnFields = p.drawnFields.filter( (f) => !(