Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[REF] simplify adding new chains - 01 #430

Merged
merged 1 commit into from
Oct 3, 2022
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
20 changes: 12 additions & 8 deletions src/components/list/CurrencySelectionRow.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -36,7 +36,7 @@ export type CurrencySelectionRowProps = {
description?: string;
hideCheckbox?: boolean;
selectionMode?: CurrencySelectionMode;
onToggle?: (currencyAbbreviation: string) => void;
onToggle?: (currencyAbbreviation: string, chain: string) => void;
onViewAllTokensPressed?: (
currency: CurrencySelectionItem,
tokens: CurrencySelectionItem[],
Expand Down Expand Up @@ -149,7 +149,7 @@ interface TokenSelectionRowProps {
token: CurrencySelectionItem;
hideCheckbox?: boolean;
selectionMode?: CurrencySelectionMode;
onToggle?: (currencyAbbreviation: string) => any;
onToggle?: (currencyAbbreviation: string, chain: string) => any;
hideArrow?: boolean;
badgeUri?: string | ((props?: any) => ReactElement);
}
Expand All @@ -170,7 +170,7 @@ export const TokenSelectionRow: React.VFC<TokenSelectionRowProps> = memo(
return (
<FlexRow
style={{marginBottom: 24}}
onPress={() => onToggle?.(token.currencyAbbreviation)}>
onPress={() => onToggle?.(token.currencyAbbreviation, token.chain)}>
{!hideArrow ? (
<CurrencyColumn style={{marginRight: 16}}>
<NestedArrowIcon />
Expand Down Expand Up @@ -199,7 +199,9 @@ export const TokenSelectionRow: React.VFC<TokenSelectionRowProps> = memo(
checked={!!token.selected}
radio={selectionMode === 'single'}
disabled={!!token.disabled}
onPress={() => onToggle?.(token.currencyAbbreviation)}
onPress={() =>
onToggle?.(token.currencyAbbreviation, token.chain)
}
/>
</CurrencyColumn>
) : null}
Expand Down Expand Up @@ -228,9 +230,9 @@ const CurrencySelectionRow: React.VFC<CurrencySelectionRowProps> = ({
const {t} = useTranslation();
const {currencyName} = currency;
const onPress = useCallback(
(currencyAbbreviation: string): void => {
(currencyAbbreviation: string, chain: string): void => {
haptic(IS_ANDROID ? 'keyboardPress' : 'impactLight');
onToggle?.(currencyAbbreviation);
onToggle?.(currencyAbbreviation, chain);
},
[onToggle],
);
Expand All @@ -239,7 +241,7 @@ const CurrencySelectionRow: React.VFC<CurrencySelectionRowProps> = ({
<CurrencySelectionRowContainer>
<ChainSelectionRow
currency={currency}
onToggle={() => onPress(currency.currencyAbbreviation)}
onToggle={() => onPress(currency.currencyAbbreviation, currency.chain)}
hideCheckbox={hideCheckbox}
selectionMode={selectionMode}
/>
Expand All @@ -256,7 +258,9 @@ const CurrencySelectionRow: React.VFC<CurrencySelectionRowProps> = ({
<TokenSelectionRow
key={token.id}
token={token}
onToggle={() => onPress(token.currencyAbbreviation)}
onToggle={() => {
onPress(token.currencyAbbreviation, token.chain);
}}
hideCheckbox={hideCheckbox}
selectionMode={selectionMode}
/>
Expand Down
26 changes: 22 additions & 4 deletions src/constants/SupportedCurrencyOptions.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -15,17 +15,20 @@ import ShibIcon from '../../assets/img/currencies/shib.svg';
import ApeIcon from '../../assets/img/currencies/ape.svg';
import EurocIcon from '../../assets/img/currencies/euroc.svg';
import {ImageSourcePropType} from 'react-native';
import {orderBy} from 'lodash';

export interface SupportedCurrencyOption {
id: string;
img: string | ((props?: any) => ReactElement);
currencyName: string;
hasMultisig?: boolean;
currencyAbbreviation: string;
chain?: string;
isToken?: boolean;
imgSrc?: ImageSourcePropType;
badgeUri?: string | ((props?: any) => ReactElement);
badgeSrc?: ImageSourcePropType;
priority?: number;
}

export const CurrencyListIcons: {
Expand All @@ -52,6 +55,7 @@ export const SupportedUtxoCurrencyOptions: Array<SupportedCurrencyOption> = [
{
id: Math.random().toString(),
img: CurrencyListIcons.btc,
priority: 1,
currencyName: 'Bitcoin',
currencyAbbreviation: 'btc',
hasMultisig: true,
Expand All @@ -60,6 +64,7 @@ export const SupportedUtxoCurrencyOptions: Array<SupportedCurrencyOption> = [
{
id: Math.random().toString(),
img: CurrencyListIcons.bch,
priority: 2,
currencyName: 'Bitcoin Cash',
currencyAbbreviation: 'bch',
hasMultisig: true,
Expand All @@ -68,6 +73,7 @@ export const SupportedUtxoCurrencyOptions: Array<SupportedCurrencyOption> = [
{
id: Math.random().toString(),
img: CurrencyListIcons.doge,
priority: 3,
currencyName: 'Dogecoin',
currencyAbbreviation: 'doge',
hasMultisig: true,
Expand All @@ -77,13 +83,15 @@ export const SupportedUtxoCurrencyOptions: Array<SupportedCurrencyOption> = [
id: Math.random().toString(),
img: CurrencyListIcons.ltc,
currencyName: 'Litecoin',
priority: 5,
currencyAbbreviation: 'ltc',
hasMultisig: true,
imgSrc: require('../../assets/img/currencies/png/LTC.png'),
},
{
id: Math.random().toString(),
img: CurrencyListIcons.xrp,
priority: 6,
currencyName: 'XRP',
currencyAbbreviation: 'xrp',
imgSrc: require('../../assets/img/currencies/png/XRP.png'),
Expand All @@ -93,6 +101,7 @@ export const SupportedUtxoCurrencyOptions: Array<SupportedCurrencyOption> = [
export const SupportedEvmCurrencyOptions: Array<SupportedCurrencyOption> = [
{
id: Math.random().toString(),
priority: 4,
img: CurrencyListIcons.eth,
currencyName: 'Ethereum',
currencyAbbreviation: 'eth',
Expand All @@ -107,6 +116,7 @@ export const SupportedTokenOptions: Array<SupportedCurrencyOption> = [
img: CurrencyListIcons.usdc_e,
currencyName: 'USD Coin',
currencyAbbreviation: 'usdc',
chain: 'eth',
isToken: true,
imgSrc: require('../../assets/img/currencies/png/USDC.png'),
badgeSrc: require('../../assets/img/currencies/png/ETH.png'),
Expand All @@ -117,6 +127,7 @@ export const SupportedTokenOptions: Array<SupportedCurrencyOption> = [
img: CurrencyListIcons.ape_e,
currencyName: 'ApeCoin',
currencyAbbreviation: 'ape',
chain: 'eth',
isToken: true,
imgSrc: require('../../assets/img/currencies/png/APE.png'),
badgeSrc: require('../../assets/img/currencies/png/ETH.png'),
Expand All @@ -127,6 +138,7 @@ export const SupportedTokenOptions: Array<SupportedCurrencyOption> = [
img: CurrencyListIcons.euroc_e,
currencyName: 'Euro Coin',
currencyAbbreviation: 'euroc',
chain: 'eth',
isToken: true,
imgSrc: require('../../assets/img/currencies/png/EUROC.png'),
badgeSrc: require('../../assets/img/currencies/png/ETH.png'),
Expand All @@ -137,6 +149,7 @@ export const SupportedTokenOptions: Array<SupportedCurrencyOption> = [
img: CurrencyListIcons.shib_e,
currencyName: 'Shiba Inu',
currencyAbbreviation: 'shib',
chain: 'eth',
isToken: true,
imgSrc: require('../../assets/img/currencies/png/SHIB.png'),
badgeSrc: require('../../assets/img/currencies/png/ETH.png'),
Expand All @@ -147,6 +160,7 @@ export const SupportedTokenOptions: Array<SupportedCurrencyOption> = [
img: CurrencyListIcons.gusd_e,
currencyName: 'Gemini Dollar',
currencyAbbreviation: 'gusd',
chain: 'eth',
isToken: true,
imgSrc: require('../../assets/img/currencies/png/GUSD.png'),
badgeSrc: require('../../assets/img/currencies/png/ETH.png'),
Expand All @@ -157,6 +171,7 @@ export const SupportedTokenOptions: Array<SupportedCurrencyOption> = [
img: CurrencyListIcons.busd_e,
currencyName: 'Binance USD Coin',
currencyAbbreviation: 'busd',
chain: 'eth',
isToken: true,
imgSrc: require('../../assets/img/currencies/png/BUSD.png'),
badgeSrc: require('../../assets/img/currencies/png/ETH.png'),
Expand All @@ -167,6 +182,7 @@ export const SupportedTokenOptions: Array<SupportedCurrencyOption> = [
img: CurrencyListIcons.dai_e,
currencyName: 'Dai',
currencyAbbreviation: 'dai',
chain: 'eth',
isToken: true,
imgSrc: require('../../assets/img/currencies/png/DAI.png'),
badgeSrc: require('../../assets/img/currencies/png/ETH.png'),
Expand All @@ -177,6 +193,7 @@ export const SupportedTokenOptions: Array<SupportedCurrencyOption> = [
img: CurrencyListIcons.usdp_e,
currencyName: 'Pax Dollar',
currencyAbbreviation: 'usdp',
chain: 'eth',
isToken: true,
imgSrc: require('../../assets/img/currencies/png/USDP.png'),
badgeSrc: require('../../assets/img/currencies/png/ETH.png'),
Expand All @@ -187,17 +204,18 @@ export const SupportedTokenOptions: Array<SupportedCurrencyOption> = [
img: CurrencyListIcons.wbtc_e,
currencyName: 'Wrapped Bitcoin',
currencyAbbreviation: 'wbtc',
chain: 'eth',
isToken: true,
imgSrc: require('../../assets/img/currencies/png/WBTC.png'),
badgeSrc: require('../../assets/img/currencies/png/ETH.png'),
badgeUri: CurrencyListIcons.eth,
},
];

export const SupportedCoinsOptions: Array<SupportedCurrencyOption> = [
...SupportedUtxoCurrencyOptions,
...SupportedEvmCurrencyOptions,
];
export const SupportedCoinsOptions: Array<SupportedCurrencyOption> = orderBy(
[...SupportedUtxoCurrencyOptions, ...SupportedEvmCurrencyOptions],
'priority',
);

export const SupportedCurrencyOptions: Array<SupportedCurrencyOption> = [
...SupportedCoinsOptions,
Expand Down
8 changes: 2 additions & 6 deletions src/constants/config.ts
Original file line number Diff line number Diff line change
Expand Up @@ -43,16 +43,12 @@ export const DOWNLOAD_BITPAY_URL = 'https://bitpay.com/wallet';
export const TWO_FACTOR_EMAIL_POLL_INTERVAL = 1000 * 3;
export const TWO_FACTOR_EMAIL_POLL_TIMEOUT = 1000 * 60 * 5;

// Coingecko
export const COINGECKO_BLOCKCHAIN_NETWORK = {
export const EVM_BLOCKCHAIN_NETWORK = {
eth: 'ethereum',
};

// 1Inch
export const ONEINCH_BLOCKCHAIN_ID: {[key in string]: number} = {
export const EVM_BLOCKCHAIN_ID: {[key in string]: number} = {
eth: 1,
// TODO MATIC
// matic: 137,
};

export const EVM_BLOCKCHAIN_EXPLORERS: {[key in string]: any} = {
Expand Down
4 changes: 2 additions & 2 deletions src/constants/currencies.ts
Original file line number Diff line number Diff line change
Expand Up @@ -618,7 +618,6 @@ export const BitpaySupportedEvmCoins: {[key in string]: CurrencyOpts} = {

export const BitpaySupportedTokens: {[key in string]: CurrencyOpts} = {
...BitpaySupportedEthereumTokens,
// TODO MATIC
};

export const BitpaySupportedCoins: {[key in string]: CurrencyOpts} = {
Expand All @@ -635,6 +634,7 @@ export const SUPPORTED_EVM_COINS = Object.keys(BitpaySupportedEvmCoins);
export const SUPPORTED_ETHEREUM_TOKENS = Object.keys(
BitpaySupportedEthereumTokens,
);
// TODO MATIC
export const SUPPORTED_TOKENS = [...SUPPORTED_ETHEREUM_TOKENS];

export const SUPPORTED_COINS = Object.keys(BitpaySupportedCoins);
export const SUPPORTED_CURRENCIES = Object.keys(BitpaySupportedCurrencies);
10 changes: 9 additions & 1 deletion src/constants/tokens.ts
Original file line number Diff line number Diff line change
Expand Up @@ -48,7 +48,7 @@ export const BitpaySupportedEthereumTokenOpts: TokenOptsType = {
wbtc_e: {
name: 'Wrapped Bitcoin',
symbol: 'WBTC',
decimals: 9,
decimals: 8,
address: '0x2260fac5e5542a773aa44fbcfedf7c193bc2c599',
},
shib_e: {
Expand All @@ -71,6 +71,10 @@ export const BitpaySupportedEthereumTokenOpts: TokenOptsType = {
},
};

export const BitpaySupportedTokenOpts: TokenOptsType = {
...BitpaySupportedEthereumTokenOpts,
};

export const BitpaySupportedEthereumTokenOptsByAddress: TokenOptsType = {
'0xa0b86991c6218b36c1d19d4a2e9eb0ce3606eb48_e': {
name: 'USD Coin',
Expand Down Expand Up @@ -127,3 +131,7 @@ export const BitpaySupportedEthereumTokenOptsByAddress: TokenOptsType = {
address: '0x1aBaEA1f7C830bD89Acc67eC4af516284b1bC33c',
},
};

export const BitpaySupportedTokenOptsByAddress: TokenOptsType = {
...BitpaySupportedEthereumTokenOptsByAddress,
};
22 changes: 16 additions & 6 deletions src/navigation/tabs/contacts/components/ContactIcon.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -8,9 +8,12 @@ import {CurrencyImage} from '../../../../components/currency-image/CurrencyImage
import {SUPPORTED_CURRENCIES} from '../../../../constants/currencies';
import {useAppSelector} from '../../../../utils/hooks';
import {RootState} from '../../../../store';
import {BitpaySupportedEthereumTokenOpts} from '../../../../constants/tokens';
import {BitpaySupportedTokenOpts} from '../../../../constants/tokens';
import {Token} from '../../../../store/wallet/wallet.models';
import {getCurrencyAbbreviation} from '../../../../utils/helper-methods';
import {
getBadgeImg,
getCurrencyAbbreviation,
} from '../../../../utils/helper-methods';

interface ContactIconProps {
size?: number;
Expand All @@ -21,6 +24,7 @@ interface ContactIconProps {

interface BadgeProps {
img: string | ((props?: any) => ReactElement);
badgeImg: string | ((props?: any) => ReactElement);
size?: number;
}

Expand All @@ -34,10 +38,10 @@ const CoinBadgeContainer = styled.View`
bottom: -1px;
`;

const CoinBadge: React.FC<BadgeProps> = ({size = 20, img}) => {
const CoinBadge: React.FC<BadgeProps> = ({size = 20, img, badgeImg}) => {
return (
<CoinBadgeContainer>
<CurrencyImage img={img} size={size} />
<CurrencyImage img={img} badgeUri={badgeImg} size={size} />
</CoinBadgeContainer>
);
};
Expand All @@ -50,7 +54,7 @@ const ContactIcon: React.FC<ContactIconProps> = ({
}) => {
const tokenOptions = useAppSelector(({WALLET}: RootState) => {
return {
...BitpaySupportedEthereumTokenOpts,
...BitpaySupportedTokenOpts,
...WALLET.tokenOptions,
...WALLET.customTokenOptions,
};
Expand All @@ -64,7 +68,13 @@ const ContactIcon: React.FC<ContactIconProps> = ({
? (tokenOptions[getCurrencyAbbreviation(coin, chain)].logoURI as string)
: '';

const badge = coin ? <CoinBadge size={size / 2.5} img={img} /> : null;
const badge = coin ? (
<CoinBadge
size={size / 2.5}
img={img}
badgeImg={getBadgeImg(coin, chain)}
/>
) : null;
const initials = name
? name
.trim()
Expand Down
Loading