feat: add error handling to prover (#42)

This commit is contained in:
tsukino
2024-02-06 09:09:56 -05:00
committed by GitHub
parent c8f2b541d6
commit 1da4f45564
6 changed files with 85 additions and 44 deletions

28
package-lock.json generated
View File

@@ -1,12 +1,12 @@
{
"name": "tlsn-extension",
"version": "0.0.1",
"version": "0.1.0.3",
"lockfileVersion": 2,
"requires": true,
"packages": {
"": {
"name": "tlsn-extension",
"version": "0.0.1",
"version": "0.1.0.3",
"license": "MIT",
"dependencies": {
"@fortawesome/fontawesome-free": "^6.4.2",
@@ -28,7 +28,7 @@
"redux-logger": "^3.0.6",
"redux-thunk": "^2.4.2",
"tailwindcss": "^3.3.3",
"tlsn-js": "^0.0.2"
"tlsn-js": "0.1.0-alpha.3"
},
"devDependencies": {
"@babel/core": "^7.20.12",
@@ -73,7 +73,6 @@
"style-loader": "^3.3.1",
"terser-webpack-plugin": "^5.3.6",
"ts-loader": "^9.4.2",
"ttlcache": "@types/@isaacs/ttlcache",
"type-fest": "^3.5.2",
"typescript": "^4.9.4",
"webextension-polyfill": "^0.10.0",
@@ -84,7 +83,7 @@
}
},
"@types/@isaacs/ttlcache": {
"dev": true
"extraneous": true
},
"node_modules/@aashutoshrathi/word-wrap": {
"version": "1.2.6",
@@ -12658,9 +12657,9 @@
}
},
"node_modules/tlsn-js": {
"version": "0.0.2",
"resolved": "https://registry.npmjs.org/tlsn-js/-/tlsn-js-0.0.2.tgz",
"integrity": "sha512-/Tdv9B4nfUmwhhN7Qt66sWymmVeKVkAy1GXQcsCITyiacZdVgTYa1WKLyLRvcHQWVQThJJ1KDuPlT5yC+UKWVA==",
"version": "0.1.0-alpha.3",
"resolved": "https://registry.npmjs.org/tlsn-js/-/tlsn-js-0.1.0-alpha.3.tgz",
"integrity": "sha512-P26JOq50UOeQgjznH/M5E4B2lHBuSHd36jvHly/c2mNt5N3TsH0Dmhk16Ll7t/Dt62YdVcYOEvg/GVA3Xdkh0A==",
"dependencies": {
"comlink": "^4.4.1"
},
@@ -12875,10 +12874,6 @@
"integrity": "sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg==",
"dev": true
},
"node_modules/ttlcache": {
"resolved": "@types/@isaacs/ttlcache",
"link": true
},
"node_modules/type-check": {
"version": "0.4.0",
"resolved": "https://registry.npmjs.org/type-check/-/type-check-0.4.0.tgz",
@@ -22298,9 +22293,9 @@
"dev": true
},
"tlsn-js": {
"version": "0.0.2",
"resolved": "https://registry.npmjs.org/tlsn-js/-/tlsn-js-0.0.2.tgz",
"integrity": "sha512-/Tdv9B4nfUmwhhN7Qt66sWymmVeKVkAy1GXQcsCITyiacZdVgTYa1WKLyLRvcHQWVQThJJ1KDuPlT5yC+UKWVA==",
"version": "0.1.0-alpha.3",
"resolved": "https://registry.npmjs.org/tlsn-js/-/tlsn-js-0.1.0-alpha.3.tgz",
"integrity": "sha512-P26JOq50UOeQgjznH/M5E4B2lHBuSHd36jvHly/c2mNt5N3TsH0Dmhk16Ll7t/Dt62YdVcYOEvg/GVA3Xdkh0A==",
"requires": {
"comlink": "^4.4.1"
}
@@ -22463,9 +22458,6 @@
}
}
},
"ttlcache": {
"version": "file:@types/@isaacs/ttlcache"
},
"type-check": {
"version": "0.4.0",
"resolved": "https://registry.npmjs.org/type-check/-/type-check-0.4.0.tgz",

View File

@@ -35,7 +35,7 @@
"redux-logger": "^3.0.6",
"redux-thunk": "^2.4.2",
"tailwindcss": "^3.3.3",
"tlsn-js": "0.1.0-alpha.3-rc1"
"tlsn-js": "0.1.0-alpha.3"
},
"devDependencies": {
"@babel/core": "^7.20.12",
@@ -88,4 +88,4 @@
"webpack-dev-server": "^4.11.1",
"zip-webpack-plugin": "^4.0.1"
}
}
}

