From 1bc702d57e87e22b3f1a8d82d17123f9618b0071 Mon Sep 17 00:00:00 2001 From: Eugene Date: Mon, 5 Aug 2024 14:11:15 +0300 Subject: [PATCH 1/2] 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'; From 37b0ae21e0248ae6f75d123e5439a035fb6164ec Mon Sep 17 00:00:00 2001 From: Eugene Date: Mon, 5 Aug 2024 14:46:42 +0300 Subject: [PATCH 2/2] fixes linting errors and adds comments --- src/pages/sign/MarkFormField.tsx | 4 +--- src/pages/sign/index.tsx | 8 ++------ src/types/mark.ts | 34 -------------------------------- src/utils/index.ts | 2 +- src/utils/mark.ts | 2 +- src/utils/misc.ts | 14 ++----------- src/utils/zip.ts | 8 +++----- 7 files changed, 10 insertions(+), 62 deletions(-) diff --git a/src/pages/sign/MarkFormField.tsx b/src/pages/sign/MarkFormField.tsx index c843045..4de82a4 100644 --- a/src/pages/sign/MarkFormField.tsx +++ b/src/pages/sign/MarkFormField.tsx @@ -1,4 +1,4 @@ -import { CurrentUserMark, Mark } from '../../types/mark.ts' +import { CurrentUserMark } from '../../types/mark.ts' import styles from './style.module.scss' import { Box, Button, TextField } from '@mui/material' @@ -13,8 +13,6 @@ interface MarkFormFieldProps { /** * 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; diff --git a/src/pages/sign/index.tsx b/src/pages/sign/index.tsx index 02631dc..e0ef228 100644 --- a/src/pages/sign/index.tsx +++ b/src/pages/sign/index.tsx @@ -337,15 +337,13 @@ export const SignPage = () => { if (!keysFileContent) return null - const parsedJSON = await parseJson<{ sender: string; keys: string[] }>( + return await parseJson<{ sender: string; keys: string[] }>( keysFileContent ).catch((err) => { console.log(`Error parsing content of keys.json:`, err) toast.error(err.message || `Error parsing content of keys.json`) return null }) - - return parsedJSON } const decrypt = async (file: File) => { @@ -603,15 +601,13 @@ export const SignPage = () => { 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 zip file generation diff --git a/src/types/mark.ts b/src/types/mark.ts index 5381298..8be57ac 100644 --- a/src/types/mark.ts +++ b/src/types/mark.ts @@ -15,40 +15,6 @@ export interface Mark { value?: string; } -export interface MarkConfig { - /** - * @key user npub - */ - [key: string]: User -} - -export interface User { - /** - * @key png (pdf page) file hash - */ - [key: string]: MarkConfigDetails[] -} - -export interface MarkDetails { - /** - * @key coords in format X:10;Y:50 - */ - [key: string]: MarkValue -} - -export interface MarkValue { - value: string -} - -export interface MarkConfigDetails { - type: MarkType; - /** - * Coordinates in format: X:10;Y:50 - */ - location: MarkLocation; - value?: MarkValue -} - export interface MarkLocation { top: number; left: number; diff --git a/src/utils/index.ts b/src/utils/index.ts index f65fb79..1b0c133 100644 --- a/src/utils/index.ts +++ b/src/utils/index.ts @@ -6,4 +6,4 @@ export * from './nostr' export * from './string' export * from './zip' export * from './utils' -export { extractMarksFromSignedMeta } from './mark.ts' +export * from './mark' diff --git a/src/utils/mark.ts b/src/utils/mark.ts index 59860ce..13cff84 100644 --- a/src/utils/mark.ts +++ b/src/utils/mark.ts @@ -85,7 +85,7 @@ const updateCurrentUserMarks = (currentUserMarks: CurrentUserMark[], markToUpdat ] } -const isLast = (index: number, arr: any[]) => (index === (arr.length -1)) +const isLast = (index: number, arr: T[]) => (index === (arr.length -1)) export { getCurrentUserMarks, diff --git a/src/utils/misc.ts b/src/utils/misc.ts index e6f5058..728408c 100644 --- a/src/utils/misc.ts +++ b/src/utils/misc.ts @@ -12,11 +12,10 @@ import { toast } from 'react-toastify' import { NostrController } from '../controllers' import { AuthState } from '../store/auth/types' import store from '../store/store' -import { CreateSignatureEventContent, Meta, SignedEventContent } from '../types' +import { CreateSignatureEventContent, Meta } from '../types' import { hexToNpub, now } from './nostr' import { parseJson } from './string' import { hexToBytes } from '@noble/hashes/utils' -import { Mark } from '../types/mark.ts' /** * Uploads a file to a file storage service. @@ -84,14 +83,12 @@ export const signEventForMetaFile = async ( } // Sign the event - const signedEvent = await nostrController.signEvent(event).catch((err) => { + return await nostrController.signEvent(event).catch((err) => { console.error(err) toast.error(err.message || 'Error occurred in signing nostr event') setIsLoading(false) // Set loading state to false return null }) - - return signedEvent // Return the signed event } /** @@ -265,10 +262,3 @@ export const extractZipUrlAndEncryptionKey = async (meta: Meta) => { return null } - -export const extractMarksFromSignedMeta = (meta: Meta): Mark[] => { - return Object.values(meta.docSignatures) - .map((val: string) => JSON.parse(val as string)) - .map((val: Event) => JSON.parse(val.content)) - .flatMap((val: SignedEventContent) => val.marks); -} diff --git a/src/utils/zip.ts b/src/utils/zip.ts index c289cbe..2d33aa5 100644 --- a/src/utils/zip.ts +++ b/src/utils/zip.ts @@ -22,8 +22,9 @@ const readContentOfZipEntry = async ( return null } - // Read the content of the zip entry asynchronously - const fileContent = await zipEntry.async(outputType).catch((err) => { + // Read and return the content of the zip entry asynchronously + // or null if an error has occurred + return await zipEntry.async(outputType).catch((err) => { // Handle any errors that occur during the read operation console.log(`Error reading content of ${filePath}:`, err) toast.error( @@ -31,9 +32,6 @@ const readContentOfZipEntry = async ( ) return null }) - - // Return the file content or null if an error occurred - return fileContent } const loadZip = async (data: InputFileFormat): Promise => {