From 7d81eaed24c531666ab2f53f98b58417582677e8 Mon Sep 17 00:00:00 2001 From: iamacook Date: Mon, 11 Oct 2021 17:03:35 +0200 Subject: [PATCH 1/5] Use logoUri and name from txInfo --- .../TxList/hooks/useTransactionType.ts | 20 +++++++++++++------ 1 file changed, 14 insertions(+), 6 deletions(-) diff --git a/src/routes/safe/components/Transactions/TxList/hooks/useTransactionType.ts b/src/routes/safe/components/Transactions/TxList/hooks/useTransactionType.ts index a9bf63e4e7..f19704f8b0 100644 --- a/src/routes/safe/components/Transactions/TxList/hooks/useTransactionType.ts +++ b/src/routes/safe/components/Transactions/TxList/hooks/useTransactionType.ts @@ -30,12 +30,18 @@ export const useTransactionType = (tx: Transaction): TxTypeProps => { useEffect(() => { switch (tx.txInfo.type) { case 'Creation': { - setType({ icon: SettingsTxIcon, text: 'Safe created' }) + setType({ icon: tx.txInfo.creator.logoUri ?? SettingsTxIcon, text: tx.txInfo.creator.name ?? 'Safe created' }) break } case 'Transfer': { const isSendTx = tx.txInfo.direction === 'OUTGOING' - setType({ icon: isSendTx ? OutgoingTxIcon : IncomingTxIcon, text: isSendTx ? 'Send' : 'Receive' }) + + const icon = isSendTx + ? tx.txInfo.recipient?.logoUri ?? OutgoingTxIcon + : tx.txInfo.sender?.logoUri ?? IncomingTxIcon + const text = isSendTx ? tx.txInfo?.recipient?.name ?? 'Send' : tx.txInfo?.sender?.name ?? 'Receive' + + setType({ icon, text }) break } case 'SettingsChange': { @@ -59,11 +65,13 @@ export const useTransactionType = (tx: Transaction): TxTypeProps => { break } - const hasKnownName = tx.txInfo.to.name + const icon = knownAddress.isAddressBook ? knownAddress.image : tx.txInfo.to.logoUri ?? CustomTxIcon + const text = knownAddress.isAddressBook ? knownAddress.name : tx.txInfo.to.name ?? 'Contract interaction' + setType({ - icon: knownAddress.isAddressBook ? CustomTxIcon : knownAddress.image || CustomTxIcon, - fallbackIcon: knownAddress.isAddressBook ? undefined : CustomTxIcon, - text: hasKnownName ? knownAddress.name : 'Contract interaction', + icon, + fallbackIcon: CustomTxIcon, + text, }) break } From f7d5baf522c70a4eb845b0aa5ce6a4989f433bee Mon Sep 17 00:00:00 2001 From: iamacook Date: Mon, 11 Oct 2021 17:26:53 +0200 Subject: [PATCH 2/5] Tweak transaction icons --- .../Transactions/TxList/hooks/useTransactionType.ts | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/src/routes/safe/components/Transactions/TxList/hooks/useTransactionType.ts b/src/routes/safe/components/Transactions/TxList/hooks/useTransactionType.ts index f19704f8b0..8f8baf94cd 100644 --- a/src/routes/safe/components/Transactions/TxList/hooks/useTransactionType.ts +++ b/src/routes/safe/components/Transactions/TxList/hooks/useTransactionType.ts @@ -36,9 +36,7 @@ export const useTransactionType = (tx: Transaction): TxTypeProps => { case 'Transfer': { const isSendTx = tx.txInfo.direction === 'OUTGOING' - const icon = isSendTx - ? tx.txInfo.recipient?.logoUri ?? OutgoingTxIcon - : tx.txInfo.sender?.logoUri ?? IncomingTxIcon + const icon = isSendTx ? OutgoingTxIcon : IncomingTxIcon const text = isSendTx ? tx.txInfo?.recipient?.name ?? 'Send' : tx.txInfo?.sender?.name ?? 'Receive' setType({ icon, text }) @@ -65,12 +63,14 @@ export const useTransactionType = (tx: Transaction): TxTypeProps => { break } - const icon = knownAddress.isAddressBook ? knownAddress.image : tx.txInfo.to.logoUri ?? CustomTxIcon + const icon = knownAddress.isAddressBook + ? CustomTxIcon + : knownAddress.image ?? tx.txInfo.to.logoUri ?? CustomTxIcon const text = knownAddress.isAddressBook ? knownAddress.name : tx.txInfo.to.name ?? 'Contract interaction' setType({ icon, - fallbackIcon: CustomTxIcon, + fallbackIcon: knownAddress.isAddressBook ? undefined : CustomTxIcon, text, }) break From 0554f5718fb6c6d79a558c1b916f42695354cc68 Mon Sep 17 00:00:00 2001 From: iamacook Date: Tue, 12 Oct 2021 11:12:05 +0200 Subject: [PATCH 3/5] Use helper function --- .../Transactions/TxList/hooks/useTransactionType.ts | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/src/routes/safe/components/Transactions/TxList/hooks/useTransactionType.ts b/src/routes/safe/components/Transactions/TxList/hooks/useTransactionType.ts index 8f8baf94cd..e34af15d5e 100644 --- a/src/routes/safe/components/Transactions/TxList/hooks/useTransactionType.ts +++ b/src/routes/safe/components/Transactions/TxList/hooks/useTransactionType.ts @@ -30,14 +30,14 @@ export const useTransactionType = (tx: Transaction): TxTypeProps => { useEffect(() => { switch (tx.txInfo.type) { case 'Creation': { - setType({ icon: tx.txInfo.creator.logoUri ?? SettingsTxIcon, text: tx.txInfo.creator.name ?? 'Safe created' }) + setType({ icon: toAddress?.logoUri ?? SettingsTxIcon, text: 'Safe created' }) break } case 'Transfer': { const isSendTx = tx.txInfo.direction === 'OUTGOING' const icon = isSendTx ? OutgoingTxIcon : IncomingTxIcon - const text = isSendTx ? tx.txInfo?.recipient?.name ?? 'Send' : tx.txInfo?.sender?.name ?? 'Receive' + const text = toAddress?.name ?? isSendTx ? 'Send' : 'Receive' setType({ icon, text }) break @@ -65,8 +65,8 @@ export const useTransactionType = (tx: Transaction): TxTypeProps => { const icon = knownAddress.isAddressBook ? CustomTxIcon - : knownAddress.image ?? tx.txInfo.to.logoUri ?? CustomTxIcon - const text = knownAddress.isAddressBook ? knownAddress.name : tx.txInfo.to.name ?? 'Contract interaction' + : knownAddress.image ?? toAddress?.logoUri ?? CustomTxIcon + const text = knownAddress.isAddressBook ? knownAddress.name : toAddress?.name ?? 'Contract interaction' setType({ icon, From 468d97968e47eee6a41dd4cbc2883c2414d48732 Mon Sep 17 00:00:00 2001 From: iamacook Date: Tue, 12 Oct 2021 11:52:11 +0200 Subject: [PATCH 4/5] Clean up logic --- .../TxList/hooks/useTransactionType.ts | 33 ++++++++++--------- 1 file changed, 18 insertions(+), 15 deletions(-) diff --git a/src/routes/safe/components/Transactions/TxList/hooks/useTransactionType.ts b/src/routes/safe/components/Transactions/TxList/hooks/useTransactionType.ts index e34af15d5e..50820c6633 100644 --- a/src/routes/safe/components/Transactions/TxList/hooks/useTransactionType.ts +++ b/src/routes/safe/components/Transactions/TxList/hooks/useTransactionType.ts @@ -22,7 +22,7 @@ export const useTransactionType = (tx: Transaction): TxTypeProps => { const safeAddress = useSelector(safeAddressFromUrl) const toAddress = getTxTo(tx) // Fixed casting because known address only works for Custom tx - const knownAddress = useKnownAddress(toAddress?.value || '0x', { + const knownAddressBookAddress = useKnownAddress(toAddress?.value || '0x', { name: toAddress?.name || undefined, image: toAddress?.logoUri || undefined, }) @@ -30,16 +30,16 @@ export const useTransactionType = (tx: Transaction): TxTypeProps => { useEffect(() => { switch (tx.txInfo.type) { case 'Creation': { - setType({ icon: toAddress?.logoUri ?? SettingsTxIcon, text: 'Safe created' }) + setType({ icon: toAddress?.logoUri || SettingsTxIcon, text: 'Safe created' }) break } case 'Transfer': { const isSendTx = tx.txInfo.direction === 'OUTGOING' - const icon = isSendTx ? OutgoingTxIcon : IncomingTxIcon - const text = toAddress?.name ?? isSendTx ? 'Send' : 'Receive' - - setType({ icon, text }) + setType({ + icon: isSendTx ? OutgoingTxIcon : IncomingTxIcon, + text: knownAddressBookAddress.name || toAddress?.name || isSendTx ? 'Send' : 'Receive', + }) break } case 'SettingsChange': { @@ -63,20 +63,23 @@ export const useTransactionType = (tx: Transaction): TxTypeProps => { break } - const icon = knownAddress.isAddressBook - ? CustomTxIcon - : knownAddress.image ?? toAddress?.logoUri ?? CustomTxIcon - const text = knownAddress.isAddressBook ? knownAddress.name : toAddress?.name ?? 'Contract interaction' - setType({ - icon, - fallbackIcon: knownAddress.isAddressBook ? undefined : CustomTxIcon, - text, + icon: knownAddressBookAddress.isAddressBook + ? CustomTxIcon + : knownAddressBookAddress.image || toAddress?.logoUri || CustomTxIcon, + fallbackIcon: knownAddressBookAddress.isAddressBook ? undefined : CustomTxIcon, + text: knownAddressBookAddress.name || toAddress?.name || 'Contract interaction', }) break } } - }, [tx, safeAddress, knownAddress.name, knownAddress.image, knownAddress.isAddressBook]) + }, [ + tx, + safeAddress, + knownAddressBookAddress.name, + knownAddressBookAddress.image, + knownAddressBookAddress.isAddressBook, + ]) return type } From ff5c1603390bec2c14767a5a108befad7535eca9 Mon Sep 17 00:00:00 2001 From: iamacook Date: Tue, 12 Oct 2021 12:13:56 +0200 Subject: [PATCH 5/5] Add brackets --- .../components/Transactions/TxList/hooks/useTransactionType.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/routes/safe/components/Transactions/TxList/hooks/useTransactionType.ts b/src/routes/safe/components/Transactions/TxList/hooks/useTransactionType.ts index 50820c6633..4703e8a246 100644 --- a/src/routes/safe/components/Transactions/TxList/hooks/useTransactionType.ts +++ b/src/routes/safe/components/Transactions/TxList/hooks/useTransactionType.ts @@ -38,7 +38,7 @@ export const useTransactionType = (tx: Transaction): TxTypeProps => { setType({ icon: isSendTx ? OutgoingTxIcon : IncomingTxIcon, - text: knownAddressBookAddress.name || toAddress?.name || isSendTx ? 'Send' : 'Receive', + text: knownAddressBookAddress.name || toAddress?.name || (isSendTx ? 'Send' : 'Receive'), }) break }