View File

@@ -177,10 +177,19 @@ async function handleRetryProveReqest(
) {
const { id, notaryUrl, websocketProxyUrl } = request.data;
await setNotaryRequestError(id, null);
await setNotaryRequestStatus(id, 'pending');
const req = await getNotaryRequest(id);
await browser.runtime.sendMessage({
type: BackgroundActiontype.push_action,
data: {
tabId: 'background',
},
action: addRequestHistory(req),
});
await browser.runtime.sendMessage({
type: BackgroundActiontype.process_prove_request,
data: {

View File

@@ -45,6 +45,8 @@ const Offscreen = () => {
},
});
} catch (error) {
console.log('i caught an error');
console.error(error);
browser.runtime.sendMessage({
type: BackgroundActiontype.finish_prove_request,
data: {

View File

@@ -10,6 +10,11 @@ import Icon from '../../components/Icon';
import { get, NOTARY_API_LS_KEY, PROXY_API_LS_KEY } from '../../utils/storage';
import { urlify, download } from '../../utils/misc';
import { BackgroundActiontype } from '../../entries/Background/rpc';
import Modal, {
ModalContent,
ModalFooter,
ModalHeader,
} from '../../components/Modal/Modal';
export default function History(): ReactElement {
const history = useHistoryOrder();
@@ -26,6 +31,7 @@ export default function History(): ReactElement {
function OneRequestHistory(props: { requestId: string }): ReactElement {
const dispatch = useDispatch();
const request = useRequestHistory(props.requestId);
const [showingError, showError] = useState(false);
const navigate = useNavigate();
const { status } = request || {};
const requestUrl = urlify(request?.url || '');
@@ -55,8 +61,50 @@ function OneRequestHistory(props: { requestId: string }): ReactElement {
dispatch(deleteRequestHistory(props.requestId));
}, [props.requestId]);
const onShowError = useCallback(async () => {
showError(true);
}, [request?.error, showError]);
const closeModal = useCallback(() => showError(false), [showError]);
const RetryButton = (): ReactElement => (
<button
className="flex flex-row flex-grow-0 gap-2 self-end items-center justify-end px-2 py-1 bg-slate-100 text-slate-300 hover:bg-slate-200 hover:text-slate-500 hover:font-bold"
onClick={onRetry}
>
<Icon fa="fa-solid fa-arrows-rotate" size={1} />
<span className="text-xs font-bold">Retry</span>
</button>
);
const ErrorButton = (): ReactElement => (
<button
className="flex flex-row flex-grow-0 gap-2 self-end items-center justify-end px-2 py-1 bg-red-100 text-red-300 hover:bg-red-200 hover:text-red-500 hover:font-bold"
onClick={onShowError}
>
<Icon fa="fa-solid fa-circle-exclamation" size={1} />
<span className="text-xs font-bold">Error</span>
</button>
);
return (
<div className="flex flex-row flex-nowrap border rounded-md p-2 gap-1 hover:bg-slate-50 cursor-pointer">
{showingError && (
<Modal
className="flex flex-col gap-4 items-center text-base cursor-default justify-center !w-auto mx-4 my-[50%] min-h-24 p-4 border border-red-500"
onClose={closeModal}
>
<ModalContent className="flex justify-center items-center text-slate-500">
{request?.error || 'Something went wrong :('}
</ModalContent>
<button
className="m-0 w-24 bg-red-100 text-red-300 hover:bg-red-200 hover:text-red-500"
onClick={closeModal}
>
OK
</button>
</Modal>
)}
<div className="flex flex-col flex-nowrap flex-grow flex-shrink w-0">
<div className="flex flex-row items-center text-xs">
<div className="bg-slate-200 text-slate-400 px-1 py-0.5 rounded-sm">
@@ -84,14 +132,14 @@ function OneRequestHistory(props: { requestId: string }): ReactElement {
<div className="flex flex-col gap-1">
{status === 'success' && (
<>
<div
<button
className="flex flex-row flex-grow-0 gap-2 self-end items-center justify-end px-2 py-1 bg-slate-600 text-slate-200 hover:bg-slate-500 hover:text-slate-100 hover:font-bold"
onClick={onView}
>
<Icon className="" fa="fa-solid fa-receipt" size={1} />
<span className="text-xs font-bold">View Proof</span>
</div>
<div
</button>
<button
className="flex flex-row flex-grow-0 gap-2 self-end items-center justify-end px-2 py-1 bg-slate-100 text-slate-300 hover:bg-slate-200 hover:text-slate-500 hover:font-bold"
onClick={() =>
download(`${request?.id}.json`, JSON.stringify(request?.proof))
@@ -99,31 +147,24 @@ function OneRequestHistory(props: { requestId: string }): ReactElement {
>
<Icon className="" fa="fa-solid fa-download" size={1} />
<span className="text-xs font-bold">Download</span>
</div>
</button>
</>
)}
{(!status || status === 'error') && (
<div
className="flex flex-row flex-grow-0 gap-2 self-end items-center justify-end px-2 py-1 bg-slate-100 text-slate-300 hover:bg-slate-200 hover:text-slate-500 hover:font-bold"
onClick={onRetry}
>
<Icon fa="fa-solid fa-arrows-rotate" size={1} />
<span className="text-xs font-bold">Retry</span>
</div>
)}
{status === 'error' && !!request?.error && <ErrorButton />}
{(!status || status === 'error') && <RetryButton />}
{status === 'pending' && (
<div className="flex flex-row flex-grow-0 gap-2 self-end items-center justify-end px-2 py-1 bg-slate-100 text-slate-300 font-bold">
<button className="flex flex-row flex-grow-0 gap-2 self-end items-center justify-end px-2 py-1 bg-slate-100 text-slate-300 font-bold">
<Icon className="animate-spin" fa="fa-solid fa-spinner" size={1} />
<span className="text-xs font-bold">Pending</span>
</div>
</button>
)}
<div
<button
className="flex flex-row flex-grow-0 gap-2 self-end items-center justify-end px-2 py-1 bg-slate-100 text-slate-300 hover:bg-red-100 hover:text-red-500 hover:font-bold"
onClick={onDelete}
>
<Icon className="" fa="fa-solid fa-trash" size={1} />
<span className="text-xs font-bold">Delete</span>
</div>
</button>
</div>
</div>
);

View File

@@ -6745,10 +6745,10 @@
"resolved" "https://registry.npmjs.org/titleize/-/titleize-3.0.0.tgz"
"version" "3.0.0"
"tlsn-js@^0.0.2":
"integrity" "sha512-/Tdv9B4nfUmwhhN7Qt66sWymmVeKVkAy1GXQcsCITyiacZdVgTYa1WKLyLRvcHQWVQThJJ1KDuPlT5yC+UKWVA=="
"resolved" "https://registry.npmjs.org/tlsn-js/-/tlsn-js-0.0.2.tgz"
"version" "0.0.2"
"tlsn-js@0.1.0-alpha.3":
"integrity" "sha512-P26JOq50UOeQgjznH/M5E4B2lHBuSHd36jvHly/c2mNt5N3TsH0Dmhk16Ll7t/Dt62YdVcYOEvg/GVA3Xdkh0A=="
"resolved" "https://registry.npmjs.org/tlsn-js/-/tlsn-js-0.1.0-alpha.3.tgz"
"version" "0.1.0-alpha.3"
dependencies:
"comlink" "^4.4.1"
@@ -6812,9 +6812,6 @@
dependencies:
"tslib" "^1.8.1"
"ttlcache@@types/@isaacs/ttlcache":
"resolved" "file:@types/@isaacs/ttlcache"
"type-check@^0.4.0", "type-check@~0.4.0":
"integrity" "sha512-XleUoc9uwGXqjWwXaUTZAmzMcFZ5858QA2vvx1Ur5xIcixXIP+8LnFDgRplU30us6teqdlskFfu+ae4K79Ooew=="
"resolved" "https://registry.npmjs.org/type-check/-/type-check-0.4.0.tgz"