diff --git a/src/pages/sign/index.tsx b/src/pages/sign/index.tsx index 8eb782e..aa5bf74 100644 --- a/src/pages/sign/index.tsx +++ b/src/pages/sign/index.tsx @@ -3,7 +3,7 @@ import saveAs from 'file-saver' import JSZip from 'jszip' import _ from 'lodash' import { Event, verifyEvent } from 'nostr-tools' -import { useCallback, useEffect, useState } from 'react' +import { useCallback, useEffect, useMemo, useState } from 'react' import { useAppSelector } from '../../hooks' import { useLocation, useNavigate, useParams } from 'react-router-dom' import { toast } from 'react-toastify' @@ -58,36 +58,37 @@ export const SignPage = () => { const usersAppData = useAppSelector((state) => state.userAppData) + /** + * In the online mode, Sigit ID can be obtained either from the router state + * using location or from UsersAppData + */ + const metaInNavState = useMemo(() => { + if (usersAppData) { + const sigitCreateId = params.id + + if (sigitCreateId) { + const sigit = usersAppData.sigits[sigitCreateId] + + if (sigit) { + return sigit + } + } + } + + return location?.state?.meta || undefined + }, [location, usersAppData, params.id]) + /** * Received from `location.state` * * uploadedZip will be received from home page when a user uploads a sigit zip wrapper that contains keys.json * arrayBuffer (decryptedArrayBuffer) will be received in navigation from create page in offline mode - * meta (metaInNavState) will be received in navigation from create & home page in online mode */ - let metaInNavState = location?.state?.meta || undefined const { arrayBuffer: decryptedArrayBuffer, uploadedZip } = location.state || { decryptedArrayBuffer: undefined, uploadedZip: undefined } - /** - * If userAppData (redux) is available, and we have the route param (sigit id) - * which is actually a `createEventId`, we will fetch a `sigit` - * based on the provided route ID and set fetched `sigit` to the `metaInNavState` - */ - if (usersAppData) { - const sigitCreateId = params.id - - if (sigitCreateId) { - const sigit = usersAppData.sigits[sigitCreateId] - - if (sigit) { - metaInNavState = sigit - } - } - } - const [files, setFiles] = useState<{ [filename: string]: SigitFile }>({}) const [isLoading, setIsLoading] = useState(true) @@ -275,7 +276,6 @@ export const SignPage = () => { ) useEffect(() => { - // online mode - from create and home page views if (metaInNavState) { const processSigit = async () => { setIsLoading(true) @@ -310,7 +310,15 @@ export const SignPage = () => { } processSigit() - } else if (decryptedArrayBuffer) { + } + + // eslint-disable-next-line react-hooks/exhaustive-deps + }, []) + + useEffect(() => { + // online mode - from create and home page views + + if (decryptedArrayBuffer) { handleDecryptedArrayBuffer(decryptedArrayBuffer).finally(() => setIsLoading(false) ) @@ -329,7 +337,7 @@ export const SignPage = () => { } else { setIsLoading(false) } - }, [decryptedArrayBuffer, uploadedZip, metaInNavState, decrypt]) + }, [decryptedArrayBuffer, uploadedZip, decrypt]) const handleArrayBufferFromBlossom = async ( arrayBuffer: ArrayBuffer,