From 6a0540f9a2bc2397de580f017925e33c7289cf83 Mon Sep 17 00:00:00 2001 From: Usame Algan Date: Thu, 19 Sep 2024 14:47:52 +0200 Subject: [PATCH 1/2] fix: Disable submit button while replaying safe --- .../components/CreateSafeOnNewChain/index.tsx | 14 +++++++++++++- 1 file changed, 13 insertions(+), 1 deletion(-) diff --git a/src/features/multichain/components/CreateSafeOnNewChain/index.tsx b/src/features/multichain/components/CreateSafeOnNewChain/index.tsx index beccedec52..611848df62 100644 --- a/src/features/multichain/components/CreateSafeOnNewChain/index.tsx +++ b/src/features/multichain/components/CreateSafeOnNewChain/index.tsx @@ -69,13 +69,17 @@ const ReplaySafeDialog = ({ const customRpc = useAppSelector(selectRpc) const dispatch = useAppDispatch() const [creationError, setCreationError] = useState() + const [isSubmitDisabled, setIsSubmitDisabled] = useState(false) // Load some data const [safeCreationData, safeCreationDataError, safeCreationDataLoading] = safeCreationResult const onFormSubmit = handleSubmit(async (data) => { + setIsSubmitDisabled(true) + const selectedChain = chain ?? replayableChains?.find((config) => config.chainId === data.chainId) if (!safeCreationData || !selectedChain) { + setIsSubmitDisabled(false) return } @@ -83,6 +87,7 @@ const ReplaySafeDialog = ({ const customRpcUrl = selectedChain ? customRpc?.[selectedChain.chainId] : undefined const provider = createWeb3ReadOnly(selectedChain, customRpcUrl) if (!provider) { + setIsSubmitDisabled(false) return } @@ -90,6 +95,7 @@ const ReplaySafeDialog = ({ const predictedAddress = await predictAddressBasedOnReplayData(safeCreationData, provider) if (!sameAddress(safeAddress, predictedAddress)) { setCreationError(new Error('The replayed Safe leads to an unexpected address')) + setIsSubmitDisabled(false) return } @@ -102,12 +108,18 @@ const ReplaySafeDialog = ({ }, }) + setIsSubmitDisabled(false) + // Close modal onClose() }) const submitDisabled = - isUnsupportedSafeCreationVersion || !!safeCreationDataError || safeCreationDataLoading || !formState.isValid + isUnsupportedSafeCreationVersion || + !!safeCreationDataError || + safeCreationDataLoading || + !formState.isValid || + isSubmitDisabled const noChainsAvailable = !chain && safeCreationData && replayableChains && replayableChains.filter((chain) => chain.available).length === 0 From 3234a31c1fc736b87a0c4430b2b639db4a3ad880 Mon Sep 17 00:00:00 2001 From: Usame Algan Date: Mon, 23 Sep 2024 11:30:53 +0200 Subject: [PATCH 2/2] fix: Add try catch --- .../components/CreateSafeOnNewChain/index.tsx | 77 ++++++++++--------- 1 file changed, 39 insertions(+), 38 deletions(-) diff --git a/src/features/multichain/components/CreateSafeOnNewChain/index.tsx b/src/features/multichain/components/CreateSafeOnNewChain/index.tsx index 611848df62..43ab7e78cf 100644 --- a/src/features/multichain/components/CreateSafeOnNewChain/index.tsx +++ b/src/features/multichain/components/CreateSafeOnNewChain/index.tsx @@ -69,49 +69,50 @@ const ReplaySafeDialog = ({ const customRpc = useAppSelector(selectRpc) const dispatch = useAppDispatch() const [creationError, setCreationError] = useState() - const [isSubmitDisabled, setIsSubmitDisabled] = useState(false) + const [isSubmitting, setIsSubmitting] = useState(false) // Load some data const [safeCreationData, safeCreationDataError, safeCreationDataLoading] = safeCreationResult const onFormSubmit = handleSubmit(async (data) => { - setIsSubmitDisabled(true) - - const selectedChain = chain ?? replayableChains?.find((config) => config.chainId === data.chainId) - if (!safeCreationData || !selectedChain) { - setIsSubmitDisabled(false) - return - } - - // We need to create a readOnly provider of the deployed chain - const customRpcUrl = selectedChain ? customRpc?.[selectedChain.chainId] : undefined - const provider = createWeb3ReadOnly(selectedChain, customRpcUrl) - if (!provider) { - setIsSubmitDisabled(false) - return - } - - // 1. Double check that the creation Data will lead to the correct address - const predictedAddress = await predictAddressBasedOnReplayData(safeCreationData, provider) - if (!sameAddress(safeAddress, predictedAddress)) { - setCreationError(new Error('The replayed Safe leads to an unexpected address')) - setIsSubmitDisabled(false) - return + setIsSubmitting(true) + + try { + const selectedChain = chain ?? replayableChains?.find((config) => config.chainId === data.chainId) + if (!safeCreationData || !selectedChain) { + return + } + + // We need to create a readOnly provider of the deployed chain + const customRpcUrl = selectedChain ? customRpc?.[selectedChain.chainId] : undefined + const provider = createWeb3ReadOnly(selectedChain, customRpcUrl) + if (!provider) { + return + } + + // 1. Double check that the creation Data will lead to the correct address + const predictedAddress = await predictAddressBasedOnReplayData(safeCreationData, provider) + if (!sameAddress(safeAddress, predictedAddress)) { + setCreationError(new Error('The replayed Safe leads to an unexpected address')) + return + } + + // 2. Replay Safe creation and add it to the counterfactual Safes + replayCounterfactualSafeDeployment(selectedChain.chainId, safeAddress, safeCreationData, data.name, dispatch) + + router.push({ + query: { + safe: `${selectedChain.shortName}:${safeAddress}`, + }, + }) + } catch (err) { + console.error(err) + } finally { + setIsSubmitting(false) + + // Close modal + onClose() } - - // 2. Replay Safe creation and add it to the counterfactual Safes - replayCounterfactualSafeDeployment(selectedChain.chainId, safeAddress, safeCreationData, data.name, dispatch) - - router.push({ - query: { - safe: `${selectedChain.shortName}:${safeAddress}`, - }, - }) - - setIsSubmitDisabled(false) - - // Close modal - onClose() }) const submitDisabled = @@ -119,7 +120,7 @@ const ReplaySafeDialog = ({ !!safeCreationDataError || safeCreationDataLoading || !formState.isValid || - isSubmitDisabled + isSubmitting const noChainsAvailable = !chain && safeCreationData && replayableChains && replayableChains.filter((chain) => chain.available).length === 0