From 543f0022d0e7f6e74f309e83cc4622d28be9c88f Mon Sep 17 00:00:00 2001 From: Matej Lubej Date: Thu, 4 Apr 2024 05:36:03 +0200 Subject: [PATCH 1/6] Remove leftover CopyToClipboard due to plain mode removed --- .../RuntimeEvents/RuntimeEventDetails.tsx | 19 ------------------- .../RuntimeEventsDetailedList.tsx | 2 +- 2 files changed, 1 insertion(+), 20 deletions(-) diff --git a/src/app/components/RuntimeEvents/RuntimeEventDetails.tsx b/src/app/components/RuntimeEvents/RuntimeEventDetails.tsx index 419401139..b9feda335 100644 --- a/src/app/components/RuntimeEvents/RuntimeEventDetails.tsx +++ b/src/app/components/RuntimeEvents/RuntimeEventDetails.tsx @@ -204,9 +204,6 @@ export const RuntimeEventDetails: FC<{
{t('runtimeEvent.fields.owner')}
- {addressSwitchOption === AddressSwitchOption.Oasis && ( - - )}
{t('runtimeEvent.fields.amount')}
@@ -229,14 +226,10 @@ export const RuntimeEventDetails: FC<{
{t('common.from')}
- {addressSwitchOption === AddressSwitchOption.Oasis && ( - - )}
{t('common.to')}
- {addressSwitchOption === AddressSwitchOption.Oasis && }
{t('runtimeEvent.fields.amount')}
@@ -257,14 +250,10 @@ export const RuntimeEventDetails: FC<{
{t('common.from')}
- {addressSwitchOption === AddressSwitchOption.Oasis && ( - - )}
{t('common.to')}
- {addressSwitchOption === AddressSwitchOption.Oasis && }
{t('runtimeEvent.fields.amount')}
@@ -285,14 +274,10 @@ export const RuntimeEventDetails: FC<{
{t('common.from')}
- {addressSwitchOption === AddressSwitchOption.Oasis && ( - - )}
{t('common.to')}
- {addressSwitchOption === AddressSwitchOption.Oasis && }
{t('runtimeEvent.fields.activeShares')}
@@ -312,14 +297,10 @@ export const RuntimeEventDetails: FC<{
{t('common.from')}
- {addressSwitchOption === AddressSwitchOption.Oasis && ( - - )}
{t('common.to')}
- {addressSwitchOption === AddressSwitchOption.Oasis && }
{t('runtimeEvent.fields.amount')}
diff --git a/src/app/components/RuntimeEvents/RuntimeEventsDetailedList.tsx b/src/app/components/RuntimeEvents/RuntimeEventsDetailedList.tsx index 705c0bff5..80535f561 100644 --- a/src/app/components/RuntimeEvents/RuntimeEventsDetailedList.tsx +++ b/src/app/components/RuntimeEvents/RuntimeEventsDetailedList.tsx @@ -3,7 +3,7 @@ import { SearchScope } from '../../../types/searchScope' import { RuntimeEvent } from '../../../oasis-nexus/api' import { AddressSwitchOption } from '../AddressSwitch' import { useTranslation } from 'react-i18next' -import { CardEmptyState } from '../../components/CardEmptyState' +import { CardEmptyState } from '../CardEmptyState' import { TextSkeleton } from '../Skeleton' import { RuntimeEventDetails } from './RuntimeEventDetails' import Divider from '@mui/material/Divider' From b121d8ff885ab7609dedbc2a7c8d2db0e3b5ba78 Mon Sep 17 00:00:00 2001 From: Matej Lubej Date: Thu, 4 Apr 2024 06:43:48 +0200 Subject: [PATCH 2/6] Add AccountLinkWithAddressSwitch component --- src/app/components/Account/AccountLink.tsx | 6 ++- .../Account/AccountLinkWithAddressSwitch.tsx | 4 ++ .../components/Account/withAddressSwitch.tsx | 53 +++++++++++++++++++ 3 files changed, 61 insertions(+), 2 deletions(-) create mode 100644 src/app/components/Account/AccountLinkWithAddressSwitch.tsx create mode 100644 src/app/components/Account/withAddressSwitch.tsx diff --git a/src/app/components/Account/AccountLink.tsx b/src/app/components/Account/AccountLink.tsx index 5ae1e50ea..1ede192a6 100644 --- a/src/app/components/Account/AccountLink.tsx +++ b/src/app/components/Account/AccountLink.tsx @@ -7,11 +7,13 @@ import { RouteUtils } from '../../utils/route-utils' import Typography from '@mui/material/Typography' import { SearchScope } from '../../../types/searchScope' -export const AccountLink: FC<{ +interface AccountLinkProps { scope: SearchScope address: string alwaysTrim?: boolean -}> = ({ scope, address, alwaysTrim }) => { +} + +export const AccountLink: FC = ({ scope, address, alwaysTrim }) => { const { isTablet } = useScreenSize() const to = RouteUtils.getAccountRoute(scope, address) return ( diff --git a/src/app/components/Account/AccountLinkWithAddressSwitch.tsx b/src/app/components/Account/AccountLinkWithAddressSwitch.tsx new file mode 100644 index 000000000..91c7ece86 --- /dev/null +++ b/src/app/components/Account/AccountLinkWithAddressSwitch.tsx @@ -0,0 +1,4 @@ +import { AccountLink } from './AccountLink' +import { withAddressSwitch } from './withAddressSwitch' + +export const AccountLinkWithAddressSwitch = withAddressSwitch(AccountLink) diff --git a/src/app/components/Account/withAddressSwitch.tsx b/src/app/components/Account/withAddressSwitch.tsx new file mode 100644 index 000000000..c20ac427a --- /dev/null +++ b/src/app/components/Account/withAddressSwitch.tsx @@ -0,0 +1,53 @@ +import { FunctionComponent } from 'react' +import { AddressSwitchOption } from '../AddressSwitch' +import { CopyToClipboard } from '../CopyToClipboard' +import Tooltip from '@mui/material/Tooltip' +import Box from '@mui/material/Box' +import InfoIcon from '@mui/icons-material/Info' + +interface WithAddressSwitchProps { + addressSwitchOption: AddressSwitchOption + ethAddress?: string + oasisAddress?: string +} + +interface WrappedComponentBaseProps { + address?: string +} + +export const withAddressSwitch = + ( + Component: FunctionComponent, + ): FunctionComponent => + (props: T & WithAddressSwitchProps) => { + const { addressSwitchOption, address, ethAddress, oasisAddress, ...restProps } = props + + const isOasisAddressFormat = addressSwitchOption === AddressSwitchOption.Oasis + const addressMatchingType = isOasisAddressFormat ? oasisAddress : ethAddress + const defaultAddress = addressMatchingType ?? address + + return ( + <> + + + {/* TODO: Replace with translations, text to be decided?, should be probably an input to this generic withAddressSwitch */} + {addressMatchingType + ? isOasisAddressFormat + ? 'Oasis address' + : 'Ethereum address' + : 'Address not available in the expected type'} + + } + > + + + + + {defaultAddress && } + + ) + } From 720a642a60704170c801743aeb906a33e8f74df5 Mon Sep 17 00:00:00 2001 From: Matej Lubej Date: Thu, 4 Apr 2024 06:44:50 +0200 Subject: [PATCH 3/6] Replace AccountLink with AccountLinkWithAddressSwitch --- .../RuntimeEvents/RuntimeEventDetails.tsx | 73 ++++++++++++++++--- 1 file changed, 64 insertions(+), 9 deletions(-) diff --git a/src/app/components/RuntimeEvents/RuntimeEventDetails.tsx b/src/app/components/RuntimeEvents/RuntimeEventDetails.tsx index b9feda335..6c4ef7033 100644 --- a/src/app/components/RuntimeEvents/RuntimeEventDetails.tsx +++ b/src/app/components/RuntimeEvents/RuntimeEventDetails.tsx @@ -29,6 +29,7 @@ import { UndelegateStartIcon } from '../CustomIcons/UndelegateStart' import { UndelegateFinishIcon } from '../CustomIcons/UndelegateFinish' import { DelegateIcon } from '../CustomIcons/Delegate' import { MaybeEventErrorLine } from './EventError' +import { AccountLinkWithAddressSwitch } from '../Account/AccountLinkWithAddressSwitch' export const EventTypeIcon: FC<{ eventType: RuntimeEventType @@ -203,7 +204,13 @@ export const RuntimeEventDetails: FC<{
{t('runtimeEvent.fields.owner')}
- +
{t('runtimeEvent.fields.amount')}
@@ -225,11 +232,23 @@ export const RuntimeEventDetails: FC<{
{t('common.from')}
- +
{t('common.to')}
- +
{t('runtimeEvent.fields.amount')}
@@ -249,11 +268,23 @@ export const RuntimeEventDetails: FC<{
{t('common.from')}
- +
{t('common.to')}
- +
{t('runtimeEvent.fields.amount')}
@@ -273,11 +304,23 @@ export const RuntimeEventDetails: FC<{
{t('common.from')}
- +
{t('common.to')}
- +
{t('runtimeEvent.fields.activeShares')}
@@ -296,11 +339,23 @@ export const RuntimeEventDetails: FC<{
{t('common.from')}
- +
{t('common.to')}
- +
{t('runtimeEvent.fields.amount')}
From 41492bec4a1b534e458fc64f787f3af3e99be6c6 Mon Sep 17 00:00:00 2001 From: Matej Lubej Date: Thu, 4 Apr 2024 06:49:19 +0200 Subject: [PATCH 4/6] Add changelog --- .changelog/1364.bugfix.md | 1 + 1 file changed, 1 insertion(+) create mode 100644 .changelog/1364.bugfix.md diff --git a/.changelog/1364.bugfix.md b/.changelog/1364.bugfix.md new file mode 100644 index 000000000..583ebb759 --- /dev/null +++ b/.changelog/1364.bugfix.md @@ -0,0 +1 @@ +Display EVM addresses in events From 4df99a79dedb5b17107eae71d671a1dc47f2119a Mon Sep 17 00:00:00 2001 From: Matej Lubej Date: Fri, 5 Apr 2024 19:21:44 +0200 Subject: [PATCH 5/6] Remove address prop from AccountLinkWithAddressSwitch - refactor address variables in withAddressSwitch --- src/app/components/Account/AccountLink.tsx | 4 +-- .../components/Account/withAddressSwitch.tsx | 27 ++++++++++--------- .../RuntimeEvents/RuntimeEventDetails.tsx | 9 ------- 3 files changed, 16 insertions(+), 24 deletions(-) diff --git a/src/app/components/Account/AccountLink.tsx b/src/app/components/Account/AccountLink.tsx index 1ede192a6..ddffd1e84 100644 --- a/src/app/components/Account/AccountLink.tsx +++ b/src/app/components/Account/AccountLink.tsx @@ -7,13 +7,13 @@ import { RouteUtils } from '../../utils/route-utils' import Typography from '@mui/material/Typography' import { SearchScope } from '../../../types/searchScope' -interface AccountLinkProps { +interface Props { scope: SearchScope address: string alwaysTrim?: boolean } -export const AccountLink: FC = ({ scope, address, alwaysTrim }) => { +export const AccountLink: FC = ({ scope, address, alwaysTrim }) => { const { isTablet } = useScreenSize() const to = RouteUtils.getAccountRoute(scope, address) return ( diff --git a/src/app/components/Account/withAddressSwitch.tsx b/src/app/components/Account/withAddressSwitch.tsx index c20ac427a..67fc76470 100644 --- a/src/app/components/Account/withAddressSwitch.tsx +++ b/src/app/components/Account/withAddressSwitch.tsx @@ -1,4 +1,4 @@ -import { FunctionComponent } from 'react' +import { FC } from 'react' import { AddressSwitchOption } from '../AddressSwitch' import { CopyToClipboard } from '../CopyToClipboard' import Tooltip from '@mui/material/Tooltip' @@ -16,15 +16,16 @@ interface WrappedComponentBaseProps { } export const withAddressSwitch = - ( - Component: FunctionComponent, - ): FunctionComponent => - (props: T & WithAddressSwitchProps) => { - const { addressSwitchOption, address, ethAddress, oasisAddress, ...restProps } = props + (Component: FC) => + (props: Omit & WithAddressSwitchProps) => { + const { addressSwitchOption, ethAddress, oasisAddress, ...restProps } = props - const isOasisAddressFormat = addressSwitchOption === AddressSwitchOption.Oasis - const addressMatchingType = isOasisAddressFormat ? oasisAddress : ethAddress - const defaultAddress = addressMatchingType ?? address + const addressesByType = { + [AddressSwitchOption.Oasis]: oasisAddress, + [AddressSwitchOption.ETH]: ethAddress, + } + const hasAddressOfExpectedType = !!addressesByType[addressSwitchOption] + const displayedAddress = addressesByType[addressSwitchOption] ?? ethAddress ?? oasisAddress return ( <> @@ -35,8 +36,8 @@ export const withAddressSwitch = {/* TODO: Replace with translations, text to be decided?, should be probably an input to this generic withAddressSwitch */} - {addressMatchingType - ? isOasisAddressFormat + {hasAddressOfExpectedType + ? oasisAddress ? 'Oasis address' : 'Ethereum address' : 'Address not available in the expected type'} @@ -44,10 +45,10 @@ export const withAddressSwitch = } > - + - {defaultAddress && } + {displayedAddress && } ) } diff --git a/src/app/components/RuntimeEvents/RuntimeEventDetails.tsx b/src/app/components/RuntimeEvents/RuntimeEventDetails.tsx index 6c4ef7033..6ef733bb8 100644 --- a/src/app/components/RuntimeEvents/RuntimeEventDetails.tsx +++ b/src/app/components/RuntimeEvents/RuntimeEventDetails.tsx @@ -205,7 +205,6 @@ export const RuntimeEventDetails: FC<{
{t('runtimeEvent.fields.owner')}
{t('common.from')}
{t('common.to')}
{t('common.from')}
{t('common.to')}
{t('common.from')}
{t('common.to')}
{t('common.from')}
{t('common.to')}
Date: Fri, 5 Apr 2024 21:42:40 +0200 Subject: [PATCH 6/6] Remove Tooltip from withAddressSwitch --- .../components/Account/withAddressSwitch.tsx | 24 +------------------ 1 file changed, 1 insertion(+), 23 deletions(-) diff --git a/src/app/components/Account/withAddressSwitch.tsx b/src/app/components/Account/withAddressSwitch.tsx index 67fc76470..c1b29b1c6 100644 --- a/src/app/components/Account/withAddressSwitch.tsx +++ b/src/app/components/Account/withAddressSwitch.tsx @@ -1,9 +1,6 @@ import { FC } from 'react' import { AddressSwitchOption } from '../AddressSwitch' import { CopyToClipboard } from '../CopyToClipboard' -import Tooltip from '@mui/material/Tooltip' -import Box from '@mui/material/Box' -import InfoIcon from '@mui/icons-material/Info' interface WithAddressSwitchProps { addressSwitchOption: AddressSwitchOption @@ -24,30 +21,11 @@ export const withAddressSwitch = [AddressSwitchOption.Oasis]: oasisAddress, [AddressSwitchOption.ETH]: ethAddress, } - const hasAddressOfExpectedType = !!addressesByType[addressSwitchOption] const displayedAddress = addressesByType[addressSwitchOption] ?? ethAddress ?? oasisAddress return ( <> - - - {/* TODO: Replace with translations, text to be decided?, should be probably an input to this generic withAddressSwitch */} - {hasAddressOfExpectedType - ? oasisAddress - ? 'Oasis address' - : 'Ethereum address' - : 'Address not available in the expected type'} - - } - > - - - - + {displayedAddress && } )