Merge pull request #439 from trezor/feature/sort-coin-menu

Feature/Sort coin menu
pull/433/head^2
Vladimir Volek 5 years ago committed by GitHub
commit 1cee291173
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

@ -1,6 +1,7 @@
{ {
"networks": [ "networks": [
{ {
"order": 2,
"type": "ethereum", "type": "ethereum",
"name": "Ethereum", "name": "Ethereum",
"symbol": "ETH", "symbol": "ETH",
@ -21,6 +22,7 @@
} }
}, },
{ {
"order": 18,
"type": "ethereum", "type": "ethereum",
"name": "Ethereum Classic", "name": "Ethereum Classic",
"symbol": "ETC", "symbol": "ETC",
@ -40,7 +42,8 @@
"address": "https://gastracker.io/addr/" "address": "https://gastracker.io/addr/"
} }
}, },
{ {
"order": 2,
"type": "ethereum", "type": "ethereum",
"name": "Ethereum Ropsten", "name": "Ethereum Ropsten",
"testnet": true, "testnet": true,
@ -74,6 +77,7 @@
} }
}, },
{ {
"order": 3,
"type": "ripple", "type": "ripple",
"name": "Ripple", "name": "Ripple",
"symbol": "XRP", "symbol": "XRP",
@ -94,6 +98,7 @@
} }
}, },
{ {
"order": 3,
"type": "ripple", "type": "ripple",
"name": "Ripple Testnet", "name": "Ripple Testnet",
"testnet": true, "testnet": true,

@ -3,69 +3,82 @@ export default [
id: 'btc', id: 'btc',
coinName: 'Bitcoin', coinName: 'Bitcoin',
url: '../?coin=btc', url: '../?coin=btc',
order: 1,
}, },
{ {
id: 'bch', id: 'bch',
coinName: 'Bitcoin Cash', coinName: 'Bitcoin Cash',
url: '../?coin=bch', url: '../?coin=bch',
order: 6,
}, },
{ {
id: 'btg', id: 'btg',
coinName: 'Bitcoin Gold', coinName: 'Bitcoin Gold',
url: '../?coin=btg', url: '../?coin=btg',
order: 27,
}, },
{ {
id: 'dash', id: 'dash',
coinName: 'Dash', coinName: 'Dash',
url: '../?coin=dash', url: '../?coin=dash',
order: 15,
}, },
{ {
id: 'dgb', id: 'dgb',
coinName: 'DigiByte', coinName: 'DigiByte',
url: '../?coin=dgb', url: '../?coin=dgb',
order: 42,
}, },
{ {
id: 'doge', id: 'doge',
coinName: 'Dogecoin', coinName: 'Dogecoin',
url: '../?coin=doge', url: '../?coin=doge',
order: 26,
}, },
{ {
id: 'ltc', id: 'ltc',
coinName: 'Litecoin', coinName: 'Litecoin',
url: '../?coin=ltc', url: '../?coin=ltc',
order: 5,
}, },
{ {
id: 'nmc', id: 'nmc',
coinName: 'Namecoin', coinName: 'Namecoin',
url: '../?coin=nmc', url: '../?coin=nmc',
order: 255,
}, },
{ {
id: 'vtc', id: 'vtc',
coinName: 'Vertcoin', coinName: 'Vertcoin',
url: '../?coin=vtc', url: '../?coin=vtc',
order: 154,
}, },
{ {
id: 'zec', id: 'zec',
coinName: 'Zcash', coinName: 'Zcash',
url: '../?coin=zec', url: '../?coin=zec',
order: 20,
}, },
{ {
id: 'xem', id: 'xem',
coinName: 'NEM', coinName: 'NEM',
url: 'https://nem.io/downloads/', url: 'https://nem.io/downloads/',
external: true, external: true,
order: 19,
}, },
{ {
id: 'xlm', id: 'xlm',
coinName: 'Stellar', coinName: 'Stellar',
url: 'https://trezor.io/stellar', url: 'https://trezor.io/stellar',
external: true, external: true,
order: 9,
}, },
{ {
id: 'ada', id: 'ada',
coinName: 'Cardano', coinName: 'Cardano',
url: 'https://adalite.io/app', url: 'https://adalite.io/app',
external: true, external: true,
order: 12,
}, },
{ {
id: 'xtz', id: 'xtz',

@ -13,6 +13,7 @@ type NetworkFeeLevel = {
}; };
export type Network = { export type Network = {
order: number,
type: string, type: string,
name: string, name: string,
testnet?: boolean, testnet?: boolean,

@ -37,55 +37,59 @@ class CoinMenu extends PureComponent<Props> {
} }
getOtherCoins() { getOtherCoins() {
return coins.map(coin => { return coins
const row = ( .sort((a, b) => a.order - b.order)
<RowCoin .map(coin => {
network={{ const row = (
name: coin.coinName, <RowCoin
shortcut: coin.id, network={{
}} name: coin.coinName,
iconRight={{ shortcut: coin.id,
type: ICONS.SKIP, }}
color: colors.TEXT_SECONDARY, iconRight={{
size: 27, type: ICONS.SKIP,
}} color: colors.TEXT_SECONDARY,
/> size: 27,
); }}
/>
);
if (coin.external) if (coin.external)
return (
<ExternalWallet
key={coin.id}
onClick={() => this.props.gotoExternalWallet(coin.id, coin.url)}
>
{row}
</ExternalWallet>
);
return ( return (
<ExternalWallet <Link key={coin.id} href={coin.url} target="_top">
key={coin.id}
onClick={() => this.props.gotoExternalWallet(coin.id, coin.url)}
>
{row} {row}
</ExternalWallet> </Link>
); );
return ( });
<Link key={coin.id} href={coin.url} target="_top">
{row}
</Link>
);
});
} }
render() { render() {
const { config } = this.props.localStorage; const { config } = this.props.localStorage;
return ( return (
<Wrapper data-test="Main__page__coin__menu"> <Wrapper data-test="Main__page__coin__menu">
{config.networks.map(item => ( {config.networks
<NavLink .sort((a, b) => a.order - b.order)
key={item.shortcut} .map(item => (
to={`${this.getBaseUrl()}/network/${item.shortcut}/account/0`} <NavLink
> key={item.shortcut}
<RowCoin to={`${this.getBaseUrl()}/network/${item.shortcut}/account/0`}
network={{ >
name: item.name, <RowCoin
shortcut: item.shortcut, network={{
}} name: item.name,
/> shortcut: item.shortcut,
</NavLink> }}
))} />
</NavLink>
))}
<Divider <Divider
testId="Main__page__coin__menu__divider" testId="Main__page__coin__menu__divider"
textLeft={<FormattedMessage {...l10nMessages.TR_OTHER_COINS} />} textLeft={<FormattedMessage {...l10nMessages.TR_OTHER_COINS} />}

Loading…
Cancel
Save