From dfdcb8419d5b3c8ca34c6f9590107ce120a53174 Mon Sep 17 00:00:00 2001
From: enes <mulahasanovic@outlook.com>
Date: Tue, 17 Sep 2024 17:21:30 +0200
Subject: [PATCH] fix(marks): add default signer

---
 src/components/DrawPDFFields/index.tsx | 113 ++++++++++++-------------
 1 file changed, 56 insertions(+), 57 deletions(-)

diff --git a/src/components/DrawPDFFields/index.tsx b/src/components/DrawPDFFields/index.tsx
index 7c1227d..aa6b0e5 100644
--- a/src/components/DrawPDFFields/index.tsx
+++ b/src/components/DrawPDFFields/index.tsx
@@ -37,6 +37,8 @@ interface Props {
 
 export const DrawPDFFields = (props: Props) => {
   const { selectedFiles, selectedTool, onDrawFieldsChange, users } = props
+  const signers = users.filter((u) => u.role === UserRole.signer)
+  const defaultSignerNpub = signers.length ? hexToNpub(signers[0].pubkey) : ''
   const { to, from } = useScale()
 
   const [sigitFiles, setSigitFiles] = useState<SigitFile[]>([])
@@ -115,7 +117,7 @@ export const DrawPDFFields = (props: Props) => {
       top: to(page.width, y),
       width: event.pointerType === 'mouse' ? 0 : DEFAULT_START_SIZE.width,
       height: event.pointerType === 'mouse' ? 0 : DEFAULT_START_SIZE.height,
-      counterpart: '',
+      counterpart: defaultSignerNpub,
       type: selectedTool.identifier
     }
 
@@ -453,7 +455,9 @@ export const DrawPDFFields = (props: Props) => {
                       <FormControl fullWidth size="small">
                         <InputLabel id="counterparts">Counterpart</InputLabel>
                         <Select
-                          value={drawnField.counterpart}
+                          value={
+                            drawnField.counterpart || defaultSignerNpub || ''
+                          }
                           onChange={(event) => {
                             drawnField.counterpart = event.target.value
                             refreshPdfFiles()
@@ -465,52 +469,47 @@ export const DrawPDFFields = (props: Props) => {
                           }}
                           renderValue={(value) => renderCounterpartValue(value)}
                         >
-                          {users
-                            .filter((u) => u.role === UserRole.signer)
-                            .map((user, index) => {
-                              const npub = hexToNpub(user.pubkey)
-                              let displayValue = truncate(npub, {
-                                length: 16
-                              })
+                          {signers.map((signer, index) => {
+                            const npub = hexToNpub(signer.pubkey)
+                            let displayValue = truncate(npub, {
+                              length: 16
+                            })
 
-                              const metadata = props.metadata[user.pubkey]
+                            const metadata = props.metadata[signer.pubkey]
 
-                              if (metadata) {
-                                displayValue = truncate(
-                                  metadata.name ||
-                                    metadata.display_name ||
-                                    metadata.username ||
-                                    npub,
-                                  {
-                                    length: 16
-                                  }
-                                )
-                              }
-
-                              return (
-                                <MenuItem
-                                  key={index}
-                                  value={hexToNpub(user.pubkey)}
-                                >
-                                  <ListItemIcon>
-                                    <AvatarIconButton
-                                      src={metadata?.picture}
-                                      hexKey={user.pubkey}
-                                      aria-label={`account of user ${displayValue}`}
-                                      color="inherit"
-                                      sx={{
-                                        padding: 0,
-                                        '> img': {
-                                          width: '30px',
-                                          height: '30px'
-                                        }
-                                      }}
-                                    />
-                                  </ListItemIcon>
-                                  <ListItemText>{displayValue}</ListItemText>
-                                </MenuItem>
+                            if (metadata) {
+                              displayValue = truncate(
+                                metadata.name ||
+                                  metadata.display_name ||
+                                  metadata.username ||
+                                  npub,
+                                {
+                                  length: 16
+                                }
                               )
-                            })}
+                            }
+
+                            return (
+                              <MenuItem key={index} value={npub}>
+                                <ListItemIcon>
+                                  <AvatarIconButton
+                                    src={metadata?.picture}
+                                    hexKey={signer.pubkey}
+                                    aria-label={`account of user ${displayValue}`}
+                                    color="inherit"
+                                    sx={{
+                                      padding: 0,
+                                      '> img': {
+                                        width: '30px',
+                                        height: '30px'
+                                      }
+                                    }}
+                                  />
+                                </ListItemIcon>
+                                <ListItemText>{displayValue}</ListItemText>
+                              </MenuItem>
+                            )
+                          })}
                         </Select>
                       </FormControl>
                     </div>
@@ -524,28 +523,28 @@ export const DrawPDFFields = (props: Props) => {
     )
   }
 
-  const renderCounterpartValue = (value: string) => {
-    const user = users.find((u) => u.pubkey === npubToHex(value))
-    if (user) {
-      let displayValue = truncate(value, {
-        length: 16
-      })
-
-      const metadata = props.metadata[user.pubkey]
+  const renderCounterpartValue = (npub: string) => {
+    let displayValue = truncate(npub, {
+      length: 16
+    })
 
+    const signer = signers.find((u) => u.pubkey === npubToHex(npub))
+    if (signer) {
+      const metadata = props.metadata[signer.pubkey]
       if (metadata) {
         displayValue = truncate(
-          metadata.name || metadata.display_name || metadata.username || value,
+          metadata.display_name || metadata.name || npub,
           {
             length: 16
           }
         )
       }
+
       return (
         <>
           <AvatarIconButton
-            src={props.metadata[user.pubkey]?.picture}
-            hexKey={npubToHex(user.pubkey) || undefined}
+            src={props.metadata[signer.pubkey]?.picture}
+            hexKey={signer.pubkey || undefined}
             sx={{
               padding: 0,
               marginRight: '6px',
@@ -560,7 +559,7 @@ export const DrawPDFFields = (props: Props) => {
       )
     }
 
-    return value
+    return displayValue
   }
 
   if (parsingPdf) {