Feature: advanced custom rpc (#661)

* add rpc target chainid ticker and nickname * use network nickname * add isETH * use of ticker * move settings component to settings * basic networks settings * basic network settings * add and edit forms * adding custom rpc from network settings * add block explorer url * handle action anabled * validate chainid * doc and locales Q * drawer view in blockexplorer * handle block explorer from tx detauls * handle tx unit with ticker * configure native currency * if no conversion rate shpiw 0 * handle send from drawer * handle render from wei * handle eth input * action keys * update snapshots * create snapshots * more locales * conditional rpc rendering in networks sett * network icon top * ticker to uppercase * android ui * small fixes * more android * getticker getblockexoplorer * parse url name * bump gaba
MetaMask · May 23, 2019 · cceaa14 · cceaa14
1 parent 44a67e2
commit cceaa14
Show file tree

Hide file tree

Showing 56 changed files with 2,284 additions and 503 deletions.
diff --git a/app/components/Nav/App/__snapshots__/index.test.js.snap b/app/components/Nav/App/__snapshots__/index.test.js.snap
@@ -162,6 +162,8 @@ exports[`App should render correctly 1`] = `
                       "CompanySettings": null,
                       "ExperimentalSettings": null,
                       "GeneralSettings": null,
+                      "NetworkSettings": null,
+                      "NetworksSettings": null,
                       "RevealPrivateCredentialView": null,
                       "SecuritySettings": null,
                       "Settings": null,
@@ -538,6 +540,8 @@ exports[`App should render correctly 1`] = `
                         "CompanySettings": null,
                         "ExperimentalSettings": null,
                         "GeneralSettings": null,
+                        "NetworkSettings": null,
+                        "NetworksSettings": null,
                         "RevealPrivateCredentialView": null,
                         "SecuritySettings": null,
                         "Settings": null,

diff --git a/app/components/Nav/Main/__snapshots__/index.test.js.snap b/app/components/Nav/Main/__snapshots__/index.test.js.snap
@@ -170,6 +170,8 @@ exports[`Main should render correctly 1`] = `
               "CompanySettings": null,
               "ExperimentalSettings": null,
               "GeneralSettings": null,
+              "NetworkSettings": null,
+              "NetworksSettings": null,
               "RevealPrivateCredentialView": null,
               "SecuritySettings": null,
               "Settings": null,
@@ -432,6 +434,8 @@ exports[`Main should render correctly 1`] = `
                 "CompanySettings": null,
                 "ExperimentalSettings": null,
                 "GeneralSettings": null,
+                "NetworkSettings": null,
+                "NetworksSettings": null,
                 "RevealPrivateCredentialView": null,
                 "SecuritySettings": null,
                 "Settings": null,

diff --git a/app/components/Nav/Main/index.js b/app/components/Nav/Main/index.js
@@ -12,11 +12,13 @@ import AddBookmark from '../../Views/AddBookmark';
 import SimpleWebview from '../../Views/SimpleWebview';
 import Approval from '../../Views/Approval';
 import Settings from '../../Views/Settings';
-import GeneralSettings from '../../Views/GeneralSettings';
-import AdvancedSettings from '../../Views/AdvancedSettings';
+import GeneralSettings from '../../Views/Settings/GeneralSettings';
+import AdvancedSettings from '../../Views/Settings/AdvancedSettings';
+import SecuritySettings from '../../Views/Settings/SecuritySettings';
+import ExperimentalSettings from '../../Views/Settings/ExperimentalSettings';
+import NetworksSettings from '../../Views/Settings/NetworksSettings';
+import NetworkSettings from '../../Views/Settings/NetworksSettings/NetworkSettings';
 import AppInformation from '../../UI/AppInformation';
-import SecuritySettings from '../../Views/SecuritySettings';
-import ExperimentalSettings from '../../Views/ExperimentalSettings';
 import Wallet from '../../Views/Wallet';
 import TransactionsView from '../../Views/TransactionsView';
 import SyncWithExtension from '../../Views/SyncWithExtension';
@@ -154,6 +156,12 @@ const MainNavigator = createStackNavigator(
 				ExperimentalSettings: {
 					screen: ExperimentalSettings
 				},
+				NetworksSettings: {
+					screen: NetworksSettings
+				},
+				NetworkSettings: {
+					screen: NetworkSettings
+				},
 				CompanySettings: {
 					screen: AppInformation
 				},

diff --git a/app/components/UI/AccountList/index.js b/app/components/UI/AccountList/index.js
@@ -22,6 +22,7 @@ import { toChecksumAddress } from 'ethereumjs-util';
 import Logger from '../../../util/Logger';
 import Analytics from '../../../core/Analytics';
 import ANALYTICS_EVENT_OPTS from '../../../util/analytics';
+import { getTicker } from '../../../util/transactions';
 
 const styles = StyleSheet.create({
 	wrapper: {
@@ -149,7 +150,11 @@ export default class AccountList extends Component {
 		/**
 		 * function to be called when importing an account
 		 */
-		onImportAccount: PropTypes.func
+		onImportAccount: PropTypes.func,
+		/**
+		 * Current provider ticker
+		 */
+		ticker: PropTypes.string
 	};
 
 	state = {
@@ -254,6 +259,7 @@ export default class AccountList extends Component {
 	}
 
 	renderItem = ({ item }) => {
+		const { ticker } = this.props;
 		const { index, name, address, balance, isSelected, isImported } = item;
 
 		const selected = isSelected ? <Icon name="check-circle" size={30} color={colors.blue} /> : null;
@@ -278,7 +284,7 @@ export default class AccountList extends Component {
 							{name}
 						</Text>
 						<Text style={styles.accountBalance}>
-							{renderFromWei(balance)} {strings('unit.eth')}
+							{renderFromWei(balance)} {getTicker(ticker)}
 						</Text>
 					</View>
 					{imported && <View style={styles.importedView}>{imported}</View>}

diff --git a/app/components/UI/AccountSelect/index.js b/app/components/UI/AccountSelect/index.js
@@ -8,8 +8,8 @@ import { connect } from 'react-redux';
 import { hexToBN } from 'gaba/util';
 import { toChecksumAddress } from 'ethereumjs-util';
 import { weiToFiat, renderFromWei } from '../../../util/number';
-import { strings } from '../../../../locales/i18n';
 import { ScrollView } from 'react-native-gesture-handler';
+import { getTicker } from '../../../util/transactions';
 
 const styles = StyleSheet.create({
 	root: {
@@ -126,7 +126,11 @@ class AccountSelect extends Component {
 		/**
 		 * Primary currency, either ETH or Fiat
 		 */
-		primaryCurrency: PropTypes.string
+		primaryCurrency: PropTypes.string,
+		/**
+		 * Current provider ticker
+		 */
+		ticker: PropTypes.string
 	};
 
 	static defaultProps = {
@@ -153,17 +157,17 @@ class AccountSelect extends Component {
 	}
 
 	renderOption(account, onPress) {
-		const { conversionRate, currentCurrency, primaryCurrency } = this.props;
+		const { conversionRate, currentCurrency, primaryCurrency, ticker } = this.props;
 		const balance = hexToBN(account.balance);
 
 		// render balances according to selected 'primaryCurrency'
 		let mainBalance, secondaryBalance;
 		if (primaryCurrency === 'ETH') {
-			mainBalance = renderFromWei(balance) + ' ' + strings('unit.eth');
-			secondaryBalance = weiToFiat(balance, conversionRate, currentCurrency).toUpperCase();
+			mainBalance = renderFromWei(balance) + ' ' + getTicker(ticker);
+			secondaryBalance = weiToFiat(balance, conversionRate, currentCurrency.toUpperCase());
 		} else {
-			mainBalance = weiToFiat(balance, conversionRate, currentCurrency).toUpperCase();
-			secondaryBalance = renderFromWei(balance) + ' ' + strings('unit.eth');
+			mainBalance = weiToFiat(balance, conversionRate, currentCurrency.toUpperCase());
+			secondaryBalance = renderFromWei(balance) + ' ' + getTicker(ticker);
 		}
 
 		return (
@@ -218,7 +222,8 @@ const mapStateToProps = state => ({
 	identities: state.engine.backgroundState.PreferencesController.identities,
 	currentCurrency: state.engine.backgroundState.CurrencyRateController.currentCurrency,
 	selectedAddress: state.engine.backgroundState.PreferencesController.selectedAddress,
-	primaryCurrency: state.settings.primaryCurrency
+	primaryCurrency: state.settings.primaryCurrency,
+	ticker: state.engine.backgroundState.NetworkController.provider.ticker
 });
 
 export default connect(mapStateToProps)(AccountSelect);
diff --git a/app/components/UI/AssetOverview/index.js b/app/components/UI/AssetOverview/index.js
@@ -112,7 +112,7 @@ class AssetOverview extends Component {
 
 	onSend = async () => {
 		const { asset } = this.props;
-		if (asset.symbol === 'ETH') {
+		if (asset.isEth) {
 			this.props.setTokensTransaction({ symbol: 'ETH' });
 			this.props.navigation.navigate('SendView');
 		} else {
@@ -123,9 +123,9 @@ class AssetOverview extends Component {
 
 	renderLogo = () => {
 		const {
-			asset: { address, image, logo, symbol }
+			asset: { address, image, logo, isETH }
 		} = this.props;
-		if (symbol === 'ETH') {
+		if (isETH) {
 			return <Image source={ethLogo} style={styles.ethLogo} />;
 		}
 		const watchedAsset = image !== undefined;
@@ -150,7 +150,7 @@ class AssetOverview extends Component {
 		let mainBalance, secondaryBalance;
 		const itemAddress = (asset.address && toChecksumAddress(asset.address)) || undefined;
 		let balance, balanceFiat;
-		if (asset.symbol === 'ETH') {
+		if (asset.isETH) {
 			balance = renderFromWei(accounts[selectedAddress] && accounts[selectedAddress].balance);
 			balanceFiat = weiToFiat(
 				hexToBN(accounts[selectedAddress].balance),

diff --git a/app/components/UI/CustomGas/index.js b/app/components/UI/CustomGas/index.js
@@ -14,6 +14,7 @@ import {
 import { BN } from 'ethereumjs-util';
 import { fromWei } from '../../../util/number';
 import Logger from '../../../util/Logger';
+import { getTicker } from '../../../util/transactions';
 
 const AVERAGE_GAS = 20;
 const LOW_GAS = 10;
@@ -116,7 +117,11 @@ class CustomGas extends Component {
 		/**
 		 * Callback to modify state in parent state
 		 */
-		onPress: PropTypes.func
+		onPress: PropTypes.func,
+		/**
+		 * Current provider ticker
+		 */
+		ticker: PropTypes.string
 	};
 
 	state = {
@@ -204,6 +209,10 @@ class CustomGas extends Component {
 	componentDidMount = async () => {
 		await this.handleFetchBasicEstimates();
 		this.onPressGasAverage();
+		const { ticker } = this.props;
+		if (ticker && ticker !== 'ETH') {
+			this.setState({ advancedCustomGas: true });
+		}
 	};
 
 	handleFetchBasicEstimates = async () => {
@@ -240,6 +249,7 @@ class CustomGas extends Component {
 	renderCustomGasSelector = () => {
 		const { averageGwei, fastGwei, safeLowGwei } = this.state;
 		const { conversionRate, currentCurrency, gas } = this.props;
+		const ticker = getTicker(this.props.ticker);
 		return (
 			<View style={styles.selectors}>
 				<TouchableOpacity
@@ -255,10 +265,10 @@ class CustomGas extends Component {
 						{strings('transaction.gas_fee_slow')}
 					</Text>
 					<Text style={[styles.text, { color: this.state.gasSlowSelected ? colors.white : undefined }]}>
-						{getRenderableEthGasFee(safeLowGwei, gas)} {strings('unit.eth')}
+						{getRenderableEthGasFee(safeLowGwei, gas)} {ticker}
 					</Text>
 					<Text style={[styles.text, { color: this.state.gasSlowSelected ? colors.white : undefined }]}>
-						{getRenderableFiatGasFee(safeLowGwei, conversionRate, currentCurrency, gas).toUpperCase()}
+						{getRenderableFiatGasFee(safeLowGwei, conversionRate, currentCurrency.toUpperCase(), gas)}
 					</Text>
 				</TouchableOpacity>
 				<TouchableOpacity
@@ -276,10 +286,10 @@ class CustomGas extends Component {
 						{strings('transaction.gas_fee_average')}
 					</Text>
 					<Text style={[styles.text, { color: this.state.gasAverageSelected ? colors.white : undefined }]}>
-						{getRenderableEthGasFee(averageGwei, gas)} {strings('unit.eth')}
+						{getRenderableEthGasFee(averageGwei, gas)} {ticker}
 					</Text>
 					<Text style={[styles.text, { color: this.state.gasAverageSelected ? colors.white : undefined }]}>
-						{getRenderableFiatGasFee(averageGwei, conversionRate, currentCurrency, gas).toUpperCase()}
+						{getRenderableFiatGasFee(averageGwei, conversionRate, currentCurrency.toUpperCase(), gas)}
 					</Text>
 				</TouchableOpacity>
 				<TouchableOpacity
@@ -295,10 +305,10 @@ class CustomGas extends Component {
 						{strings('transaction.gas_fee_fast')}
 					</Text>
 					<Text style={[styles.text, { color: this.state.gasFastSelected ? colors.white : undefined }]}>
-						{getRenderableEthGasFee(fastGwei, gas)} {strings('unit.eth')}
+						{getRenderableEthGasFee(fastGwei, gas)} {ticker}
 					</Text>
 					<Text style={[styles.text, { color: this.state.gasFastSelected ? colors.white : undefined }]}>
-						{getRenderableFiatGasFee(fastGwei, conversionRate, currentCurrency, gas).toUpperCase()}
+						{getRenderableFiatGasFee(fastGwei, conversionRate, currentCurrency.toUpperCase(), gas)}
 					</Text>
 				</TouchableOpacity>
 			</View>
@@ -308,10 +318,11 @@ class CustomGas extends Component {
 	renderCustomGasInput = () => {
 		const { customGasLimit, customGasPrice, warningGasLimit, warningGasPrice } = this.state;
 		const { totalGas } = this.props;
+		const ticker = getTicker(this.props.ticker);
 		return (
 			<View>
 				<Text style={styles.textTotalGas}>
-					{fromWei(totalGas)} {strings('unit.eth')}
+					{fromWei(totalGas)} {ticker}
 				</Text>
 				<Text style={styles.text}>{strings('custom_gas.gas_limit')}</Text>
 				<TextInput
@@ -361,7 +372,8 @@ class CustomGas extends Component {
 
 const mapStateToProps = state => ({
 	conversionRate: state.engine.backgroundState.CurrencyRateController.conversionRate,
-	currentCurrency: state.engine.backgroundState.CurrencyRateController.currentCurrency
+	currentCurrency: state.engine.backgroundState.CurrencyRateController.currentCurrency,
+	ticker: state.engine.backgroundState.NetworkController.provider.ticker
 });
 
 export default connect(mapStateToProps)(CustomGas);
diff --git a/app/components/UI/CustomGas/index.test.js b/app/components/UI/CustomGas/index.test.js
@@ -16,6 +16,11 @@ describe('CustomGas', () => {
 					CurrencyRateController: {
 						currentCurrency: 'usd',
 						conversionRate: 0.1
+					},
+					NetworkController: {
+						provider: {
+							ticker: 'ETH'
+						}
 					}
 				}
 			}