From 1bc702d57e87e22b3f1a8d82d17123f9618b0071 Mon Sep 17 00:00:00 2001 From: Eugene Date: Mon, 5 Aug 2024 14:11:15 +0300 Subject: [PATCH] fixes linting errors and adds comments --- src/components/DrawPDFFields/index.tsx | 12 ++++++------ src/components/PDFView/Mark.tsx | 0 src/components/PDFView/PdfItem.tsx | 3 +++ src/components/PDFView/PdfMarkItem.tsx | 7 +++---- src/components/PDFView/PdfMarking.tsx | 12 +++++++++--- src/components/PDFView/PdfPageItem.tsx | 3 +++ src/components/PDFView/index.tsx | 3 +++ src/pages/create/index.tsx | 27 +++++++------------------- src/pages/sign/MarkFormField.tsx | 5 +++++ 9 files changed, 39 insertions(+), 33 deletions(-) delete mode 100644 src/components/PDFView/Mark.tsx diff --git a/src/components/DrawPDFFields/index.tsx b/src/components/DrawPDFFields/index.tsx index 7d25996..d8da516 100644 --- a/src/components/DrawPDFFields/index.tsx +++ b/src/components/DrawPDFFields/index.tsx @@ -139,7 +139,7 @@ export const DrawPDFFields = (props: Props) => { * Drawing is finished, resets all the variables used to draw * @param event Mouse event */ - const onMouseUp = (event: MouseEvent) => { + const onMouseUp = () => { setMouseState((prev) => { return { ...prev, @@ -187,7 +187,7 @@ export const DrawPDFFields = (props: Props) => { * @param event Mouse event * @param drawnField Which we are moving */ - const onDrawnFieldMouseDown = (event: any, drawnField: DrawnField) => { + const onDrawnFieldMouseDown = (event: any) => { event.stopPropagation() // Proceed only if left click @@ -240,7 +240,7 @@ export const DrawPDFFields = (props: Props) => { * @param event Mouse event * @param drawnField which we are resizing */ - const onResizeHandleMouseDown = (event: any, drawnField: DrawnField) => { + const onResizeHandleMouseDown = (event: any) => { // Proceed only if left click if (event.button !== 0) return @@ -377,7 +377,7 @@ export const DrawPDFFields = (props: Props) => { return (
{ onDrawnFieldMouseDown(event, drawnField) }} + onMouseDown={onDrawnFieldMouseDown} onMouseMove={(event) => { onDranwFieldMouseMove(event, drawnField)}} className={styles.drawingRectangle} style={{ @@ -389,7 +389,7 @@ export const DrawPDFFields = (props: Props) => { }} > {onResizeHandleMouseDown(event, drawnField)}} + onMouseDown={onResizeHandleMouseDown} onMouseMove={(event) => {onResizeHandleMouseMove(event, drawnField)}} className={styles.resizeHandle} > @@ -400,7 +400,7 @@ export const DrawPDFFields = (props: Props) => {
{onUserSelectHandleMouseDown(event)}} + onMouseDown={onUserSelectHandleMouseDown} className={styles.userSelect} > diff --git a/src/components/PDFView/Mark.tsx b/src/components/PDFView/Mark.tsx deleted file mode 100644 index e69de29..0000000 diff --git a/src/components/PDFView/PdfItem.tsx b/src/components/PDFView/PdfItem.tsx index 23bbff7..eb5ceff 100644 --- a/src/components/PDFView/PdfItem.tsx +++ b/src/components/PDFView/PdfItem.tsx @@ -10,6 +10,9 @@ interface PdfItemProps { selectedMark: CurrentUserMark | null } +/** + * Responsible for displaying pages of a single Pdf File. + */ const PdfItem = ({ pdfFile, currentUserMarks, handleMarkClick, selectedMarkValue, selectedMark }: PdfItemProps) => { const filterByPage = (marks: CurrentUserMark[], page: number): CurrentUserMark[] => { return marks.filter((m) => m.mark.location.page === page); diff --git a/src/components/PDFView/PdfMarkItem.tsx b/src/components/PDFView/PdfMarkItem.tsx index bb4cdb9..7a2b24b 100644 --- a/src/components/PDFView/PdfMarkItem.tsx +++ b/src/components/PDFView/PdfMarkItem.tsx @@ -9,10 +9,9 @@ interface PdfMarkItemProps { selectedMark: CurrentUserMark | null } -//selectedMark represents the mark that the user is actively editing -// selectedMarkValue representsnthe edited value -// userMark is part of the overall currentUserMark array - +/** + * Responsible for display an individual Pdf Mark. + */ const PdfMarkItem = ({ selectedMark, handleMarkClick, selectedMarkValue, userMark }: PdfMarkItemProps) => { const { location } = userMark.mark; const handleClick = () => handleMarkClick(userMark.mark.id); diff --git a/src/components/PDFView/PdfMarking.tsx b/src/components/PDFView/PdfMarking.tsx index 8dc0489..8de12f0 100644 --- a/src/components/PDFView/PdfMarking.tsx +++ b/src/components/PDFView/PdfMarking.tsx @@ -4,7 +4,7 @@ import PdfView from './index.tsx' import MarkFormField from '../../pages/sign/MarkFormField.tsx' import { PdfFile } from '../../types/drawing.ts' import { CurrentUserMark, Mark } from '../../types/mark.ts' -import { useState, useEffect } from 'react' +import React, { useState, useEffect } from 'react' import { findNextCurrentUserMark, isCurrentUserMarksComplete, @@ -21,6 +21,12 @@ interface PdfMarkingProps { setUpdatedMarks: (markToUpdate: Mark) => void } +/** + * Top-level component responsible for displaying Pdfs, Pages, and Marks, + * as well as tracking if the document is ready to be signed. + * @param props + * @constructor + */ const PdfMarking = (props: PdfMarkingProps) => { const { files, @@ -42,7 +48,7 @@ const PdfMarking = (props: PdfMarkingProps) => { setSelectedMarkValue(nextMark?.mark.value ?? EMPTY); } - const handleSubmit = (event: any) => { + const handleSubmit = (event: React.FormEvent) => { event.preventDefault(); if (!selectedMarkValue || !selectedMark) return; @@ -64,7 +70,7 @@ const PdfMarking = (props: PdfMarkingProps) => { setUpdatedMarks(updatedMark.mark) } - const handleChange = (event: any) => setSelectedMarkValue(event.target.value) + const handleChange = (event: React.ChangeEvent) => setSelectedMarkValue(event.target.value) return ( <> diff --git a/src/components/PDFView/PdfPageItem.tsx b/src/components/PDFView/PdfPageItem.tsx index 20a3cce..d289a6e 100644 --- a/src/components/PDFView/PdfPageItem.tsx +++ b/src/components/PDFView/PdfPageItem.tsx @@ -10,6 +10,9 @@ interface PdfPageProps { selectedMark: CurrentUserMark | null } +/** + * Responsible for rendering a single Pdf Page and its Marks + */ const PdfPageItem = ({ page, currentUserMarks, handleMarkClick, selectedMarkValue, selectedMark }: PdfPageProps) => { return (
{ const filterByFile = (currentUserMarks: CurrentUserMark[], hash: string): CurrentUserMark[] => { return currentUserMarks.filter((currentUserMark) => currentUserMark.mark.pdfFileHash === hash) diff --git a/src/pages/create/index.tsx b/src/pages/create/index.tsx index fd77258..8193937 100644 --- a/src/pages/create/index.tsx +++ b/src/pages/create/index.tsx @@ -63,7 +63,6 @@ import styles from './style.module.scss' import { PdfFile } from '../../types/drawing' import { DrawPDFFields } from '../../components/DrawPDFFields' import { Mark } from '../../types/mark.ts' -import { v4 as uuidv4 } from 'uuid'; export const CreatePage = () => { const navigate = useNavigate() @@ -341,7 +340,7 @@ export const CreatePage = () => { return fileHashes } - const createMarkConfig = (fileHashes: { [key: string]: string }) : Mark[] => { + const createMarks = (fileHashes: { [key: string]: string }) : Mark[] => { return drawnPdfs.flatMap((drawnPdf) => { const fileHash = fileHashes[drawnPdf.file.name]; return drawnPdf.pages.flatMap((page, index) => { @@ -378,15 +377,13 @@ export const CreatePage = () => { const generateZipFile = async (zip: JSZip): Promise => { setLoadingSpinnerDesc('Generating zip file') - const arraybuffer = await zip + return await zip .generateAsync({ type: 'arraybuffer', compression: 'DEFLATE', compressionOptions: { level: 6 } }) .catch(handleZipError) - - return arraybuffer } // Encrypt the zip file with the generated encryption key @@ -433,15 +430,13 @@ export const CreatePage = () => { if (!arraybuffer) return null - const finalZipFile = new File( + return new File( [new Blob([arraybuffer])], `${unixNow}.sigit.zip`, { type: 'application/zip' } ) - - return finalZipFile } // Handle errors during file upload @@ -463,14 +458,12 @@ export const CreatePage = () => { type: 'application/sigit' }) - const fileUrl = await uploadToFileStorage(file) + return await uploadToFileStorage(file) .then((url) => { toast.success('files.zip uploaded to file storage') return url }) .catch(handleUploadError) - - return fileUrl } // Manage offline scenarios for signing or viewing the file @@ -494,15 +487,13 @@ export const CreatePage = () => { zip.file(file.name, file) }) - const arraybuffer = await zip + return await zip .generateAsync({ type: 'arraybuffer', compression: 'DEFLATE', compressionOptions: { level: 6 } }) .catch(handleZipError) - - return arraybuffer } const generateCreateSignature = async ( @@ -513,9 +504,7 @@ export const CreatePage = () => { ) => { const signers = users.filter((user) => user.role === UserRole.signer) const viewers = users.filter((user) => user.role === UserRole.viewer) - const markConfig = createMarkConfig(fileHashes) - - console.log('mark config: ', markConfig) + const markConfig = createMarks(fileHashes) const content: CreateSignatureEventContent = { signers: signers.map((signer) => hexToNpub(signer.pubkey)), @@ -555,11 +544,9 @@ export const CreatePage = () => { : viewers.map((viewer) => viewer.pubkey) ).filter((receiver) => receiver !== usersPubkey) - const promises = receivers.map((receiver) => + return receivers.map((receiver) => sendNotification(receiver, meta) ) - - return promises } const handleCreate = async () => { diff --git a/src/pages/sign/MarkFormField.tsx b/src/pages/sign/MarkFormField.tsx index aee4c29..c843045 100644 --- a/src/pages/sign/MarkFormField.tsx +++ b/src/pages/sign/MarkFormField.tsx @@ -11,6 +11,11 @@ interface MarkFormFieldProps { selectedMarkValue: string } +/** + * Responsible for rendering a form field connected to a mark and keeping track of its value. + * @param props + * @constructor + */ const MarkFormField = (props: MarkFormFieldProps) => { const { handleSubmit, handleChange, selectedMark, selectedMarkValue } = props; const getSubmitButton = () => selectedMark.isLast ? 'Complete' : 'Next';