diff --git a/src/entries/Background/db.ts b/src/entries/Background/db.ts index 093bc719..2ca5800e 100644 --- a/src/entries/Background/db.ts +++ b/src/entries/Background/db.ts @@ -204,3 +204,21 @@ export async function removePluginConfig( return existing; } + +export async function setNotaryRequestCid( + id: string, + cid: string, +): Promise { + const existing = await historyDb.get(id); + + if (!existing) return null; + + const newReq = { + ...existing, + cid, + }; + + await historyDb.put(id, newReq); + + return newReq; +} diff --git a/src/entries/Background/rpc.ts b/src/entries/Background/rpc.ts index 2f7c31b7..97564a4f 100644 --- a/src/entries/Background/rpc.ts +++ b/src/entries/Background/rpc.ts @@ -108,6 +108,7 @@ export type RequestHistory = { }; secretHeaders?: string[]; secretResps?: string[]; + cid?: string; }; export const initRPC = () => { diff --git a/src/pages/History/index.tsx b/src/pages/History/index.tsx index 03740641..89b46a2d 100644 --- a/src/pages/History/index.tsx +++ b/src/pages/History/index.tsx @@ -1,4 +1,4 @@ -import React, { ReactElement, useState, useCallback } from 'react'; +import React, { ReactElement, useState, useCallback, useEffect } from 'react'; import { useDispatch } from 'react-redux'; import { useNavigate } from 'react-router'; import { @@ -20,6 +20,10 @@ import Modal, { ModalContent } from '../../components/Modal/Modal'; import classNames from 'classnames'; import copy from 'copy-to-clipboard'; import { EXPLORER_API } from '../../utils/constants'; +import { + getNotaryRequest, + setNotaryRequestCid, +} from '../../entries/Background/db'; export default function History(): ReactElement { const history = useHistoryOrder(); @@ -40,12 +44,26 @@ function OneRequestHistory(props: { requestId: string }): ReactElement { const [uploadError, setUploadError] = useState(''); const [showingShareConfirmation, setShowingShareConfirmation] = useState(false); - const [cid, setCid] = useState(''); + const [cid, setCid] = useState<{ [key: string]: string }>({}); const [uploading, setUploading] = useState(false); const navigate = useNavigate(); const { status } = request || {}; const requestUrl = urlify(request?.url || ''); + useEffect(() => { + const fetchData = async () => { + try { + const request = await getNotaryRequest(props.requestId); + if (request && request.cid) { + setCid({ [props.requestId]: request.cid }); + } + } catch (e) { + console.error('Error fetching data', e); + } + }; + fetchData(); + }, []); + const onRetry = useCallback(async () => { const notaryUrl = await getNotaryApi(); const websocketProxyUrl = await getProxyApi(); @@ -87,13 +105,14 @@ function OneRequestHistory(props: { requestId: string }): ReactElement { `${request?.id}.json`, JSON.stringify(request?.proof), ); - setCid(data); + setCid((prevCid) => ({ ...prevCid, [props.requestId]: data })); + await setNotaryRequestCid(props.requestId, data); } catch (e: any) { setUploadError(e.message); } finally { setUploading(false); } - }, []); + }, [props.requestId, request, cid]); return (
@@ -221,7 +240,7 @@ function OneRequestHistory(props: { requestId: string }): ReactElement { onClose={closeAllModal} > - {!cid ? ( + {!cid[props.requestId] ? (

{uploadError || 'This will make your proof publicly accessible by anyone with the CID'} @@ -230,13 +249,13 @@ function OneRequestHistory(props: { requestId: string }): ReactElement { e.target.select()} /> )}

- {!cid ? ( + {!cid[props.requestId] ? ( <> {!uploadError && (