From 9bd716c00783fd1d7be047ecff03a1570050b483 Mon Sep 17 00:00:00 2001 From: Diogo Soares Date: Tue, 9 May 2023 17:52:21 +0200 Subject: [PATCH 1/8] fix: improve disable condition and tooltip message on ExecuteTxButton --- .../transactions/ExecuteTxButton/index.tsx | 15 +++++++++++++-- 1 file changed, 13 insertions(+), 2 deletions(-) diff --git a/src/components/transactions/ExecuteTxButton/index.tsx b/src/components/transactions/ExecuteTxButton/index.tsx index c351269fcd..94f99f71e1 100644 --- a/src/components/transactions/ExecuteTxButton/index.tsx +++ b/src/components/transactions/ExecuteTxButton/index.tsx @@ -13,6 +13,7 @@ import Track from '@/components/common/Track' import { TX_LIST_EVENTS } from '@/services/analytics/events/txList' import { ReplaceTxHoverContext } from '../GroupedTxListItems/ReplaceTxHoverProvider' import CheckWallet from '@/components/common/CheckWallet' +import { getSafeSDK } from '@/hooks/coreSDK/safeCoreSDK' const ExecuteTxButton = ({ txSummary, @@ -26,9 +27,19 @@ const ExecuteTxButton = ({ const txNonce = isMultisigExecutionInfo(txSummary.executionInfo) ? txSummary.executionInfo.nonce : undefined const isPending = useIsPending(txSummary.id) const { setSelectedTxId } = useContext(ReplaceTxHoverContext) + const safeSDK = getSafeSDK() const isNext = txNonce !== undefined && txNonce === safe.nonce - const isDisabled = !isNext || isPending + const isDisabled = !isNext || isPending || !safeSDK + + const tooltipTitle = + isDisabled && !isNext + ? `Transaction ${safe.nonce} must be executed first` + : isPending + ? `There's a pending transaction` + : !safeSDK + ? 'Waiting for the SDK to initialize' + : 'Execute' const onClick = (e: SyntheticEvent) => { e.stopPropagation() @@ -49,7 +60,7 @@ const ExecuteTxButton = ({ {(isOk) => ( {compact ? ( - + Date: Tue, 9 May 2023 18:14:24 +0200 Subject: [PATCH 2/8] improve disable condition and tooltip message for RejectTxButton and SignTxButton --- .../transactions/RejectTxButton/index.tsx | 14 ++++++++++++-- .../transactions/SignTxButton/index.tsx | 15 ++++++++++++--- 2 files changed, 24 insertions(+), 5 deletions(-) diff --git a/src/components/transactions/RejectTxButton/index.tsx b/src/components/transactions/RejectTxButton/index.tsx index aec7d22bf5..bff8f3e513 100644 --- a/src/components/transactions/RejectTxButton/index.tsx +++ b/src/components/transactions/RejectTxButton/index.tsx @@ -11,6 +11,7 @@ import ErrorIcon from '@/public/images/notifications/error.svg' import Track from '@/components/common/Track' import { TX_LIST_EVENTS } from '@/services/analytics/events/txList' import CheckWallet from '@/components/common/CheckWallet' +import { getSafeSDK } from '@/hooks/coreSDK/safeCoreSDK' const NewTxModal = dynamic(() => import('@/components/tx/modals/NewTxModal')) @@ -23,7 +24,16 @@ const RejectTxButton = ({ }): ReactElement | null => { const [open, setOpen] = useState(false) const txNonce = isMultisigExecutionInfo(txSummary.executionInfo) ? txSummary.executionInfo.nonce : undefined - const isDisabled = useIsPending(txSummary.id) + const isPending = useIsPending(txSummary.id) + const safeSDK = getSafeSDK() + const isDisabled = isPending || !safeSDK + + const tooltipTitle = + isDisabled && isPending + ? `There's a pending transaction` + : !safeSDK + ? 'Waiting for the SDK to initialize' + : 'Replace' const onClick = (e: SyntheticEvent) => { e.stopPropagation() @@ -36,7 +46,7 @@ const RejectTxButton = ({ {(isOk) => ( {compact ? ( - + diff --git a/src/components/transactions/SignTxButton/index.tsx b/src/components/transactions/SignTxButton/index.tsx index 729d3ffff9..b4d81a2bc4 100644 --- a/src/components/transactions/SignTxButton/index.tsx +++ b/src/components/transactions/SignTxButton/index.tsx @@ -12,6 +12,7 @@ import CheckIcon from '@mui/icons-material/Check' import Track from '@/components/common/Track' import { TX_LIST_EVENTS } from '@/services/analytics/events/txList' import CheckWallet from '@/components/common/CheckWallet' +import { getSafeSDK } from '@/hooks/coreSDK/safeCoreSDK' const SignTxButton = ({ txSummary, @@ -24,21 +25,29 @@ const SignTxButton = ({ const wallet = useWallet() const isSignable = isSignableBy(txSummary, wallet?.address || '') const isPending = useIsPending(txSummary.id) + const safeSDK = getSafeSDK() + + const isDisabled = !isSignable || isPending || !safeSDK + + const tooltipTitle = + isDisabled && isPending + ? `There's a pending transaction` + : !safeSDK + ? 'Waiting for the SDK to initialize' + : 'Confirm' const onClick = (e: SyntheticEvent) => { e.stopPropagation() setOpen(true) } - const isDisabled = !isSignable || isPending - return ( <> {(isOk) => ( {compact ? ( - + From a9da9704c41bcc4a04b0357f124f1b38fa02b020 Mon Sep 17 00:00:00 2001 From: Diogo Soares Date: Wed, 10 May 2023 11:06:31 +0200 Subject: [PATCH 3/8] use hook instead of getter --- src/components/transactions/ExecuteTxButton/index.tsx | 4 ++-- src/components/transactions/RejectTxButton/index.tsx | 4 ++-- src/components/transactions/SignTxButton/index.tsx | 4 ++-- 3 files changed, 6 insertions(+), 6 deletions(-) diff --git a/src/components/transactions/ExecuteTxButton/index.tsx b/src/components/transactions/ExecuteTxButton/index.tsx index 94f99f71e1..83c8dd07e8 100644 --- a/src/components/transactions/ExecuteTxButton/index.tsx +++ b/src/components/transactions/ExecuteTxButton/index.tsx @@ -13,7 +13,7 @@ import Track from '@/components/common/Track' import { TX_LIST_EVENTS } from '@/services/analytics/events/txList' import { ReplaceTxHoverContext } from '../GroupedTxListItems/ReplaceTxHoverProvider' import CheckWallet from '@/components/common/CheckWallet' -import { getSafeSDK } from '@/hooks/coreSDK/safeCoreSDK' +import { useSafeSDK } from '@/hooks/coreSDK/safeCoreSDK' const ExecuteTxButton = ({ txSummary, @@ -27,7 +27,7 @@ const ExecuteTxButton = ({ const txNonce = isMultisigExecutionInfo(txSummary.executionInfo) ? txSummary.executionInfo.nonce : undefined const isPending = useIsPending(txSummary.id) const { setSelectedTxId } = useContext(ReplaceTxHoverContext) - const safeSDK = getSafeSDK() + const safeSDK = useSafeSDK() const isNext = txNonce !== undefined && txNonce === safe.nonce const isDisabled = !isNext || isPending || !safeSDK diff --git a/src/components/transactions/RejectTxButton/index.tsx b/src/components/transactions/RejectTxButton/index.tsx index bff8f3e513..8c0cbf6730 100644 --- a/src/components/transactions/RejectTxButton/index.tsx +++ b/src/components/transactions/RejectTxButton/index.tsx @@ -11,7 +11,7 @@ import ErrorIcon from '@/public/images/notifications/error.svg' import Track from '@/components/common/Track' import { TX_LIST_EVENTS } from '@/services/analytics/events/txList' import CheckWallet from '@/components/common/CheckWallet' -import { getSafeSDK } from '@/hooks/coreSDK/safeCoreSDK' +import { useSafeSDK } from '@/hooks/coreSDK/safeCoreSDK' const NewTxModal = dynamic(() => import('@/components/tx/modals/NewTxModal')) @@ -25,7 +25,7 @@ const RejectTxButton = ({ const [open, setOpen] = useState(false) const txNonce = isMultisigExecutionInfo(txSummary.executionInfo) ? txSummary.executionInfo.nonce : undefined const isPending = useIsPending(txSummary.id) - const safeSDK = getSafeSDK() + const safeSDK = useSafeSDK() const isDisabled = isPending || !safeSDK const tooltipTitle = diff --git a/src/components/transactions/SignTxButton/index.tsx b/src/components/transactions/SignTxButton/index.tsx index b4d81a2bc4..5a0dd574ad 100644 --- a/src/components/transactions/SignTxButton/index.tsx +++ b/src/components/transactions/SignTxButton/index.tsx @@ -12,7 +12,7 @@ import CheckIcon from '@mui/icons-material/Check' import Track from '@/components/common/Track' import { TX_LIST_EVENTS } from '@/services/analytics/events/txList' import CheckWallet from '@/components/common/CheckWallet' -import { getSafeSDK } from '@/hooks/coreSDK/safeCoreSDK' +import { useSafeSDK } from '@/hooks/coreSDK/safeCoreSDK' const SignTxButton = ({ txSummary, @@ -25,7 +25,7 @@ const SignTxButton = ({ const wallet = useWallet() const isSignable = isSignableBy(txSummary, wallet?.address || '') const isPending = useIsPending(txSummary.id) - const safeSDK = getSafeSDK() + const safeSDK = useSafeSDK() const isDisabled = !isSignable || isPending || !safeSDK From ad5c0deb1089cf20a6dbf3916a2957f12d63879c Mon Sep 17 00:00:00 2001 From: Diogo Soares Date: Wed, 10 May 2023 11:19:32 +0200 Subject: [PATCH 4/8] improve tx pending message --- src/components/transactions/ExecuteTxButton/index.tsx | 2 +- src/components/transactions/RejectTxButton/index.tsx | 2 +- src/components/transactions/SignTxButton/index.tsx | 2 +- 3 files changed, 3 insertions(+), 3 deletions(-) diff --git a/src/components/transactions/ExecuteTxButton/index.tsx b/src/components/transactions/ExecuteTxButton/index.tsx index 83c8dd07e8..36b22ac466 100644 --- a/src/components/transactions/ExecuteTxButton/index.tsx +++ b/src/components/transactions/ExecuteTxButton/index.tsx @@ -36,7 +36,7 @@ const ExecuteTxButton = ({ isDisabled && !isNext ? `Transaction ${safe.nonce} must be executed first` : isPending - ? `There's a pending transaction` + ? 'Pending transaction must first succeed' : !safeSDK ? 'Waiting for the SDK to initialize' : 'Execute' diff --git a/src/components/transactions/RejectTxButton/index.tsx b/src/components/transactions/RejectTxButton/index.tsx index 8c0cbf6730..17324e835b 100644 --- a/src/components/transactions/RejectTxButton/index.tsx +++ b/src/components/transactions/RejectTxButton/index.tsx @@ -30,7 +30,7 @@ const RejectTxButton = ({ const tooltipTitle = isDisabled && isPending - ? `There's a pending transaction` + ? 'Pending transaction must first succeed' : !safeSDK ? 'Waiting for the SDK to initialize' : 'Replace' diff --git a/src/components/transactions/SignTxButton/index.tsx b/src/components/transactions/SignTxButton/index.tsx index 5a0dd574ad..4cdb05f594 100644 --- a/src/components/transactions/SignTxButton/index.tsx +++ b/src/components/transactions/SignTxButton/index.tsx @@ -31,7 +31,7 @@ const SignTxButton = ({ const tooltipTitle = isDisabled && isPending - ? `There's a pending transaction` + ? 'Pending transaction must first succeed' : !safeSDK ? 'Waiting for the SDK to initialize' : 'Confirm' From 183e252173c964f39b0f8050b241dfc7cdaf2b84 Mon Sep 17 00:00:00 2001 From: Diogo Soares Date: Wed, 10 May 2023 16:12:05 +0200 Subject: [PATCH 5/8] extract get tootip title to an util --- .../transactions/ExecuteTxButton/index.tsx | 10 +---- .../transactions/RejectTxButton/index.tsx | 8 +--- .../transactions/SignTxButton/index.tsx | 8 +--- .../transactions/__tests__/utils.test.ts | 38 +++++++++++++++++++ src/components/transactions/utils.ts | 27 +++++++++++++ 5 files changed, 71 insertions(+), 20 deletions(-) create mode 100644 src/components/transactions/__tests__/utils.test.ts create mode 100644 src/components/transactions/utils.ts diff --git a/src/components/transactions/ExecuteTxButton/index.tsx b/src/components/transactions/ExecuteTxButton/index.tsx index 36b22ac466..afd187442d 100644 --- a/src/components/transactions/ExecuteTxButton/index.tsx +++ b/src/components/transactions/ExecuteTxButton/index.tsx @@ -14,6 +14,7 @@ import { TX_LIST_EVENTS } from '@/services/analytics/events/txList' import { ReplaceTxHoverContext } from '../GroupedTxListItems/ReplaceTxHoverProvider' import CheckWallet from '@/components/common/CheckWallet' import { useSafeSDK } from '@/hooks/coreSDK/safeCoreSDK' +import { getTxButtonTooltip } from '@/components/transactions/utils' const ExecuteTxButton = ({ txSummary, @@ -32,14 +33,7 @@ const ExecuteTxButton = ({ const isNext = txNonce !== undefined && txNonce === safe.nonce const isDisabled = !isNext || isPending || !safeSDK - const tooltipTitle = - isDisabled && !isNext - ? `Transaction ${safe.nonce} must be executed first` - : isPending - ? 'Pending transaction must first succeed' - : !safeSDK - ? 'Waiting for the SDK to initialize' - : 'Execute' + const tooltipTitle = getTxButtonTooltip('Execute', { isNext, nonce: safe.nonce, isPending, hasSafeSDK: !!safeSDK }) const onClick = (e: SyntheticEvent) => { e.stopPropagation() diff --git a/src/components/transactions/RejectTxButton/index.tsx b/src/components/transactions/RejectTxButton/index.tsx index 17324e835b..c0b0fba03b 100644 --- a/src/components/transactions/RejectTxButton/index.tsx +++ b/src/components/transactions/RejectTxButton/index.tsx @@ -12,6 +12,7 @@ import Track from '@/components/common/Track' import { TX_LIST_EVENTS } from '@/services/analytics/events/txList' import CheckWallet from '@/components/common/CheckWallet' import { useSafeSDK } from '@/hooks/coreSDK/safeCoreSDK' +import { getTxButtonTooltip } from '@/components/transactions/utils' const NewTxModal = dynamic(() => import('@/components/tx/modals/NewTxModal')) @@ -28,12 +29,7 @@ const RejectTxButton = ({ const safeSDK = useSafeSDK() const isDisabled = isPending || !safeSDK - const tooltipTitle = - isDisabled && isPending - ? 'Pending transaction must first succeed' - : !safeSDK - ? 'Waiting for the SDK to initialize' - : 'Replace' + const tooltipTitle = getTxButtonTooltip('Replace', { isPending, hasSafeSDK: !!safeSDK }) const onClick = (e: SyntheticEvent) => { e.stopPropagation() diff --git a/src/components/transactions/SignTxButton/index.tsx b/src/components/transactions/SignTxButton/index.tsx index 4cdb05f594..8b8afcf55d 100644 --- a/src/components/transactions/SignTxButton/index.tsx +++ b/src/components/transactions/SignTxButton/index.tsx @@ -13,6 +13,7 @@ import Track from '@/components/common/Track' import { TX_LIST_EVENTS } from '@/services/analytics/events/txList' import CheckWallet from '@/components/common/CheckWallet' import { useSafeSDK } from '@/hooks/coreSDK/safeCoreSDK' +import { getTxButtonTooltip } from '@/components/transactions/utils' const SignTxButton = ({ txSummary, @@ -29,12 +30,7 @@ const SignTxButton = ({ const isDisabled = !isSignable || isPending || !safeSDK - const tooltipTitle = - isDisabled && isPending - ? 'Pending transaction must first succeed' - : !safeSDK - ? 'Waiting for the SDK to initialize' - : 'Confirm' + const tooltipTitle = getTxButtonTooltip('Confirm', { isPending, hasSafeSDK: !!safeSDK }) const onClick = (e: SyntheticEvent) => { e.stopPropagation() diff --git a/src/components/transactions/__tests__/utils.test.ts b/src/components/transactions/__tests__/utils.test.ts new file mode 100644 index 0000000000..fb0d631d27 --- /dev/null +++ b/src/components/transactions/__tests__/utils.test.ts @@ -0,0 +1,38 @@ +import { getTxButtonTooltip } from '../utils' + +describe('transactions utils', () => { + describe('getTooltipTitle', () => { + const disabledPropsBase = { isPending: false, hasSafeSDK: true } + + it('should return the enabledTitle if no disabled conditions', () => { + const enabledTitle = 'Execute' + + expect(getTxButtonTooltip(enabledTitle, disabledPropsBase)).toBe('Execute') + expect(true).toBe(true) + }) + + it('should return the not isNext message', () => { + const enabledTitle = 'Confirm' + const nonce = 2 + const disabledProps = { ...disabledPropsBase, isNext: false, nonce } + + expect(getTxButtonTooltip(enabledTitle, disabledProps)).toBe('Transaction 2 must be executed first') + }) + + it('should return the "is tx pending" message', () => { + const enabledTitle = 'Execute' + const disabledProps = { ...disabledPropsBase, isPending: true } + + expect(getTxButtonTooltip(enabledTitle, disabledProps)).toBe('Pending transaction must first succeed') + expect(true).toBe(true) + }) + + it('should return the Safe SDK not initialized message', () => { + const enabledTitle = 'Execute' + const disabledProps = { ...disabledPropsBase, hasSafeSDK: false } + + expect(getTxButtonTooltip(enabledTitle, disabledProps)).toBe('Waiting for the SDK to initialize') + expect(true).toBe(true) + }) + }) +}) diff --git a/src/components/transactions/utils.ts b/src/components/transactions/utils.ts new file mode 100644 index 0000000000..2697e82195 --- /dev/null +++ b/src/components/transactions/utils.ts @@ -0,0 +1,27 @@ +type DisabledPropsType = + | { + isNext: false + nonce: number + isPending: boolean + hasSafeSDK: boolean + } + | { + isNext?: boolean + nonce?: number + isPending: boolean + hasSafeSDK: boolean + } + +type EnabledTitleType = 'Execute' | 'Replace' | 'Confirm' + +export const getTxButtonTooltip = (enabledTitle: EnabledTitleType, disabledProps: DisabledPropsType) => { + const { isPending, hasSafeSDK, isNext, nonce } = disabledProps + + return isNext === false + ? `Transaction ${nonce} must be executed first` + : isPending + ? 'Pending transaction must first succeed' + : !hasSafeSDK + ? 'Waiting for the SDK to initialize' + : enabledTitle +} From 850ab75a8436a6bc04ec2f70ae53a3edc0cbd563 Mon Sep 17 00:00:00 2001 From: Diogo Soares Date: Wed, 10 May 2023 17:12:53 +0200 Subject: [PATCH 6/8] improve type and remove leftover code --- .../transactions/__tests__/utils.test.ts | 3 --- src/components/transactions/utils.ts | 19 ++++++------------- 2 files changed, 6 insertions(+), 16 deletions(-) diff --git a/src/components/transactions/__tests__/utils.test.ts b/src/components/transactions/__tests__/utils.test.ts index fb0d631d27..40301a4e1d 100644 --- a/src/components/transactions/__tests__/utils.test.ts +++ b/src/components/transactions/__tests__/utils.test.ts @@ -8,7 +8,6 @@ describe('transactions utils', () => { const enabledTitle = 'Execute' expect(getTxButtonTooltip(enabledTitle, disabledPropsBase)).toBe('Execute') - expect(true).toBe(true) }) it('should return the not isNext message', () => { @@ -24,7 +23,6 @@ describe('transactions utils', () => { const disabledProps = { ...disabledPropsBase, isPending: true } expect(getTxButtonTooltip(enabledTitle, disabledProps)).toBe('Pending transaction must first succeed') - expect(true).toBe(true) }) it('should return the Safe SDK not initialized message', () => { @@ -32,7 +30,6 @@ describe('transactions utils', () => { const disabledProps = { ...disabledPropsBase, hasSafeSDK: false } expect(getTxButtonTooltip(enabledTitle, disabledProps)).toBe('Waiting for the SDK to initialize') - expect(true).toBe(true) }) }) }) diff --git a/src/components/transactions/utils.ts b/src/components/transactions/utils.ts index 2697e82195..d820a4c35a 100644 --- a/src/components/transactions/utils.ts +++ b/src/components/transactions/utils.ts @@ -1,16 +1,9 @@ -type DisabledPropsType = - | { - isNext: false - nonce: number - isPending: boolean - hasSafeSDK: boolean - } - | { - isNext?: boolean - nonce?: number - isPending: boolean - hasSafeSDK: boolean - } +type DisabledPropsType = { + isNext?: boolean + nonce?: number + isPending: boolean + hasSafeSDK: boolean +} type EnabledTitleType = 'Execute' | 'Replace' | 'Confirm' From 9f8f7fd66254a296211ec3fd47b62fe29876e580 Mon Sep 17 00:00:00 2001 From: Diogo Soares Date: Thu, 11 May 2023 11:57:13 +0200 Subject: [PATCH 7/8] improve SDK not initialized tooltip message --- src/components/transactions/__tests__/utils.test.ts | 4 ++-- src/components/transactions/utils.ts | 2 +- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/src/components/transactions/__tests__/utils.test.ts b/src/components/transactions/__tests__/utils.test.ts index 40301a4e1d..832d8e0d7d 100644 --- a/src/components/transactions/__tests__/utils.test.ts +++ b/src/components/transactions/__tests__/utils.test.ts @@ -25,11 +25,11 @@ describe('transactions utils', () => { expect(getTxButtonTooltip(enabledTitle, disabledProps)).toBe('Pending transaction must first succeed') }) - it('should return the Safe SDK not initialized message', () => { + it('should return the SDK not initialized message', () => { const enabledTitle = 'Execute' const disabledProps = { ...disabledPropsBase, hasSafeSDK: false } - expect(getTxButtonTooltip(enabledTitle, disabledProps)).toBe('Waiting for the SDK to initialize') + expect(getTxButtonTooltip(enabledTitle, disabledProps)).toBe('Loading') }) }) }) diff --git a/src/components/transactions/utils.ts b/src/components/transactions/utils.ts index d820a4c35a..42c475985e 100644 --- a/src/components/transactions/utils.ts +++ b/src/components/transactions/utils.ts @@ -15,6 +15,6 @@ export const getTxButtonTooltip = (enabledTitle: EnabledTitleType, disabledProps : isPending ? 'Pending transaction must first succeed' : !hasSafeSDK - ? 'Waiting for the SDK to initialize' + ? 'Loading' : enabledTitle } From 9985ca44a371b9e71eae9d8995c3264fcab2425d Mon Sep 17 00:00:00 2001 From: Diogo Soares Date: Fri, 12 May 2023 16:26:40 +0200 Subject: [PATCH 8/8] remove tx is pending tooltip --- src/components/transactions/ExecuteTxButton/index.tsx | 2 +- src/components/transactions/RejectTxButton/index.tsx | 2 +- src/components/transactions/SignTxButton/index.tsx | 2 +- src/components/transactions/__tests__/utils.test.ts | 9 +-------- src/components/transactions/utils.ts | 11 ++--------- 5 files changed, 6 insertions(+), 20 deletions(-) diff --git a/src/components/transactions/ExecuteTxButton/index.tsx b/src/components/transactions/ExecuteTxButton/index.tsx index afd187442d..302310b933 100644 --- a/src/components/transactions/ExecuteTxButton/index.tsx +++ b/src/components/transactions/ExecuteTxButton/index.tsx @@ -33,7 +33,7 @@ const ExecuteTxButton = ({ const isNext = txNonce !== undefined && txNonce === safe.nonce const isDisabled = !isNext || isPending || !safeSDK - const tooltipTitle = getTxButtonTooltip('Execute', { isNext, nonce: safe.nonce, isPending, hasSafeSDK: !!safeSDK }) + const tooltipTitle = getTxButtonTooltip('Execute', { isNext, nonce: safe.nonce, hasSafeSDK: !!safeSDK }) const onClick = (e: SyntheticEvent) => { e.stopPropagation() diff --git a/src/components/transactions/RejectTxButton/index.tsx b/src/components/transactions/RejectTxButton/index.tsx index c0b0fba03b..88590cf96e 100644 --- a/src/components/transactions/RejectTxButton/index.tsx +++ b/src/components/transactions/RejectTxButton/index.tsx @@ -29,7 +29,7 @@ const RejectTxButton = ({ const safeSDK = useSafeSDK() const isDisabled = isPending || !safeSDK - const tooltipTitle = getTxButtonTooltip('Replace', { isPending, hasSafeSDK: !!safeSDK }) + const tooltipTitle = getTxButtonTooltip('Replace', { hasSafeSDK: !!safeSDK }) const onClick = (e: SyntheticEvent) => { e.stopPropagation() diff --git a/src/components/transactions/SignTxButton/index.tsx b/src/components/transactions/SignTxButton/index.tsx index 8b8afcf55d..2c0b3b4c0f 100644 --- a/src/components/transactions/SignTxButton/index.tsx +++ b/src/components/transactions/SignTxButton/index.tsx @@ -30,7 +30,7 @@ const SignTxButton = ({ const isDisabled = !isSignable || isPending || !safeSDK - const tooltipTitle = getTxButtonTooltip('Confirm', { isPending, hasSafeSDK: !!safeSDK }) + const tooltipTitle = getTxButtonTooltip('Confirm', { hasSafeSDK: !!safeSDK }) const onClick = (e: SyntheticEvent) => { e.stopPropagation() diff --git a/src/components/transactions/__tests__/utils.test.ts b/src/components/transactions/__tests__/utils.test.ts index 832d8e0d7d..aeea741306 100644 --- a/src/components/transactions/__tests__/utils.test.ts +++ b/src/components/transactions/__tests__/utils.test.ts @@ -2,7 +2,7 @@ import { getTxButtonTooltip } from '../utils' describe('transactions utils', () => { describe('getTooltipTitle', () => { - const disabledPropsBase = { isPending: false, hasSafeSDK: true } + const disabledPropsBase = { hasSafeSDK: true } it('should return the enabledTitle if no disabled conditions', () => { const enabledTitle = 'Execute' @@ -18,13 +18,6 @@ describe('transactions utils', () => { expect(getTxButtonTooltip(enabledTitle, disabledProps)).toBe('Transaction 2 must be executed first') }) - it('should return the "is tx pending" message', () => { - const enabledTitle = 'Execute' - const disabledProps = { ...disabledPropsBase, isPending: true } - - expect(getTxButtonTooltip(enabledTitle, disabledProps)).toBe('Pending transaction must first succeed') - }) - it('should return the SDK not initialized message', () => { const enabledTitle = 'Execute' const disabledProps = { ...disabledPropsBase, hasSafeSDK: false } diff --git a/src/components/transactions/utils.ts b/src/components/transactions/utils.ts index 42c475985e..9f501c136d 100644 --- a/src/components/transactions/utils.ts +++ b/src/components/transactions/utils.ts @@ -1,20 +1,13 @@ type DisabledPropsType = { isNext?: boolean nonce?: number - isPending: boolean hasSafeSDK: boolean } type EnabledTitleType = 'Execute' | 'Replace' | 'Confirm' export const getTxButtonTooltip = (enabledTitle: EnabledTitleType, disabledProps: DisabledPropsType) => { - const { isPending, hasSafeSDK, isNext, nonce } = disabledProps + const { hasSafeSDK, isNext, nonce } = disabledProps - return isNext === false - ? `Transaction ${nonce} must be executed first` - : isPending - ? 'Pending transaction must first succeed' - : !hasSafeSDK - ? 'Loading' - : enabledTitle + return isNext === false ? `Transaction ${nonce} must be executed first` : !hasSafeSDK ? 'Loading' : enabledTitle }