diff --git a/src/components/DrawPDFFields/index.tsx b/src/components/DrawPDFFields/index.tsx
index 7ddf292..13a50c0 100644
--- a/src/components/DrawPDFFields/index.tsx
+++ b/src/components/DrawPDFFields/index.tsx
@@ -1,7 +1,5 @@
import { Close } from '@mui/icons-material'
import {
- Box,
- CircularProgress,
FormControl,
InputLabel,
ListItemIcon,
@@ -22,6 +20,7 @@ import { ExtensionFileBox } from '../ExtensionFileBox'
import { inPx } from '../../utils/pdf'
import { useScale } from '../../hooks/useScale'
import { AvatarIconButton } from '../UserAvatarIconButton'
+import { LoadingSpinner } from '../LoadingSpinner'
PDFJS.GlobalWorkerOptions.workerSrc = new URL(
'pdfjs-dist/build/pdf.worker.min.mjs',
@@ -530,11 +529,7 @@ export const DrawPDFFields = (props: Props) => {
}
if (parsingPdf) {
- return (
-
-
-
- )
+ return
}
if (!sigitFiles.length) {
diff --git a/src/components/LoadingSpinner/index.tsx b/src/components/LoadingSpinner/index.tsx
index 980a763..4e2a0d9 100644
--- a/src/components/LoadingSpinner/index.tsx
+++ b/src/components/LoadingSpinner/index.tsx
@@ -1,18 +1,31 @@
import styles from './style.module.scss'
interface Props {
- desc: string
+ desc?: string
+ variant?: 'small' | 'default'
}
export const LoadingSpinner = (props: Props) => {
- const { desc } = props
+ const { desc, variant = 'default' } = props
- return (
-
- )
+ switch (variant) {
+ case 'small':
+ return (
+
+ )
+
+ default:
+ return (
+
+ )
+ }
}
diff --git a/src/components/LoadingSpinner/style.module.scss b/src/components/LoadingSpinner/style.module.scss
index 75b2609..00852c8 100644
--- a/src/components/LoadingSpinner/style.module.scss
+++ b/src/components/LoadingSpinner/style.module.scss
@@ -11,22 +11,26 @@
justify-content: center;
background-color: rgba(0, 0, 0, 0.5);
z-index: 9999;
+}
- .loadingSpinnerContainer {
- display: flex;
- flex-direction: column;
- align-items: center;
- justify-content: center;
- }
+.loadingSpinnerContainer {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
- .loadingSpinner {
- background: url('/favicon.png') no-repeat center / cover;
- width: 40px;
- height: 40px;
- animation: spin 1s linear infinite;
+ &.withHeight {
+ min-height: 250px;
}
}
+.loadingSpinner {
+ background: url('/favicon.png') no-repeat center / cover;
+ width: 40px;
+ height: 40px;
+ animation: spin 1s linear infinite;
+}
+
.loadingSpinnerDesc {
color: white;
margin-top: 13px;
diff --git a/src/components/PDFView/index.tsx b/src/components/PDFView/index.tsx
index 73c9334..acd1874 100644
--- a/src/components/PDFView/index.tsx
+++ b/src/components/PDFView/index.tsx
@@ -4,6 +4,7 @@ import { CurrentUserFile } from '../../types/file.ts'
import { useEffect, useRef } from 'react'
import { FileDivider } from '../FileDivider.tsx'
import React from 'react'
+import { LoadingSpinner } from '../LoadingSpinner/index.tsx'
interface PdfViewProps {
currentFile: CurrentUserFile | null
@@ -48,30 +49,34 @@ const PdfView = ({
index !== files.length - 1
return (
- {files.map((currentUserFile, index, arr) => {
- const { hash, file, id } = currentUserFile
+ {files.length > 0 ? (
+ files.map((currentUserFile, index, arr) => {
+ const { hash, file, id } = currentUserFile
- if (!hash) return
- return (
-
- (pdfRefs.current[id] = el)}
- >
-
-
- {isNotLastPdfFile(index, arr) && }
-
- )
- })}
+ if (!hash) return
+ return (
+
+ (pdfRefs.current[id] = el)}
+ >
+
+
+ {isNotLastPdfFile(index, arr) && }
+
+ )
+ })
+ ) : (
+
+ )}
)
}
diff --git a/src/pages/verify/index.tsx b/src/pages/verify/index.tsx
index 8f73d25..8f6fcc1 100644
--- a/src/pages/verify/index.tsx
+++ b/src/pages/verify/index.tsx
@@ -79,74 +79,80 @@ const SlimPdfView = ({
}, [currentFile])
return (
- {files.map((currentUserFile, i) => {
- const { hash, file, id } = currentUserFile
- const signatureEvents = Object.keys(parsedSignatureEvents)
- if (!hash) return
- return (
-
- (pdfRefs.current[id] = el)}
- className="file-wrapper"
- >
- {file.isPdf &&
- file.pages?.map((page, i) => {
- const marks: Mark[] = []
+ {files.length > 0 ? (
+ files.map((currentUserFile, i) => {
+ const { hash, file, id } = currentUserFile
+ const signatureEvents = Object.keys(parsedSignatureEvents)
+ if (!hash) return
+ return (
+
+ (pdfRefs.current[id] = el)}
+ className="file-wrapper"
+ >
+ {file.isPdf &&
+ file.pages?.map((page, i) => {
+ const marks: Mark[] = []
- signatureEvents.forEach((e) => {
- const m = parsedSignatureEvents[
- e as `npub1${string}`
- ].parsedContent?.marks.filter(
- (m) => m.pdfFileHash == hash && m.location.page == i
+ signatureEvents.forEach((e) => {
+ const m = parsedSignatureEvents[
+ e as `npub1${string}`
+ ].parsedContent?.marks.filter(
+ (m) => m.pdfFileHash == hash && m.location.page == i
+ )
+ if (m) {
+ marks.push(...m)
+ }
+ })
+ return (
+
+
+ {marks.map((m) => {
+ return (
+
+ {m.value}
+
+ )
+ })}
+
)
- if (m) {
- marks.push(...m)
- }
- })
- return (
-
-
- {marks.map((m) => {
- return (
-
- {m.value}
-
- )
- })}
-
- )
- })}
- {file.isImage && (
-
- )}
- {!(file.isPdf || file.isImage) && (
-
- )}
-
- {i < files.length - 1 && }
-
- )
- })}
+ })}
+ {file.isImage && (
+
+ )}
+ {!(file.isPdf || file.isImage) && (
+
+ )}
+
+ {i < files.length - 1 && }
+
+ )
+ })
+ ) : (
+
+ )}
)
}