src/components/DrawPDFFields/index.tsx

@@ -9,7 +9,7 @@ import {
 } from '@mui/material'
 import styles from './style.module.scss'
 import React, { useEffect, useState } from 'react'
-import { ProfileMetadata, User, UserRole, KeyboardCode } from '../../types'
+import { ProfileMetadata, User, UserRole } from '../../types'
 import { MouseState, PdfPage, DrawnField, DrawTool } from '../../types/drawing'
 import { hexToNpub, npubToHex, getProfileUsername } from '../../utils'
 import { SigitFile } from '../../utils/file'
@@ -27,10 +27,6 @@ const DEFAULT_START_SIZE = {
   height: 40
 } as const
 
-interface HideSignersForDrawnField {
-  [key: number]: boolean
-}
-
 interface Props {
   users: User[]
   metadata: { [key: string]: ProfileMetadata }
@@ -45,9 +41,6 @@ export const DrawPDFFields = (props: Props) => {
   const signers = users.filter((u) => u.role === UserRole.signer)
   const defaultSignerNpub = signers.length ? hexToNpub(signers[0].pubkey) : ''
   const [lastSigner, setLastSigner] = useState(defaultSignerNpub)
-  const [hideSignersForDrawnField, setHideSignersForDrawnField] =
-    useState<HideSignersForDrawnField>({})
-
   /**
    * Return first pubkey that is present in the signers list
    * @param pubkeys
@@ -224,12 +217,6 @@ export const DrawPDFFields = (props: Props) => {
         y: drawingRectangleCoords.y
       }
     })
-
-    // make signers dropdown visible
-    setHideSignersForDrawnField((prev) => ({
-      ...prev,
-      [drawnFieldIndex]: false
-    }))
   }
 
   /**
@@ -351,32 +338,6 @@ export const DrawPDFFields = (props: Props) => {
     event.stopPropagation()
   }
 
-  /**
-   * Handles Escape button-down event and hides all signers dropdowns
-   * @param event SyntheticEvent event
-   */
-  const handleEscapeButtonDown = (event: React.SyntheticEvent) => {
-    // get native event
-    const { nativeEvent } = event
-
-    //check if event is a keyboard event
-    if (nativeEvent instanceof KeyboardEvent) {
-      // check if event code is Escape
-      if (nativeEvent.code === KeyboardCode.Escape) {
-        // hide all signers dropdowns
-        const newHideSignersForDrawnField: HideSignersForDrawnField = {}
-
-        Object.keys(hideSignersForDrawnField).forEach((key) => {
-          // Object.keys always returns an array of strings,
-          // that is why unknown type is used below
-          newHideSignersForDrawnField[key as unknown as number] = true
-        })
-
-        setHideSignersForDrawnField(newHideSignersForDrawnField)
-      }
-    }
-  }
-
   /**
    * Gets the pointer coordinates relative to a element in the `event` param
    * @param event PointerEvent
@@ -400,7 +361,6 @@ export const DrawPDFFields = (props: Props) => {
       rect
     }
   }
-
   /**
    * Renders the pdf pages and drawing elements
    */
@@ -415,8 +375,6 @@ export const DrawPDFFields = (props: Props) => {
             <div
               key={pageIndex}
               className={`image-wrapper ${styles.pdfImageWrapper} ${selectedTool ? styles.drawing : ''}`}
-              tabIndex={-1}
-              onKeyDown={(event) => handleEscapeButtonDown(event)}
             >
               <img
                 onPointerMove={(event) => {
@@ -534,17 +492,13 @@ export const DrawPDFFields = (props: Props) => {
                       fileIndex,
                       pageIndex,
                       drawnFieldIndex
-                    ) &&
+                    ) && (
-                      (!hideSignersForDrawnField ||
-                        !hideSignersForDrawnField[drawnFieldIndex]) && (
                       <div
                         onPointerDown={handleUserSelectPointerDown}
                         className={styles.userSelect}
                       >
                         <FormControl fullWidth size="small">
-                            <InputLabel id="counterparts">
+                          <InputLabel id="counterparts">Counterpart</InputLabel>
-                              Counterpart
-                            </InputLabel>
                           <Select
                             value={getAvailableSigner(drawnField.counterpart)}
                             onChange={(event) => {
@@ -568,18 +522,6 @@ export const DrawPDFFields = (props: Props) => {
                                 npub,
                                 metadata
                               )
-                                // make current signers dropdown visible
-                                if (
-                                  hideSignersForDrawnField[drawnFieldIndex] ===
-                                    undefined ||
-                                  hideSignersForDrawnField[drawnFieldIndex] ===
-                                    true
-                                ) {
-                                  setHideSignersForDrawnField((prev) => ({
-                                    ...prev,
-                                    [drawnFieldIndex]: false
-                                  }))
-                                }
 
                               return (
                                 <MenuItem key={index} value={npub}>

src/components/DrawPDFFields/style.module.scss

@@ -13,10 +13,6 @@
   }
 }
 
-.pdfImageWrapper:focus {
-  outline: none;
-}
-
 .placeholder {
   position: absolute;
   opacity: 0.5;

src/pages/create/index.tsx

@@ -21,8 +21,7 @@ import {
   ProfileMetadata,
   SignedEvent,
   User,
-  UserRole,
+  UserRole
-  KeyboardCode
 } from '../../types'
 import {
   encryptArrayBuffer,
@@ -88,10 +87,7 @@ export const CreatePage = () => {
 
   const [userInput, setUserInput] = useState('')
   const handleInputKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {
-    if (
+    if (event.code === 'Enter' || event.code === 'NumpadEnter') {
-      event.code === KeyboardCode.Enter ||
-      event.code === KeyboardCode.NumpadEnter
-    ) {
       event.preventDefault()
       handleAddUser()
     }

src/pages/nostr/index.tsx

@@ -9,7 +9,6 @@ import { toast } from 'react-toastify'
 import { LoadingSpinner } from '../../components/LoadingSpinner'
 import { AuthController } from '../../controllers'
 import { updateKeyPair, updateLoginMethod } from '../../store/actions'
-import { KeyboardCode } from '../../types'
 import { LoginMethod } from '../../store/auth/types'
 import { hexToBytes } from '@noble/hashes/utils'
 
@@ -53,10 +52,7 @@ export const Nostr = () => {
    * Call login function when enter is pressed
    */
   const handleInputKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {
-    if (
+    if (event.code === 'Enter' || event.code === 'NumpadEnter') {
-      event.code === KeyboardCode.Enter ||
-      event.code === KeyboardCode.NumpadEnter
-    ) {
       event.preventDefault()
       login()
     }

src/types/event.ts

@@ -1,5 +0,0 @@
-export enum KeyboardCode {
-  Escape = 'Escape',
-  Enter = 'Enter',
-  NumpadEnter = 'NumpadEnter'
-}

src/types/index.ts

@@ -4,4 +4,3 @@ export * from './nostr'
 export * from './profile'
 export * from './relay'
 export * from './zip'
-export * from './event'