From aefafea2101726849fa9c17eac3cad7bdd6ecec6 Mon Sep 17 00:00:00 2001 From: Harman-singh-waraich Date: Fri, 29 Nov 2024 11:39:14 +0530 Subject: [PATCH 1/6] chore(web): function-to-parse-wagmi-simulate-error --- .../StakePanel/StakeWithdrawButton.tsx | 7 ++++--- .../NavigationButtons/SubmitDisputeButton.tsx | 6 +++--- web/src/utils/parseWagmiError.ts | 17 +++++++++++++++++ 3 files changed, 24 insertions(+), 6 deletions(-) create mode 100644 web/src/utils/parseWagmiError.ts diff --git a/web/src/pages/Courts/CourtDetails/StakePanel/StakeWithdrawButton.tsx b/web/src/pages/Courts/CourtDetails/StakePanel/StakeWithdrawButton.tsx index 54bb6140f..3a0d1942c 100644 --- a/web/src/pages/Courts/CourtDetails/StakePanel/StakeWithdrawButton.tsx +++ b/web/src/pages/Courts/CourtDetails/StakePanel/StakeWithdrawButton.tsx @@ -1,4 +1,5 @@ import React, { useCallback, useEffect, useMemo } from "react"; +import styled from "styled-components"; import { useParams } from "react-router-dom"; import { useAccount, usePublicClient } from "wagmi"; @@ -19,10 +20,10 @@ import { } from "hooks/contracts/generated"; import { useCourtDetails } from "hooks/queries/useCourtDetails"; import { isUndefined } from "utils/index"; +import { parseWagmiError } from "utils/parseWagmiError"; import { wrapWithToast } from "utils/wrapWithToast"; import { EnsureChain } from "components/EnsureChain"; -import styled from "styled-components"; export enum ActionType { allowance = "allowance", @@ -154,9 +155,9 @@ const StakeWithdrawButton: React.FC = ({ useEffect(() => { if (setStakeError) { - setErrorMsg(setStakeError?.shortMessage ?? setStakeError.message); + setErrorMsg(parseWagmiError(setStakeError)); } - }, [setStakeError]); + }, [setStakeError, setErrorMsg]); const { text, checkDisabled, onClick } = buttonProps[isAllowance ? ActionType.allowance : action]; return ( diff --git a/web/src/pages/Resolver/NavigationButtons/SubmitDisputeButton.tsx b/web/src/pages/Resolver/NavigationButtons/SubmitDisputeButton.tsx index 7938f045b..5db0a357f 100644 --- a/web/src/pages/Resolver/NavigationButtons/SubmitDisputeButton.tsx +++ b/web/src/pages/Resolver/NavigationButtons/SubmitDisputeButton.tsx @@ -14,13 +14,13 @@ import { useSimulateDisputeResolverCreateDisputeForTemplate, } from "hooks/contracts/generated"; import { isUndefined } from "utils/index"; +import { parseWagmiError } from "utils/parseWagmiError"; import { prepareArbitratorExtradata } from "utils/prepareArbitratorExtradata"; import { wrapWithToast } from "utils/wrapWithToast"; import { EnsureChain } from "components/EnsureChain"; -import Popup, { PopupType } from "components/Popup"; - import { ErrorButtonMessage } from "components/ErrorButtonMessage"; +import Popup, { PopupType } from "components/Popup"; import ClosedCircleIcon from "components/StyledIcons/ClosedCircleIcon"; const StyledButton = styled(Button)``; @@ -66,7 +66,7 @@ const SubmitDisputeButton: React.FC = () => { const errorMsg = useMemo(() => { if (insufficientBalance) return "Insufficient balance"; else if (error) { - return error?.shortMessage ?? error.message; + return parseWagmiError(error); } return null; }, [error, insufficientBalance]); diff --git a/web/src/utils/parseWagmiError.ts b/web/src/utils/parseWagmiError.ts new file mode 100644 index 000000000..4242a7857 --- /dev/null +++ b/web/src/utils/parseWagmiError.ts @@ -0,0 +1,17 @@ +import { type SimulateContractErrorType } from "@wagmi/core"; + +type ExtendedWagmiError = SimulateContractErrorType & { shortMessage: string; metaMessages: string[] }; + +/** + * @param error + * @description Tries to extract the human readable error message, otherwise reverts to error.message + * @returns Human readable error if possible + */ +export const parseWagmiError = (error: SimulateContractErrorType) => { + const extError = error as ExtendedWagmiError; + + const metaMessage = extError?.metaMessages?.[0]; + const shortMessage = extError?.shortMessage; + + return metaMessage ?? shortMessage ?? error.message; +}; From 8f0596ee401f2063fdc27a7bafef40b124c79d52 Mon Sep 17 00:00:00 2001 From: Harman-singh-waraich Date: Fri, 29 Nov 2024 11:53:54 +0530 Subject: [PATCH 2/6] refactor(web): extended-wagmi-error-type --- web/src/utils/parseWagmiError.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/web/src/utils/parseWagmiError.ts b/web/src/utils/parseWagmiError.ts index 4242a7857..ffd1ef597 100644 --- a/web/src/utils/parseWagmiError.ts +++ b/web/src/utils/parseWagmiError.ts @@ -1,6 +1,6 @@ import { type SimulateContractErrorType } from "@wagmi/core"; -type ExtendedWagmiError = SimulateContractErrorType & { shortMessage: string; metaMessages: string[] }; +type ExtendedWagmiError = SimulateContractErrorType & { shortMessage?: string; metaMessages?: string[] }; /** * @param error From fb063f63d864d5f2d315524c9c8e32e0ce42be2e Mon Sep 17 00:00:00 2001 From: Harman-singh-waraich Date: Fri, 29 Nov 2024 13:51:13 +0530 Subject: [PATCH 3/6] refactor(web): partial-evidence-search --- web/src/hooks/queries/useEvidences.ts | 5 ++++- web/src/utils/transformSearch.ts | 16 ++++++++++++++++ 2 files changed, 20 insertions(+), 1 deletion(-) create mode 100644 web/src/utils/transformSearch.ts diff --git a/web/src/hooks/queries/useEvidences.ts b/web/src/hooks/queries/useEvidences.ts index 743869619..3123163b9 100644 --- a/web/src/hooks/queries/useEvidences.ts +++ b/web/src/hooks/queries/useEvidences.ts @@ -2,6 +2,7 @@ import { useQuery } from "@tanstack/react-query"; import { REFETCH_INTERVAL } from "consts/index"; import { useGraphqlBatcher } from "context/GraphqlBatcher"; +import { transformSearch } from "utils/transformSearch"; import { graphql } from "src/graphql"; import { EvidenceDetailsFragment, EvidencesQuery } from "src/graphql/graphql"; @@ -45,6 +46,8 @@ export const useEvidences = (evidenceGroup?: string, keywords?: string) => { const { graphqlBatcher } = useGraphqlBatcher(); const document = keywords ? evidenceSearchQuery : evidencesQuery; + const transformedKeywords = transformSearch(keywords); + return useQuery<{ evidences: EvidenceDetailsFragment[] }>({ queryKey: [keywords ? `evidenceSearchQuery${evidenceGroup}-${keywords}` : `evidencesQuery${evidenceGroup}`], enabled: isEnabled, @@ -53,7 +56,7 @@ export const useEvidences = (evidenceGroup?: string, keywords?: string) => { const result = await graphqlBatcher.fetch({ id: crypto.randomUUID(), document: document, - variables: { evidenceGroupID: evidenceGroup?.toString(), keywords: keywords }, + variables: { evidenceGroupID: evidenceGroup?.toString(), keywords: transformedKeywords }, }); return keywords ? { evidences: [...result.evidenceSearch] } : result; diff --git a/web/src/utils/transformSearch.ts b/web/src/utils/transformSearch.ts new file mode 100644 index 000000000..0d1799a6c --- /dev/null +++ b/web/src/utils/transformSearch.ts @@ -0,0 +1,16 @@ +/** + * + * @param searchString + * @returns A search string to better search with fullTextSearch + */ +export const transformSearch = (searchString?: string) => { + if (!searchString) return null; + const words = searchString + .split(/\s+/) + .map((word) => word.trim()) + .filter(Boolean); + + const transformedWords = words.map((word) => `${word} | ${word}:*`); + + return transformedWords.join(" | "); +}; From d88445b0b87ab9eed70c0893ce1f467d300ce1fa Mon Sep 17 00:00:00 2001 From: Harman-singh-waraich Date: Fri, 29 Nov 2024 15:36:05 +0530 Subject: [PATCH 4/6] fix(web): file-viewer-pdf-download-broken --- web/src/components/FileViewer/index.tsx | 23 ++++++++++++++++++++++- 1 file changed, 22 insertions(+), 1 deletion(-) diff --git a/web/src/components/FileViewer/index.tsx b/web/src/components/FileViewer/index.tsx index 74b8438a3..394aa9f99 100644 --- a/web/src/components/FileViewer/index.tsx +++ b/web/src/components/FileViewer/index.tsx @@ -28,7 +28,7 @@ const StyledDocViewer = styled(DocViewer)` * @returns renders the file */ const FileViewer: React.FC<{ url: string }> = ({ url }) => { - const docs = [{ uri: url }]; + const docs = [{ uri: url, fileName: fileNameIfIpfsUrl(url) }]; return ( = ({ url }) => { ); }; +const fileNameIfIpfsUrl = (url: string) => { + if (!url || typeof url !== "string") { + return "document"; + } + + const ipfsPattern = /(?:ipfs:\/\/|https?:\/\/(?:[A-Za-z0-9.-]+)\/ipfs\/)([A-Za-z0-9]+[A-Za-z0-9\-_]*)\/?(.*)/; + + const match = url.match(ipfsPattern); + + if (match) { + const ipfsHash = match[1]; + const path = match[2] || ""; + + const sanitizedPath = path.replace(/\//g, "_"); + + return `ipfs-${ipfsHash}${sanitizedPath ? `_${sanitizedPath}` : ""}`; + } else { + return "document"; + } +}; + export default FileViewer; From e1e44e4e9e45f6e6bc6fcd096912712559064624 Mon Sep 17 00:00:00 2001 From: Harman-singh-waraich Date: Fri, 29 Nov 2024 15:44:45 +0530 Subject: [PATCH 5/6] refactor(web): sonar-feedback --- web/src/components/FileViewer/index.tsx | 5 ++--- 1 file changed, 2 insertions(+), 3 deletions(-) diff --git a/web/src/components/FileViewer/index.tsx b/web/src/components/FileViewer/index.tsx index 394aa9f99..fa67a9bb1 100644 --- a/web/src/components/FileViewer/index.tsx +++ b/web/src/components/FileViewer/index.tsx @@ -54,10 +54,9 @@ const fileNameIfIpfsUrl = (url: string) => { if (!url || typeof url !== "string") { return "document"; } - const ipfsPattern = /(?:ipfs:\/\/|https?:\/\/(?:[A-Za-z0-9.-]+)\/ipfs\/)([A-Za-z0-9]+[A-Za-z0-9\-_]*)\/?(.*)/; - const match = url.match(ipfsPattern); + const match = ipfsPattern.exec(url); if (match) { const ipfsHash = match[1]; @@ -65,7 +64,7 @@ const fileNameIfIpfsUrl = (url: string) => { const sanitizedPath = path.replace(/\//g, "_"); - return `ipfs-${ipfsHash}${sanitizedPath ? `_${sanitizedPath}` : ""}`; + return `ipfs-${ipfsHash}${sanitizedPath ? "_" + sanitizedPath : ""}`; } else { return "document"; } From 5f5771d187b320d662321a0fa23b4d5af885ea83 Mon Sep 17 00:00:00 2001 From: Harman-singh-waraich Date: Fri, 29 Nov 2024 16:51:49 +0530 Subject: [PATCH 6/6] chore: use-parse-wagmi-error-function --- web-devtools/src/utils/parseWagmiError.ts | 17 +++++++++++++++++ web-devtools/src/utils/wrapWithToast.ts | 6 ++++-- web/src/utils/wrapWithToast.ts | 6 ++++-- 3 files changed, 25 insertions(+), 4 deletions(-) create mode 100644 web-devtools/src/utils/parseWagmiError.ts diff --git a/web-devtools/src/utils/parseWagmiError.ts b/web-devtools/src/utils/parseWagmiError.ts new file mode 100644 index 000000000..ffd1ef597 --- /dev/null +++ b/web-devtools/src/utils/parseWagmiError.ts @@ -0,0 +1,17 @@ +import { type SimulateContractErrorType } from "@wagmi/core"; + +type ExtendedWagmiError = SimulateContractErrorType & { shortMessage?: string; metaMessages?: string[] }; + +/** + * @param error + * @description Tries to extract the human readable error message, otherwise reverts to error.message + * @returns Human readable error if possible + */ +export const parseWagmiError = (error: SimulateContractErrorType) => { + const extError = error as ExtendedWagmiError; + + const metaMessage = extError?.metaMessages?.[0]; + const shortMessage = extError?.shortMessage; + + return metaMessage ?? shortMessage ?? error.message; +}; diff --git a/web-devtools/src/utils/wrapWithToast.ts b/web-devtools/src/utils/wrapWithToast.ts index 9e6459061..7405c73c8 100644 --- a/web-devtools/src/utils/wrapWithToast.ts +++ b/web-devtools/src/utils/wrapWithToast.ts @@ -1,6 +1,8 @@ import { toast, ToastPosition, Theme } from "react-toastify"; import { type PublicClient, type TransactionReceipt } from "viem"; +import { parseWagmiError } from "./parseWagmiError"; + export const OPTIONS = { position: "top-center" as ToastPosition, autoClose: 5000, @@ -35,11 +37,11 @@ export async function wrapWithToast( }) ) .catch((error) => { - toast.error(error.shortMessage ?? error.message, OPTIONS); + toast.error(parseWagmiError(error), OPTIONS); return { status: false }; }); } export async function catchShortMessage(promise: Promise) { - return await promise.catch((error) => toast.error(error.shortMessage ?? error.message, OPTIONS)); + return await promise.catch((error) => toast.error(parseWagmiError(error), OPTIONS)); } diff --git a/web/src/utils/wrapWithToast.ts b/web/src/utils/wrapWithToast.ts index 6480e6a58..5d078e688 100644 --- a/web/src/utils/wrapWithToast.ts +++ b/web/src/utils/wrapWithToast.ts @@ -1,6 +1,8 @@ import { toast, ToastPosition, Theme } from "react-toastify"; import { PublicClient, TransactionReceipt } from "viem"; +import { parseWagmiError } from "./parseWagmiError"; + export const OPTIONS = { position: "top-center" as ToastPosition, autoClose: 5000, @@ -39,11 +41,11 @@ export async function wrapWithToast( }) ) .catch((error) => { - toast.error(error.shortMessage ?? error.message, OPTIONS); + toast.error(parseWagmiError(error), OPTIONS); return { status: false }; }); } export async function catchShortMessage(promise: Promise) { - return await promise.catch((error) => toast.error(error.shortMessage ?? error.message, OPTIONS)); + return await promise.catch((error) => toast.error(parseWagmiError(error), OPTIONS)); }