chore(git): merge pull request #160 from fix-collection-21-8 into staging

Reviewed-on: #160
Reviewed-by: eugene <eugene@nostrdev.com>

src/components/FileList/index.tsx

@@ -9,13 +9,15 @@ interface FileListProps {
   currentFile: CurrentUserFile
   setCurrentFile: (file: CurrentUserFile) => void
   handleDownload: () => void
+  downloadLabel?: string
 }
 
 const FileList = ({
   files,
   currentFile,
   setCurrentFile,
-  handleDownload
+  handleDownload,
+  downloadLabel
 }: FileListProps) => {
   const isActive = (file: CurrentUserFile) => file.id === currentFile.id
   return (
@@ -41,7 +43,7 @@ const FileList = ({
         </ul>
       </div>
       <Button variant="contained" fullWidth onClick={handleDownload}>
-        Download Files
+        {downloadLabel || 'Download Files'}
       </Button>
     </div>
   )

src/components/MarkFormField/style.module.scss

@@ -41,6 +41,67 @@
     background: #447592;
     color: white;
   }
+
+  .actionButtons {
+    display: flex;
+    flex-direction: row;
+    grid-gap: 5px;
+  }
+
+  .actionsBottom {
+    display: flex;
+    flex-direction: row;
+    grid-gap: 5px;
+    justify-content: center;
+    align-items: center;
+  }
+
+  .submitButton {
+    width: 100%;
+    max-width: 300px;
+    margin-top: 10px;
+  }
+
+  .paginationButton {
+    font-size: 12px;
+    padding: 5px 10px;
+    border-radius: 3px;
+    background: rgba(0, 0, 0, 0.1);
+    color: rgba(0, 0, 0, 0.5);
+  }
+
+  .paginationButton:hover {
+    background: #447592;
+    color: rgba(255, 255, 255, 0.5);
+  }
+
+  .paginationButtonDone {
+    background: #5e8eab;
+    color: rgb(255, 255, 255);
+  }
+
+  .paginationButtonCurrent {
+    height: 2px;
+    width: 100%;
+    background: #4c82a3;
+  }
+
+  .trigger {
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    align-items: center;
+    position: relative;
+  }
+
+  .triggerBtn {
+    background: white;
+    color: #434343;
+    padding: 5px 30px;
+    box-shadow: 0px -3px 4px 0 rgb(0, 0, 0, 0.1);
+    position: absolute;
+    top: -25px;
+  }
 }
 
 .actions {
@@ -92,12 +153,6 @@
   position: relative;
 }
 
-.actionButtons {
-  display: flex;
-  flex-direction: row;
-  grid-gap: 5px;
-}
-
 .inputWrapper {
   display: flex;
   flex-direction: column;
@@ -132,20 +187,6 @@
     linear-gradient(white, white);
 }
 
-.actionsBottom {
-  display: flex;
-  flex-direction: row;
-  grid-gap: 5px;
-  justify-content: center;
-  align-items: center;
-}
-
-.submitButton {
-  width: 100%;
-  max-width: 300px;
-  margin-top: 10px;
-}
-
 .footerContainer {
   display: flex;
   flex-direction: row;
@@ -167,44 +208,3 @@
   flex-direction: column;
   grid-gap: 5px;
 }
-
-.paginationButton {
-  font-size: 12px;
-  padding: 5px 10px;
-  border-radius: 3px;
-  background: rgba(0, 0, 0, 0.1);
-  color: rgba(0, 0, 0, 0.5);
-}
-
-.paginationButton:hover {
-  background: #447592;
-  color: rgba(255, 255, 255, 0.5);
-}
-
-.paginationButtonDone {
-  background: #5e8eab;
-  color: rgb(255, 255, 255);
-}
-
-.paginationButtonCurrent {
-  height: 2px;
-  width: 100%;
-  background: #4c82a3;
-}
-
-.trigger {
-  display: flex;
-  flex-direction: column;
-  justify-content: center;
-  align-items: center;
-  position: relative;
-}
-
-.triggerBtn {
-  background: white;
-  color: #434343;
-  padding: 5px 30px;
-  box-shadow: 0px -3px 4px 0 rgb(0, 0, 0, 0.1);
-  position: absolute;
-  top: -25px;
-}

src/hooks/useSigitProfiles.tsx

@@ -64,7 +64,8 @@ export const useSigitProfiles = (
         })
       }
     }
-  }, [pubkeys, profileMetadata])
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [pubkeys])
 
   return profileMetadata
 }

src/pages/create/index.tsx

@@ -133,7 +133,7 @@ export const CreatePage = () => {
       identifier: MarkType.TEXT,
       icon: <FontAwesomeIcon icon={faT} />,
       label: 'Text',
-      active: false
+      active: true
     },
     {
       identifier: MarkType.SIGNATURE,
@@ -151,7 +151,7 @@ export const CreatePage = () => {
       identifier: MarkType.FULLNAME,
       icon: <FontAwesomeIcon icon={faIdCard} />,
       label: 'Full Name',
-      active: true
+      active: false
     },
     {
       identifier: MarkType.INITIALS,
@@ -930,7 +930,7 @@ export const CreatePage = () => {
             <div className={styles.flexWrap}>
               <div className={styles.inputWrapper}>
                 <TextField
-                  placeholder="User (nip05 / npub)"
+                  placeholder="Add user"
                   value={userInput}
                   onChange={(e) => setUserInput(e.target.value)}
                   onKeyDown={handleInputKeyDown}

src/pages/verify/index.tsx

@@ -48,6 +48,7 @@ import { TooltipChild } from '../../components/TooltipChild.tsx'
 import FileList from '../../components/FileList'
 import { CurrentUserFile } from '../../types/file.ts'
 import { Mark } from '../../types/mark.ts'
+import React from 'react'
 
 interface PdfViewProps {
   files: CurrentUserFile[]
@@ -78,11 +79,10 @@ const SlimPdfView = ({
         const signatureEvents = Object.keys(parsedSignatureEvents)
         if (!hash) return
         return (
-          <>
+          <React.Fragment key={filename}>
             <div
               id={filename}
               ref={(el) => (pdfRefs.current[id] = el)}
-              key={filename}
               className={styles.fileWrapper}
             >
               {pdfFile.pages.map((page, i) => {
@@ -132,7 +132,7 @@ const SlimPdfView = ({
                 File Separator
               </Divider>
             )}
-          </>
+          </React.Fragment>
         )
       })}
     </div>
@@ -538,6 +538,7 @@ export const VerifyPage = () => {
                     currentFile={currentFile}
                     setCurrentFile={setCurrentFile}
                     handleDownload={handleExport}
+                    downloadLabel="Download Sigit"
                   />
                 )}
                 {displayExportedBy()}