diff --git a/apps/remix-ide/src/blockchain/blockchain.js b/apps/remix-ide/src/blockchain/blockchain.js index f280e47d8b..b041000be9 100644 --- a/apps/remix-ide/src/blockchain/blockchain.js +++ b/apps/remix-ide/src/blockchain/blockchain.js @@ -414,6 +414,7 @@ class Blockchain extends Plugin { const self = this waterfall([ function getGasLimit (next) { + console.log('called: ', self.transactionContextAPI.gasLimit()) if (self.transactionContextAPI.getGasLimit) { return self.transactionContextAPI.getGasLimit(next) } diff --git a/libs/remix-ui/run-tab/src/lib/actions/custom.ts b/libs/remix-ui/run-tab/src/lib/actions/custom.ts new file mode 100644 index 0000000000..8b1d8b838c --- /dev/null +++ b/libs/remix-ui/run-tab/src/lib/actions/custom.ts @@ -0,0 +1,89 @@ +// eslint-disable-next-line no-unused-vars +import React from 'react' +import * as ethJSUtil from 'ethereumjs-util' +import Web3 from 'web3' +import { shortenAddress } from '@remix-ui/helper' +import { fetchAccountsListFailed, fetchAccountsListRequest, fetchAccountsListSuccess, setGasLimit, setSelectedAccount, setSendUnit, setSendValue } from './payload' +import { runTabInitialState, runTabReducer } from '../reducers/runTab' + +export function useRunTabPlugin (plugin) { + const [runTab, dispatch] = React.useReducer(runTabReducer, runTabInitialState) + + const setupEvents = () => { + plugin.blockchain.events.on('newTransaction', (tx, receipt) => { + plugin.emit('newTransaction', tx, receipt) + }) + + plugin.blockchain.event.register('transactionExecuted', (error, from, to, data, lookupOnly, txResult) => { + if (!lookupOnly) dispatch(setSendValue(0)) + if (error) return + updateAccountBalances() + }) + + plugin.blockchain.resetAndInit(plugin.config, { + getAddress: (cb) => { + cb(null, runTab.accounts.selectedAccount) + }, + getValue: (cb) => { + try { + const number = runTab.sendValue + const unit = runTab.sendUnit + + cb(null, Web3.utils.toWei(number, unit)) + } catch (e) { + cb(e) + } + }, + getGasLimit: (cb) => { + try { + cb(null, '0x' + new ethJSUtil.BN(runTab.gasLimit, 10).toString(16)) + } catch (e) { + cb(e.message) + } + } + }) + console.log('called: reset and init') + } + + const updateAccountBalances = () => { + const accounts = runTab.accounts.loadedAccounts + + Object.keys(accounts).map((value) => { + plugin.blockchain.getBalanceInEther(value, (err, balance) => { + if (err) return + const updated = shortenAddress(value, balance) + + accounts[value] = updated + }) + }) + } + + const fillAccountsList = async () => { + try { + dispatch(fetchAccountsListRequest()) + const promise = plugin.blockchain.getAccounts() + + promise.then((accounts: string[]) => { + dispatch(fetchAccountsListSuccess(accounts)) + }).catch((e) => { + dispatch(fetchAccountsListFailed(e.message)) + }) + } catch (e) { + // addTooltip(`Cannot get account list: ${e}`) + } + } + + const setAccount = (account: string) => { + dispatch(setSelectedAccount(account)) + } + + const setUnit = (unit: 'ether' | 'finney' | 'gwei' | 'wei') => { + dispatch(setSendUnit(unit)) + } + + const setGasFee = (value: number) => { + dispatch(setGasLimit(value)) + } + + return { runTab, setupEvents, fillAccountsList, setAccount, setUnit, setGasFee } +} diff --git a/libs/remix-ui/run-tab/src/lib/actions/payload.ts b/libs/remix-ui/run-tab/src/lib/actions/payload.ts index ec8db31d45..8d7e29efd6 100644 --- a/libs/remix-ui/run-tab/src/lib/actions/payload.ts +++ b/libs/remix-ui/run-tab/src/lib/actions/payload.ts @@ -1,6 +1,7 @@ export const fetchAccountsListRequest = () => { return { - type: 'FETCH_ACCOUNTS_LIST_REQUEST' + type: 'FETCH_ACCOUNTS_LIST_REQUEST', + payload: null } } @@ -17,3 +18,31 @@ export const fetchAccountsListFailed = (error: string) => { payload: error } } + +export const setSendValue = (value: number) => { + return { + type: 'SET_SEND_VALUE', + payload: value + } +} + +export const setSelectedAccount = (account: string) => { + return { + type: 'SET_SELECTED_ACCOUNT', + payload: account + } +} + +export const setSendUnit = (unit: 'ether' | 'finney' | 'gwei' | 'wei') => { + return { + type: 'SET_SEND_UNIT', + payload: unit + } +} + +export const setGasLimit = (gasLimit: number) => { + return { + type: 'SET_GAS_LIMIT', + payload: gasLimit + } +} diff --git a/libs/remix-ui/run-tab/src/lib/components/account.tsx b/libs/remix-ui/run-tab/src/lib/components/account.tsx index 08f3a2af31..449d4c6448 100644 --- a/libs/remix-ui/run-tab/src/lib/components/account.tsx +++ b/libs/remix-ui/run-tab/src/lib/components/account.tsx @@ -1,16 +1,16 @@ // eslint-disable-next-line no-use-before-define -import React, { useEffect, useRef, useState } from 'react' +import React, { useEffect, useRef } from 'react' import { CopyToClipboard } from '@remix-ui/clipboard' import { AccountProps } from '../types' export function AccountUI (props: AccountProps) { - const accounts = Object.keys(props.accounts.loadedAccounts) - const [selectedAccount, setSelectedAccount] = useState('') + const { selectedAccount, loadedAccounts } = props.accounts + const accounts = Object.keys(loadedAccounts) const plusBtn = useRef(null) const plusTitle = useRef(null) useEffect(() => { - if (!selectedAccount && accounts.length > 0) setSelectedAccount(accounts[0]) + if (!selectedAccount && accounts.length > 0) props.setAccount(accounts[0]) }, [accounts, selectedAccount]) const updatePlusButton = () => { @@ -115,9 +115,9 @@ export function AccountUI (props: AccountProps) {
- { props.setAccount(e.target.value) }}> { - Object.keys(props.accounts.loadedAccounts).map((value) => ) + Object.keys(loadedAccounts).map((value) => ) }
diff --git a/libs/remix-ui/run-tab/src/lib/components/gasPrice.tsx b/libs/remix-ui/run-tab/src/lib/components/gasPrice.tsx index f357659971..19e7876a75 100644 --- a/libs/remix-ui/run-tab/src/lib/components/gasPrice.tsx +++ b/libs/remix-ui/run-tab/src/lib/components/gasPrice.tsx @@ -3,10 +3,14 @@ import React from 'react' import { GasPriceProps } from '../types' export function GasPriceUI (props: GasPriceProps) { + const handleGasLimit = (e) => { + props.setGasFee(e.target.value) + } + return (
- +
) } diff --git a/libs/remix-ui/run-tab/src/lib/components/settingsUI.tsx b/libs/remix-ui/run-tab/src/lib/components/settingsUI.tsx index 51137eaa90..87f127fbb3 100644 --- a/libs/remix-ui/run-tab/src/lib/components/settingsUI.tsx +++ b/libs/remix-ui/run-tab/src/lib/components/settingsUI.tsx @@ -129,9 +129,9 @@ export function SettingsUI (props: SettingsProps) {
- - - + + +
) } diff --git a/libs/remix-ui/run-tab/src/lib/components/value.tsx b/libs/remix-ui/run-tab/src/lib/components/value.tsx index 205e4137f8..1793827985 100644 --- a/libs/remix-ui/run-tab/src/lib/components/value.tsx +++ b/libs/remix-ui/run-tab/src/lib/components/value.tsx @@ -52,12 +52,12 @@ export function ValueUI (props: ValueProps) { className="form-control udapp_gasNval udapp_col2" id="value" data-id="dandrValue" - value="0" + value={props.sendValue} title="Enter the value and choose the unit" onKeyPress={validateInputKey} onChange={validateValue} /> - { props.setUnit((e.target.value) as 'ether' | 'finney' | 'gwei' | 'wei') }}> diff --git a/libs/remix-ui/run-tab/src/lib/reducers/runTab.ts b/libs/remix-ui/run-tab/src/lib/reducers/runTab.ts index 03273261f9..d6606a2c2f 100644 --- a/libs/remix-ui/run-tab/src/lib/reducers/runTab.ts +++ b/libs/remix-ui/run-tab/src/lib/reducers/runTab.ts @@ -8,17 +8,25 @@ export interface RunTabState { loadedAccounts: Record, isRequesting: boolean, isSuccessful: boolean, - error: string - } + error: string, + selectedAccount: string + }, + sendValue: string, + sendUnit: 'ether' | 'finney' | 'gwei' | 'wei', + gasLimit: number } -export const runTabInitialState = { +export const runTabInitialState: RunTabState = { accounts: { loadedAccounts: {}, isRequesting: false, isSuccessful: false, - error: null - } + error: null, + selectedAccount: '' + }, + sendValue: '0', + sendUnit: 'ether', + gasLimit: 3000000 } export const runTabReducer = (state: RunTabState = runTabInitialState, action: Action) => { @@ -61,6 +69,42 @@ export const runTabReducer = (state: RunTabState = runTabInitialState, action: A } } } + case 'SET_SEND_VALUE': { + const payload = action.payload as string + + return { + ...state, + sendValue: payload + } + } + case 'SET_SELECTED_ACCOUNT': { + const payload = action.payload as string + + return { + ...state, + accounts: { + ...state.accounts, + selectedAccount: payload + } + } + } + case 'SET_SEND_UNIT': { + const payload = action.payload as 'ether' | 'finney' | 'gwei' | 'wei' + + return { + ...state, + sendUnit: payload + } + } + + case 'SET_GAS_LIMIT': { + const payload = action.payload as number + + return { + ...state, + gasLimit: payload + } + } default: return state } @@ -68,23 +112,19 @@ export const runTabReducer = (state: RunTabState = runTabInitialState, action: A // TODO: unclear what's the goal of accountListCallId, feels like it can be simplified const resolveAccountsList = async (state: RunTabState, accounts: string[]) => { - // const txOrigin = this.el.querySelector('#txorigin') const loadedAccounts = state.accounts.loadedAccounts if (!accounts) accounts = [] for (const loadedaddress in loadedAccounts) { if (accounts.indexOf(loadedaddress) === -1) { - // txOrigin.removeChild(txOrigin.querySelector('option[value="' + loadedaddress + '"]')) delete loadedAccounts[loadedaddress] } } for (const i in accounts) { const address = accounts[i] if (!loadedAccounts[address]) { - // txOrigin.appendChild(yo``) loadedAccounts[address] = 1 } } return loadedAccounts - // txOrigin.setAttribute('value', accounts[0]) } diff --git a/libs/remix-ui/run-tab/src/lib/run-tab.tsx b/libs/remix-ui/run-tab/src/lib/run-tab.tsx index 0878cd01ce..9d311dfe14 100644 --- a/libs/remix-ui/run-tab/src/lib/run-tab.tsx +++ b/libs/remix-ui/run-tab/src/lib/run-tab.tsx @@ -1,20 +1,24 @@ // eslint-disable-next-line no-use-before-define -import React, { useState, useEffect, useReducer } from 'react' -import { initSettingsTab } from './actions' +import React, { useState, useEffect } from 'react' +import { useRunTabPlugin } from './actions/custom' import { ContractDropdownUI } from './components/contractDropdownUI' import { InstanceContainerUI } from './components/instanceContainerUI' import { RecorderUI } from './components/recorderCardUI' import { SettingsUI } from './components/settingsUI' import './css/run-tab.css' -import { runTabInitialState, runTabReducer } from './reducers/runTab' import { RunTabProps } from './types' export function RunTabUI (props: RunTabProps) { + const { runTab, setupEvents, fillAccountsList, setAccount, setUnit, setGasFee } = useRunTabPlugin(props.plugin) const [selectExEnv, setSelectExEnv] = useState('') - const [runTab, runTabDispatch] = useReducer(runTabReducer, runTabInitialState) useEffect(() => { - initSettingsTab(props.plugin)(runTabDispatch) + setupEvents() + + setInterval(() => { + fillAccountsList() + }, 1000) + fillAccountsList() }, []) const updateExEnv = (env: string) => { @@ -24,7 +28,7 @@ export function RunTabUI (props: RunTabProps) { return (
- + diff --git a/libs/remix-ui/run-tab/src/lib/types/index.ts b/libs/remix-ui/run-tab/src/lib/types/index.ts index 9f4a2a58b7..0dd3da14d3 100644 --- a/libs/remix-ui/run-tab/src/lib/types/index.ts +++ b/libs/remix-ui/run-tab/src/lib/types/index.ts @@ -7,10 +7,17 @@ export interface SettingsProps { updateExEnv: (env: string) => void, accounts: { loadedAccounts: Record, + selectedAccount: string, isRequesting: boolean, isSuccessful: boolean, error: string - } + }, + setAccount: (account: string) => void, + setUnit: (unit: 'ether' | 'finney' | 'gwei' | 'wei') => void, + sendValue: string, + sendUnit: string, + gasLimit: number, + setGasFee: (value: number) => void } export interface EnvironmentProps { @@ -25,18 +32,23 @@ export interface AccountProps { selectExEnv: string, accounts: { loadedAccounts: Record, + selectedAccount: string, isRequesting: boolean, isSuccessful: boolean, error: string - } + }, + setAccount: (account: string) => void } export interface GasPriceProps { - + gasLimit: number, + setGasFee: (value: number) => void } export interface ValueProps { - + setUnit: (unit: 'ether' | 'finney' | 'gwei' | 'wei') => void, + sendValue: string, + sendUnit: string } export interface ContractDropdownProps {