src/components/DrawPDFFields/index.tsx

@@ -37,7 +37,7 @@ interface Props {
 }
 
 export const DrawPDFFields = (props: Props) => {
-  const { selectedFiles, selectedTool } = props
+  const { selectedFiles, selectedTool, onDrawFieldsChange, users } = props
 
   const [pdfFiles, setPdfFiles] = useState<PdfFile[]>([])
   const [parsingPdf, setParsingPdf] = useState<boolean>(false)
@@ -67,8 +67,8 @@ export const DrawPDFFields = (props: Props) => {
   }, [selectedFiles])
 
   useEffect(() => {
-    if (pdfFiles) props.onDrawFieldsChange(pdfFiles)
+    if (pdfFiles) onDrawFieldsChange(pdfFiles)
-  }, [pdfFiles, props])
+  }, [onDrawFieldsChange, pdfFiles])
 
   /**
    * Drawing events
@@ -96,7 +96,7 @@ export const DrawPDFFields = (props: Props) => {
    * @param page PdfPage where press happened
    */
   const onMouseDown = (
-    event: React.MouseEvent<HTMLDivElement, MouseEvent>,
+    event: React.MouseEvent<HTMLDivElement>,
     page: PdfPage
   ) => {
     // Proceed only if left click
@@ -149,7 +149,7 @@ export const DrawPDFFields = (props: Props) => {
    * @param page PdfPage where moving is happening
    */
   const onMouseMove = (
-    event: React.MouseEvent<HTMLDivElement, MouseEvent>,
+    event: React.MouseEvent<HTMLDivElement>,
     page: PdfPage
   ) => {
     if (mouseState.clicked && selectedTool) {
@@ -188,9 +188,7 @@ export const DrawPDFFields = (props: Props) => {
    * @param event Mouse event
    * @param drawnField Which we are moving
    */
-  const onDrawnFieldMouseDown = (
+  const onDrawnFieldMouseDown = (event: React.MouseEvent<HTMLDivElement>) => {
-    event: React.MouseEvent<HTMLDivElement, MouseEvent>
-  ) => {
     event.stopPropagation()
 
     // Proceed only if left click
@@ -214,7 +212,7 @@ export const DrawPDFFields = (props: Props) => {
    * @param drawnField which we are moving
    */
   const onDrawnFieldMouseMove = (
-    event: React.MouseEvent<HTMLDivElement, MouseEvent>,
+    event: React.MouseEvent<HTMLDivElement>,
     drawnField: DrawnField
   ) => {
     if (mouseState.dragging) {
@@ -250,7 +248,7 @@ export const DrawPDFFields = (props: Props) => {
    * @param drawnField which we are resizing
    */
   const onResizeHandleMouseDown = (
-    event: React.MouseEvent<HTMLSpanElement, MouseEvent>
+    event: React.MouseEvent<HTMLSpanElement>
   ) => {
     // Proceed only if left click
     if (event.button !== 0) return
@@ -268,7 +266,7 @@ export const DrawPDFFields = (props: Props) => {
    * @param drawnField which we are resizing
    */
   const onResizeHandleMouseMove = (
-    event: React.MouseEvent<HTMLSpanElement, MouseEvent>,
+    event: React.MouseEvent<HTMLSpanElement>,
     drawnField: DrawnField
   ) => {
     if (mouseState.resizing) {
@@ -298,7 +296,7 @@ export const DrawPDFFields = (props: Props) => {
    * @param drawnFileIndex drawn file index
    */
   const onRemoveHandleMouseDown = (
-    event: React.MouseEvent<HTMLSpanElement, MouseEvent>,
+    event: React.MouseEvent<HTMLSpanElement>,
     pdfFileIndex: number,
     pdfPageIndex: number,
     drawnFileIndex: number
@@ -317,7 +315,7 @@ export const DrawPDFFields = (props: Props) => {
    * @param event Mouse event
    */
   const onUserSelectHandleMouseDown = (
-    event: React.MouseEvent<HTMLDivElement, MouseEvent>
+    event: React.MouseEvent<HTMLDivElement>
   ) => {
     event.stopPropagation()
   }
@@ -329,8 +327,8 @@ export const DrawPDFFields = (props: Props) => {
    * event.target will be used
    */
   const getMouseCoordinates = (
-    event: React.MouseEvent<HTMLElement, MouseEvent>,
+    event: React.MouseEvent<HTMLElement>,
-    customTarget?: HTMLElement | null
+    customTarget?: HTMLElement
   ) => {
     const target = customTarget ? customTarget : event.currentTarget
     const rect = target.getBoundingClientRect()
@@ -419,7 +417,7 @@ export const DrawPDFFields = (props: Props) => {
                           labelId="counterparts"
                           label="Counterparts"
                         >
-                          {props.users
+                          {users
                             .filter((u) => u.role === UserRole.signer)
                             .map((user, index) => {
                               let displayValue = truncate(

src/components/MarkFormField/index.tsx

@@ -7,15 +7,17 @@ import {
   isCurrentUserMarksComplete,
   isCurrentValueLast
 } from '../../utils'
-import { useState } from 'react'
+import React, { useState } from 'react'
 
 interface MarkFormFieldProps {
-  handleSubmit: (event: any) => void
-  handleSelectedMarkValueChange: (event: any) => void
-  selectedMark: CurrentUserMark
-  selectedMarkValue: string
   currentUserMarks: CurrentUserMark[]
   handleCurrentUserMarkChange: (mark: CurrentUserMark) => void
+  handleSelectedMarkValueChange: (
+    event: React.ChangeEvent<HTMLInputElement>
+  ) => void
+  handleSubmit: (event: React.FormEvent<HTMLFormElement>) => void
+  selectedMark: CurrentUserMark
+  selectedMarkValue: string
 }
 
 /**

src/types/mark.ts

@@ -1,4 +1,4 @@
-import { MarkType } from "./drawing";
+import { MarkType } from './drawing'
 
 export interface CurrentUserMark {
   id: number