PDF Markings #114
@ -16,10 +16,10 @@ import { State } from '../../store/rootReducer'
|
||||
import { CreateSignatureEventContent, Meta, SignedEvent } from '../../types'
|
||||
import {
|
||||
decryptArrayBuffer,
|
||||
encryptArrayBuffer,
|
||||
encryptArrayBuffer, extractMarksFromSignedMeta,
|
||||
extractZipUrlAndEncryptionKey,
|
||||
generateEncryptionKey,
|
||||
generateKeysFile,
|
||||
generateKeysFile, getFilesWithHashes,
|
||||
getHash,
|
||||
hexToNpub,
|
||||
isOnline, loadZip,
|
||||
@ -35,10 +35,15 @@ import { DisplayMeta } from './internal/displayMeta'
|
||||
import styles from './style.module.scss'
|
||||
import { PdfFile } from '../../types/drawing.ts'
|
||||
import { convertToPdfFile } from '../../utils/pdf.ts'
|
||||
import PdfView from '../../components/PDFView'
|
||||
import { CurrentUserMark, Mark, MarkConfig } from '../../types/mark.ts'
|
||||
import MarkFormField from './MarkFormField.tsx'
|
||||
// import PdfView from '../../components/PDFView'
|
||||
import { CurrentUserMark, Mark } from '../../types/mark.ts'
|
||||
import { getLastSignersSig } from '../../utils/sign.ts'
|
||||
import {
|
||||
filterMarksByPubkey,
|
||||
getCurrentUserMarks,
|
||||
isCurrentUserMarksComplete, updateMarks
|
||||
} from '../../utils/mark.ts'
|
||||
import PdfMarking from '../../components/PDFView/PdfMarking.tsx'
|
||||
enum SignedStatus {
|
||||
Fully_Signed,
|
||||
User_Is_Next_Signer,
|
||||
@ -95,10 +100,8 @@ export const SignPage = () => {
|
||||
|
||||
const [authUrl, setAuthUrl] = useState<string>()
|
||||
const nostrController = NostrController.getInstance()
|
||||
const [currentUserMark, setCurrentUserMark] = useState<CurrentUserMark | null>(null);
|
||||
const [currentUserMarks, setCurrentUserMarks] = useState<CurrentUserMark[]>([]);
|
||||
const [currentMarkValue, setCurrentMarkValue] = useState<string>('');
|
||||
const [isMarksCompleted, setIsMarksCompleted] = useState(false);
|
||||
const [isReadyToSign, setIsReadyToSign] = useState(false);
|
||||
|
||||
useEffect(() => {
|
||||
if (signers.length > 0) {
|
||||
@ -191,22 +194,13 @@ export const SignPage = () => {
|
||||
setSubmittedBy(createSignatureEvent.pubkey)
|
||||
setMarks(createSignatureContent.markConfig);
|
||||
|
||||
console.log('createSignatureContent markConfig', createSignatureContent);
|
||||
if (usersPubkey) {
|
||||
console.log('this runs behind users pubkey');
|
||||
const curMarks = getCurrentUserMarks(createSignatureContent.markConfig, usersPubkey)
|
||||
if (curMarks.length === 0) {
|
||||
setIsMarksCompleted(true)
|
||||
} else {
|
||||
const nextMark = findNextIncompleteMark(curMarks)
|
||||
if (!nextMark) {
|
||||
setIsMarksCompleted(true)
|
||||
} else {
|
||||
setCurrentUserMark(nextMark)
|
||||
setIsMarksCompleted(false)
|
||||
}
|
||||
setCurrentUserMarks(curMarks)
|
||||
}
|
||||
const metaMarks = filterMarksByPubkey(createSignatureContent.markConfig, usersPubkey!)
|
||||
const signedMarks = extractMarksFromSignedMeta(meta)
|
||||
const currentUserMarks = getCurrentUserMarks(metaMarks, signedMarks);
|
||||
setCurrentUserMarks(currentUserMarks);
|
||||
// setCurrentUserMark(findNextCurrentUserMark(currentUserMarks) || null)
|
||||
setIsReadyToSign(isCurrentUserMarksComplete(currentUserMarks))
|
||||
}
|
||||
|
||||
setSignedBy(Object.keys(meta.docSignatures) as `npub1${string}`[])
|
||||
@ -218,6 +212,7 @@ export const SignPage = () => {
|
||||
}, [meta])
|
||||
|
||||
useEffect(() => {
|
||||
// online mode - from create and home page views
|
||||
if (metaInNavState) {
|
||||
const processSigit = async () => {
|
||||
setIsLoading(true)
|
||||
@ -239,7 +234,7 @@ export const SignPage = () => {
|
||||
.then((res) => {
|
||||
handleArrayBufferFromBlossom(res.data, encryptionKey)
|
||||
setMeta(metaInNavState)
|
||||
console.log('meta in nav state: ', metaInNavState)
|
||||
console.log('meta in nav state runs.')
|
||||
})
|
||||
.catch((err) => {
|
||||
console.error(`error occurred in getting file from ${zipUrl}`, err)
|
||||
@ -330,6 +325,11 @@ export const SignPage = () => {
|
||||
setCurrentFileHashes(fileHashes)
|
||||
}
|
||||
|
||||
const setUpdatedMarks = (markToUpdate: Mark) => {
|
||||
const updatedMarks = updateMarks(marks, markToUpdate)
|
||||
setMarks(updatedMarks)
|
||||
}
|
||||
|
||||
const parseKeysJson = async (zip: JSZip) => {
|
||||
const keysFileContent = await readContentOfZipEntry(
|
||||
zip,
|
||||
@ -540,56 +540,41 @@ export const SignPage = () => {
|
||||
return currentUserMarks.map(( { mark }: CurrentUserMark) => mark);
|
||||
}
|
||||
|
||||
const handleMarkClick = (id: number) => {
|
||||
const nextMark = currentUserMarks.find(mark => mark.mark.id === id)
|
||||
setCurrentUserMark(nextMark!)
|
||||
setCurrentMarkValue(nextMark?.mark.value || "")
|
||||
}
|
||||
// const handleMarkClick = (id: number) => {
|
||||
// const nextMark = currentUserMarks.find(mark => mark.mark.id === id)
|
||||
// setCurrentUserMark(nextMark!)
|
||||
// setCurrentMarkValue(nextMark?.mark.value || "")
|
||||
// }
|
||||
|
||||
const getMarkConfigPerUser = (markConfig: MarkConfig) => {
|
||||
if (!usersPubkey) return;
|
||||
return markConfig[hexToNpub(usersPubkey)];
|
||||
}
|
||||
// const getMarkConfigPerUser = (markConfig: MarkConfig) => {
|
||||
// if (!usersPubkey) return;
|
||||
// return markConfig[hexToNpub(usersPubkey)];
|
||||
// }
|
||||
|
||||
const handleChange = (event: any) => setCurrentMarkValue(event.target.value);
|
||||
|
||||
const handleSubmit = (event: any) => {
|
||||
event.preventDefault();
|
||||
if (!currentMarkValue || !currentUserMark) return;
|
||||
|
||||
const curMark = {
|
||||
...currentUserMark.mark,
|
||||
value: currentMarkValue
|
||||
};
|
||||
|
||||
const indexToUpdate = marks.findIndex(mark => mark.id === curMark.id);
|
||||
|
||||
const updatedMarks: Mark[] = [
|
||||
...marks.slice(0, indexToUpdate),
|
||||
curMark,
|
||||
...marks.slice(indexToUpdate + 1)
|
||||
];
|
||||
|
||||
setMarks(updatedMarks)
|
||||
setCurrentMarkValue("")
|
||||
|
||||
const updatedCurUserMarks = getCurrentUserMarks(updatedMarks, usersPubkey!)
|
||||
console.log('updatedCurUserMarks: ', updatedCurUserMarks)
|
||||
setCurrentUserMarks(updatedCurUserMarks)
|
||||
const nextMark = findNextIncompleteMark(updatedCurUserMarks)
|
||||
console.log('next mark: ', nextMark)
|
||||
if (!nextMark) {
|
||||
setCurrentUserMark(null)
|
||||
setIsMarksCompleted(true)
|
||||
} else {
|
||||
setCurrentUserMark(nextMark)
|
||||
setIsMarksCompleted(false)
|
||||
}
|
||||
}
|
||||
|
||||
const findNextIncompleteMark = (usersMarks: CurrentUserMark[]): CurrentUserMark | undefined => {
|
||||
return usersMarks.find(mark => !mark.isCompleted);
|
||||
}
|
||||
// const handleChange = (event: any) => setCurrentMarkValue(event.target.value);
|
||||
//
|
||||
// const handleSubmit = (event: any) => {
|
||||
// event.preventDefault();
|
||||
// if (!currentMarkValue || !currentUserMark) return;
|
||||
//
|
||||
// const curMark: Mark = {
|
||||
// ...currentUserMark.mark,
|
||||
// value: currentMarkValue
|
||||
// };
|
||||
//
|
||||
// const updatedMarks: Mark[] = updateMarks(marks, curMark)
|
||||
//
|
||||
// setMarks(updatedMarks)
|
||||
// setCurrentMarkValue("")
|
||||
//
|
||||
// // do the similar thing to the thing above
|
||||
// const metaMarks = filterMarksByPubkey(updatedMarks, usersPubkey!)
|
||||
// const signedMarks = extractMarksFromSignedMeta(meta!)
|
||||
// const currentUserMarks = getCurrentUserMarks(metaMarks, signedMarks)
|
||||
// setCurrentUserMarks(currentUserMarks)
|
||||
// setCurrentUserMark(findNextCurrentUserMark(currentUserMarks) || null)
|
||||
// setIsReadyToSign(isCurrentUserMarksComplete(currentUserMarks))
|
||||
// }
|
||||
|
||||
// Update the meta signatures
|
||||
const updateMetaSignatures = (meta: Meta, signedEvent: SignedEvent): Meta => {
|
||||
@ -599,7 +584,6 @@ export const SignPage = () => {
|
||||
[hexToNpub(signedEvent.pubkey)]: JSON.stringify(signedEvent, null, 2)
|
||||
}
|
||||
metaCopy.modifiedAt = now()
|
||||
console.log('meta copy: ', metaCopy);
|
||||
return metaCopy
|
||||
}
|
||||
|
||||
@ -724,7 +708,6 @@ export const SignPage = () => {
|
||||
await Promise.all(promises)
|
||||
.then(() => {
|
||||
toast.success('Notifications sent successfully')
|
||||
console.log('meta: ', meta);
|
||||
setMeta(meta)
|
||||
})
|
||||
.catch(() => {
|
||||
@ -816,25 +799,6 @@ export const SignPage = () => {
|
||||
navigate(appPublicRoutes.verify)
|
||||
}
|
||||
|
||||
const getCurrentUserMarks = (marks: Mark[], pubkey: string): CurrentUserMark[] => {
|
||||
console.log('marks: ', marks);
|
||||
|
||||
const filteredMarks = marks
|
||||
.filter(mark => mark.npub === hexToNpub(pubkey))
|
||||
const currentMarks = filteredMarks
|
||||
.map((mark, index, arr) => {
|
||||
return {
|
||||
mark,
|
||||
isLast: isLast(index, arr),
|
||||
isCompleted: !!mark.value
|
||||
}
|
||||
})
|
||||
console.log('current marks: ', currentMarks)
|
||||
return currentMarks;
|
||||
}
|
||||
|
||||
const isLast = (index: number, arr: any[]) => (index === (arr.length -1))
|
||||
|
||||
const handleExportSigit = async () => {
|
||||
if (Object.entries(files).length === 0 || !meta) return
|
||||
|
||||
@ -925,105 +889,111 @@ export const SignPage = () => {
|
||||
return <LoadingSpinner desc={loadingSpinnerDesc} />
|
||||
}
|
||||
|
||||
if (!isMarksCompleted) {
|
||||
if (isReadyToSign) {
|
||||
return (
|
||||
<>
|
||||
<Box className={styles.container}>
|
||||
{
|
||||
marks.length > 0 && (
|
||||
<PdfView
|
||||
files={files}
|
||||
marks={marks}
|
||||
fileHashes={currentFileHashes}
|
||||
handleMarkClick={handleMarkClick}
|
||||
currentMarkValue={currentMarkValue}
|
||||
currentUserMark={currentUserMark}
|
||||
/>)}
|
||||
{
|
||||
currentUserMark !== null && (
|
||||
<MarkFormField
|
||||
handleSubmit={handleSubmit}
|
||||
handleChange={handleChange}
|
||||
currentMark={currentUserMark}
|
||||
currentMarkValue={currentMarkValue}
|
||||
/>
|
||||
{displayInput && (
|
||||
<>
|
||||
<Typography component="label" variant="h6">
|
||||
Select sigit file
|
||||
</Typography>
|
||||
|
||||
<Box className={styles.inputBlock}>
|
||||
<MuiFileInput
|
||||
placeholder="Select file"
|
||||
inputProps={{ accept: '.sigit.zip' }}
|
||||
value={selectedFile}
|
||||
onChange={(value) => setSelectedFile(value)}
|
||||
/>
|
||||
</Box>
|
||||
|
||||
{selectedFile && (
|
||||
<Box sx={{ mt: 2, display: 'flex', justifyContent: 'center' }}>
|
||||
<Button onClick={handleDecrypt} variant="contained">
|
||||
Decrypt
|
||||
</Button>
|
||||
</Box>
|
||||
)}
|
||||
</>
|
||||
)}
|
||||
|
||||
{submittedBy && Object.entries(files).length > 0 && meta && (
|
||||
<>
|
||||
<DisplayMeta
|
||||
meta={meta}
|
||||
files={files}
|
||||
submittedBy={submittedBy}
|
||||
signers={signers}
|
||||
viewers={viewers}
|
||||
creatorFileHashes={creatorFileHashes}
|
||||
currentFileHashes={currentFileHashes}
|
||||
signedBy={signedBy}
|
||||
nextSigner={nextSinger}
|
||||
getPrevSignersSig={getPrevSignersSig}
|
||||
/>
|
||||
|
||||
{signedStatus === SignedStatus.Fully_Signed && (
|
||||
<Box sx={{ mt: 1, display: 'flex', justifyContent: 'center' }}>
|
||||
<Button onClick={handleExport} variant="contained">
|
||||
Export
|
||||
</Button>
|
||||
</Box>
|
||||
)}
|
||||
|
||||
{signedStatus === SignedStatus.User_Is_Next_Signer && (
|
||||
<Box sx={{ mt: 1, display: 'flex', justifyContent: 'center' }}>
|
||||
<Button onClick={handleSign} variant="contained">
|
||||
Sign
|
||||
</Button>
|
||||
</Box>
|
||||
)}
|
||||
|
||||
{isSignerOrCreator && (
|
||||
<Box sx={{ mt: 1, display: 'flex', justifyContent: 'center' }}>
|
||||
<Button onClick={handleExportSigit} variant="contained">
|
||||
Export Sigit
|
||||
</Button>
|
||||
</Box>
|
||||
)}
|
||||
</>
|
||||
)}
|
||||
</Box>
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
)}
|
||||
return <PdfMarking
|
||||
files={getFilesWithHashes(files, currentFileHashes)}
|
||||
currentUserMarks={currentUserMarks}
|
||||
setIsReadyToSign={setIsReadyToSign}
|
||||
setCurrentUserMarks={setCurrentUserMarks}
|
||||
setUpdatedMarks={setUpdatedMarks}
|
||||
/>
|
||||
|
||||
return (
|
||||
<>
|
||||
<Box className={styles.container}>
|
||||
{displayInput && (
|
||||
<>
|
||||
<Typography component="label" variant="h6">
|
||||
Select sigit file
|
||||
</Typography>
|
||||
|
||||
<Box className={styles.inputBlock}>
|
||||
<MuiFileInput
|
||||
placeholder="Select file"
|
||||
inputProps={{ accept: '.sigit.zip' }}
|
||||
value={selectedFile}
|
||||
onChange={(value) => setSelectedFile(value)}
|
||||
/>
|
||||
</Box>
|
||||
|
||||
{selectedFile && (
|
||||
<Box sx={{ mt: 2, display: 'flex', justifyContent: 'center' }}>
|
||||
<Button onClick={handleDecrypt} variant="contained">
|
||||
Decrypt
|
||||
</Button>
|
||||
</Box>
|
||||
)}
|
||||
</>
|
||||
)}
|
||||
|
||||
{submittedBy && Object.entries(files).length > 0 && meta && (
|
||||
<>
|
||||
<DisplayMeta
|
||||
meta={meta}
|
||||
files={files}
|
||||
submittedBy={submittedBy}
|
||||
signers={signers}
|
||||
viewers={viewers}
|
||||
creatorFileHashes={creatorFileHashes}
|
||||
currentFileHashes={currentFileHashes}
|
||||
signedBy={signedBy}
|
||||
nextSigner={nextSinger}
|
||||
getPrevSignersSig={getPrevSignersSig}
|
||||
/>
|
||||
|
||||
{signedStatus === SignedStatus.Fully_Signed && (
|
||||
<Box sx={{ mt: 1, display: 'flex', justifyContent: 'center' }}>
|
||||
<Button onClick={handleExport} variant="contained">
|
||||
Export
|
||||
</Button>
|
||||
</Box>
|
||||
)}
|
||||
|
||||
{signedStatus === SignedStatus.User_Is_Next_Signer && (
|
||||
<Box sx={{ mt: 1, display: 'flex', justifyContent: 'center' }}>
|
||||
<Button onClick={handleSign} variant="contained">
|
||||
Sign
|
||||
</Button>
|
||||
</Box>
|
||||
)}
|
||||
|
||||
{isSignerOrCreator && (
|
||||
<Box sx={{ mt: 1, display: 'flex', justifyContent: 'center' }}>
|
||||
<Button onClick={handleExportSigit} variant="contained">
|
||||
Export Sigit
|
||||
</Button>
|
||||
</Box>
|
||||
)}
|
||||
</>
|
||||
)}
|
||||
|
||||
|
||||
</Box>
|
||||
</>
|
||||
)
|
||||
// return (
|
||||
// <>
|
||||
// <Box className={styles.container}>
|
||||
// {
|
||||
// marks.length > 0 && (
|
||||
// <PdfView
|
||||
// files={files}
|
||||
// marks={marks}
|
||||
// fileHashes={currentFileHashes}
|
||||
// handleMarkClick={handleMarkClick}
|
||||
// currentMarkValue={currentMarkValue}
|
||||
// currentUserMark={currentUserMark}
|
||||
// />)}
|
||||
// {
|
||||
// currentUserMark !== null && (
|
||||
// <MarkFormField
|
||||
// handleSubmit={handleSubmit}
|
||||
// handleChange={handleChange}
|
||||
// currentMark={currentUserMark}
|
||||
// currentMarkValue={currentMarkValue}
|
||||
// />
|
||||
// )}
|
||||
// </Box>
|
||||
// </>
|
||||
// )
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user