From 9b2d36ea620e9ee7ad2dc70eea64c5b9ed0cf37b Mon Sep 17 00:00:00 2001 From: iamacook Date: Tue, 19 Sep 2023 18:05:19 +0200 Subject: [PATCH 1/3] fix: close transaction flow if Safe changes --- src/components/tx-flow/index.tsx | 9 +++++++++ 1 file changed, 9 insertions(+) diff --git a/src/components/tx-flow/index.tsx b/src/components/tx-flow/index.tsx index 2a5b7c0223..d059956fb6 100644 --- a/src/components/tx-flow/index.tsx +++ b/src/components/tx-flow/index.tsx @@ -1,6 +1,7 @@ import { createContext, type ReactElement, type ReactNode, useState, useEffect, useCallback } from 'react' import TxModalDialog from '@/components/common/TxModalDialog' import { usePathname } from 'next/navigation' +import useSafeInfo from '@/hooks/useSafeInfo' const noop = () => {} @@ -23,6 +24,7 @@ export const TxModalProvider = ({ children }: { children: ReactNode }): ReactEle const [fullWidth, setFullWidth] = useState(false) const pathname = usePathname() const [, setLastPath] = useState(pathname) + const { safe } = useSafeInfo() const handleModalClose = useCallback(() => { setOnClose((prevOnClose) => { @@ -63,6 +65,13 @@ export const TxModalProvider = ({ children }: { children: ReactNode }): ReactEle }) }, [txFlow, handleShowWarning, pathname]) + // Close the modal when the Safe changes + useEffect(() => { + setFlow(undefined) + // Could have same address but different chain + // eslint-disable-next-line react-hooks/exhaustive-deps + }, [safe.chainId, safe.address.value]) + return ( {children} From fd3bd59222b1720cb42148a0a976685fd9186073 Mon Sep 17 00:00:00 2001 From: iamacook Date: Tue, 19 Sep 2023 18:26:27 +0200 Subject: [PATCH 2/3] refactor: use `handleModalClose` --- src/components/tx-flow/index.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/tx-flow/index.tsx b/src/components/tx-flow/index.tsx index d059956fb6..180b802277 100644 --- a/src/components/tx-flow/index.tsx +++ b/src/components/tx-flow/index.tsx @@ -67,7 +67,7 @@ export const TxModalProvider = ({ children }: { children: ReactNode }): ReactEle // Close the modal when the Safe changes useEffect(() => { - setFlow(undefined) + handleModalClose() // Could have same address but different chain // eslint-disable-next-line react-hooks/exhaustive-deps }, [safe.chainId, safe.address.value]) From 9b72df89505868a11025f1133ca072209b11c8f6 Mon Sep 17 00:00:00 2001 From: iamacook Date: Wed, 20 Sep 2023 09:05:51 +0200 Subject: [PATCH 3/3] fix: use `safeAddress` variable --- src/components/tx-flow/index.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/components/tx-flow/index.tsx b/src/components/tx-flow/index.tsx index 180b802277..eebcbb0338 100644 --- a/src/components/tx-flow/index.tsx +++ b/src/components/tx-flow/index.tsx @@ -24,7 +24,7 @@ export const TxModalProvider = ({ children }: { children: ReactNode }): ReactEle const [fullWidth, setFullWidth] = useState(false) const pathname = usePathname() const [, setLastPath] = useState(pathname) - const { safe } = useSafeInfo() + const { safeAddress, safe } = useSafeInfo() const handleModalClose = useCallback(() => { setOnClose((prevOnClose) => { @@ -70,7 +70,7 @@ export const TxModalProvider = ({ children }: { children: ReactNode }): ReactEle handleModalClose() // Could have same address but different chain // eslint-disable-next-line react-hooks/exhaustive-deps - }, [safe.chainId, safe.address.value]) + }, [safe.chainId, safeAddress]) return (