feat: Add Sigit ID as a path param
All checks were successful
Open PR on Staging / audit_and_check (pull_request) Successful in 33s

This commit is contained in:
Stixx 2024-09-10 16:00:48 +02:00
parent e2b3dc13fb
commit 75a715d002
4 changed files with 54 additions and 8 deletions

View File

@ -24,11 +24,12 @@ import { useSigitMeta } from '../../hooks/useSigitMeta'
import { extractFileExtensions } from '../../utils/file' import { extractFileExtensions } from '../../utils/file'
type SigitProps = { type SigitProps = {
sigitKey: string
meta: Meta meta: Meta
parsedMeta: SigitCardDisplayInfo parsedMeta: SigitCardDisplayInfo
} }
export const DisplaySigit = ({ meta, parsedMeta }: SigitProps) => { export const DisplaySigit = ({ meta, parsedMeta, sigitKey }: SigitProps) => {
const { title, createdAt, submittedBy, signers, signedStatus, isValid } = const { title, createdAt, submittedBy, signers, signedStatus, isValid } =
parsedMeta parsedMeta
@ -47,7 +48,7 @@ export const DisplaySigit = ({ meta, parsedMeta }: SigitProps) => {
to={ to={
signedStatus === SigitStatus.Complete signedStatus === SigitStatus.Complete
? appPublicRoutes.verify ? appPublicRoutes.verify
: appPrivateRoutes.sign : `${appPrivateRoutes.sign}/${sigitKey}`
} }
state={{ meta }} state={{ meta }}
className={styles.insetLink} className={styles.insetLink}

View File

@ -257,6 +257,7 @@ export const HomePage = () => {
.map((key) => ( .map((key) => (
<DisplaySigit <DisplaySigit
key={`sigit-${key}`} key={`sigit-${key}`}
sigitKey={key}
parsedMeta={parsedSigits[key]} parsedMeta={parsedSigits[key]}
meta={sigits[key]} meta={sigits[key]}
/> />

View File

@ -7,7 +7,7 @@ import { MuiFileInput } from 'mui-file-input'
import { Event, verifyEvent } from 'nostr-tools' import { Event, verifyEvent } from 'nostr-tools'
import { useCallback, useEffect, useState } from 'react' import { useCallback, useEffect, useState } from 'react'
import { useSelector } from 'react-redux' import { useSelector } from 'react-redux'
import { useLocation, useNavigate } from 'react-router-dom' import { useLocation, useNavigate, useParams } from 'react-router-dom'
import { toast } from 'react-toastify' import { toast } from 'react-toastify'
import { LoadingSpinner } from '../../components/LoadingSpinner' import { LoadingSpinner } from '../../components/LoadingSpinner'
import { NostrController } from '../../controllers' import { NostrController } from '../../controllers'
@ -53,6 +53,7 @@ import {
SigitFile SigitFile
} from '../../utils/file.ts' } from '../../utils/file.ts'
import { ARRAY_BUFFER, DEFLATE } from '../../utils/const.ts' import { ARRAY_BUFFER, DEFLATE } from '../../utils/const.ts'
import { useAppSelector } from '../../hooks/store.ts'
enum SignedStatus { enum SignedStatus {
Fully_Signed, Fully_Signed,
User_Is_Next_Signer, User_Is_Next_Signer,
@ -62,17 +63,20 @@ enum SignedStatus {
export const SignPage = () => { export const SignPage = () => {
const navigate = useNavigate() const navigate = useNavigate()
const location = useLocation() const location = useLocation()
const params = useParams()
/** /**
* Received from `location.state`
*
* uploadedZip will be received from home page when a user uploads a sigit zip wrapper that contains keys.json * uploadedZip will be received from home page when a user uploads a sigit zip wrapper that contains keys.json
* arrayBuffer will be received in navigation from create page in offline mode * arrayBuffer will be received in navigation from create page in offline mode
* meta will be received in navigation from create & home page in online mode * meta will be received in navigation from create & home page in online mode
*/ */
const { const [metaInNavState, setMetaInNavState] = useState<Meta | undefined>()
meta: metaInNavState, const [decryptedArrayBuffer, setDecryptedArrayBuffer] = useState<
arrayBuffer: decryptedArrayBuffer, ArrayBuffer | undefined
uploadedZip >()
} = location.state || {} const [uploadedZip, setUploadedZip] = useState<File | undefined>()
const [displayInput, setDisplayInput] = useState(false) const [displayInput, setDisplayInput] = useState(false)
@ -115,6 +119,41 @@ export const SignPage = () => {
const [isMarksCompleted, setIsMarksCompleted] = useState(false) const [isMarksCompleted, setIsMarksCompleted] = useState(false)
const [otherUserMarks, setOtherUserMarks] = useState<Mark[]>([]) const [otherUserMarks, setOtherUserMarks] = useState<Mark[]>([])
const usersAppData = useAppSelector((state) => state.userAppData)
/**
* When location state changes, update the states in the component
* If sigit id is found in the URL PARAM we will set metaInNavState manually
* after we do the fetching based on the ID
*/
useEffect(() => {
if (location.state) {
const { meta, arrayBuffer, uploadedZip } = location.state
setMetaInNavState(meta)
setDecryptedArrayBuffer(arrayBuffer)
setUploadedZip(uploadedZip)
}
}, [location.state])
useEffect(() => {
// If meta in nav state is populated we will not try to fetch sigit details
// from the redux store
if (metaInNavState) return
if (usersAppData) {
const sigitId = params.id
if (sigitId) {
const sigit = usersAppData.sigits[sigitId]
if (sigit) {
setMetaInNavState(sigit)
}
}
}
}, [usersAppData, metaInNavState, params.id])
useEffect(() => { useEffect(() => {
if (signers.length > 0) { if (signers.length > 0) {
// check if all signers have signed then its fully signed // check if all signers have signed then its fully signed

View File

@ -19,6 +19,7 @@ export const appPrivateRoutes = {
homePage: '/', homePage: '/',
create: '/create', create: '/create',
sign: '/sign', sign: '/sign',
signId: '/sign/:id',
settings: '/settings', settings: '/settings',
profileSettings: '/settings/profile/:npub', profileSettings: '/settings/profile/:npub',
cacheSettings: '/settings/cache', cacheSettings: '/settings/cache',
@ -132,6 +133,10 @@ export const privateRoutes = [
path: appPrivateRoutes.sign, path: appPrivateRoutes.sign,
element: <SignPage /> element: <SignPage />
}, },
{
path: appPrivateRoutes.signId,
element: <SignPage />
},
{ {
path: appPrivateRoutes.settings, path: appPrivateRoutes.settings,
element: <SettingsPage /> element: <SettingsPage />