Merge pull request #2506 from ethereum/refactor_logic1

Refactor dropdown logic

src/app.js

@@ -23,6 +23,8 @@ var toolTip = require('./app/ui/tooltip')
 var CompilerMetadata = require('./app/files/compiler-metadata')
 var CompilerImport = require('./app/compiler/compiler-imports')
 
+var executionContext = remixLib.execution.executionContext
+
 const PluginManagerComponent = require('./app/components/plugin-manager-component')
 const CompilersArtefacts = require('./app/compiler/compiler-artefacts')
 
@@ -222,15 +224,15 @@ Please make a backup of your contracts and start using http://remix.ethereum.org
   const fileManager = new FileManager(editor)
   registry.put({api: fileManager, name: 'filemanager'})
   // ----------------- compilation metadata generation servive ----------------------------
-  const compilerMetadataGenerator = new CompilerMetadata(fileManager, registry.get('config').api)
+  const compilerMetadataGenerator = new CompilerMetadata(executionContext, fileManager, registry.get('config').api)
   // ----------------- compilation result service (can keep track of compilation results) ----------------------------
   const compilersArtefacts = new CompilersArtefacts() // store all the compilation results (key represent a compiler name)
   registry.put({api: compilersArtefacts, name: 'compilersartefacts'})
   // ----------------- universal dapp: run transaction, listen on transactions, decode events
-  const udapp = new UniversalDApp(registry.get('config').api)
-  const {eventsDecoder, txlistener} = makeUdapp(udapp, compilersArtefacts, (domEl) => mainview.getTerminal().logHtml(domEl))
+  const udapp = new UniversalDApp(registry.get('config').api, executionContext)
+  const {eventsDecoder, txlistener} = makeUdapp(udapp, executionContext, compilersArtefacts, (domEl) => mainview.getTerminal().logHtml(domEl))
   // ----------------- network service (resolve network id / name) ----------------------------
-  const networkModule = new NetworkModule()
+  const networkModule = new NetworkModule(executionContext)
   // ----------------- convert offset to line/column service ----------------------------
   var offsetToLineColumnConverter = new OffsetToLineColumnConverter()
   registry.put({api: offsetToLineColumnConverter, name: 'offsettolinecolumnconverter'})
@@ -248,7 +250,7 @@ Please make a backup of your contracts and start using http://remix.ethereum.org
 
   // LAYOUT & SYSTEM VIEWS
   const appPanel = new MainPanel()
-  const mainview = new MainView(editor, appPanel, fileManager, appManager, txlistener, eventsDecoder)
+  const mainview = new MainView(editor, appPanel, fileManager, appManager, txlistener, eventsDecoder, executionContext)
   registry.put({ api: mainview, name: 'mainview' })
 
   appManager.register([
@@ -293,6 +295,7 @@ Please make a backup of your contracts and start using http://remix.ethereum.org
   )
   const run = new RunTab(
     udapp,
+    executionContext,
     registry.get('config').api,
     registry.get('filemanager').api,
     registry.get('editor').api,
@@ -302,7 +305,7 @@ Please make a backup of your contracts and start using http://remix.ethereum.org
     mainview
   )
   const analysis = new AnalysisTab(registry)
-  const debug = new DebuggerTab()
+  const debug = new DebuggerTab(executionContext)
   const test = new TestTab(
     registry.get('filemanager').api,
     filePanel,

src/app/files/compiler-metadata.js

@@ -1,5 +1,4 @@
 'use strict'
-var executionContext = require('../../execution-context')
 var CompilerAbstract = require('../compiler/compiler-abstract')
 import { Plugin } from '@remixproject/engine'
 import * as packageJson from '../../../package.json'
@@ -12,9 +11,10 @@ const profile = {
 }
 
 class CompilerMetadata extends Plugin {
-  constructor (fileManager, config) {
+  constructor (executionContext, fileManager, config) {
     super(profile)
     var self = this
+    self.executionContext = executionContext
     self.fileManager = fileManager
     self.config = config
     self.networks = ['VM:-', 'main:1', 'ropsten:3', 'rinkeby:4', 'kovan:42', 'görli:5', 'Custom']
@@ -97,7 +97,7 @@ class CompilerMetadata extends Plugin {
       var provider = self.fileManager.currentFileProvider()
       var path = self.fileManager.currentPath()
       if (provider && path) {
-        executionContext.detectNetwork((err, { id, name } = {}) => {
+        self.executionContext.detectNetwork((err, { id, name } = {}) => {
           if (err) {
             console.log(err)
           } else {

src/app/panels/main-view.js

@@ -20,7 +20,7 @@ var css = csjs`
 `
 
 export class MainView {
-  constructor (editor, mainPanel, fileManager, appManager, txListener, eventsDecoder) {
+  constructor (editor, mainPanel, fileManager, appManager, txListener, eventsDecoder, executionContext) {
     var self = this
     self.event = new EventManager()
     self._view = {}
@@ -31,6 +31,7 @@ export class MainView {
     self.mainPanel = mainPanel
     self.txListener = txListener
     self.eventsDecoder = eventsDecoder
+    self.executionContext = executionContext
     this.appManager = appManager
     this.init()
   }
@@ -99,7 +100,8 @@ export class MainView {
     self._components.terminal = new Terminal({
       appManager: this.appManager,
       eventsDecoder: this.eventsDecoder,
-      txListener: this.txListener
+      txListener: this.txListener,
+      executionContext: this.executionContext
     },
       {
         getPosition: (event) => {

src/app/panels/terminal.js

@@ -10,7 +10,6 @@ var Web3 = require('web3')
 var swarmgw = require('swarmgw')()
 
 var CommandInterpreterAPI = require('../../lib/cmdInterpreterAPI')
-var executionContext = require('../../execution-context')
 var AutoCompletePopup = require('../ui/auto-complete-popup')
 var TxLogger = require('../../app/ui/txLogger')
 
@@ -42,6 +41,7 @@ class Terminal extends Plugin {
     super(profile)
     var self = this
     self.event = new EventManager()
+    self.executionContext = opts.executionContext
     self._api = api
     self._opts = opts
     self.data = {
@@ -52,7 +52,7 @@ class Terminal extends Plugin {
     }
     self._view = { el: null, bar: null, input: null, term: null, journal: null, cli: null }
     self._components = {}
-    self._components.cmdInterpreter = new CommandInterpreterAPI(this)
+    self._components.cmdInterpreter = new CommandInterpreterAPI(this, null, self.executionContext)
     self._components.autoCompletePopup = new AutoCompletePopup(self._opts)
     self._components.autoCompletePopup.event.register('handleSelect', function (input) {
       let textList = self._view.input.innerText.split(' ')
@@ -437,7 +437,7 @@ class Terminal extends Plugin {
     self._shell('remix.help()', self.commands, () => {})
     self.commands.html(intro)
 
-    self._components.txLogger = new TxLogger(self._opts.eventsDecoder, self._opts.txListener, this)
+    self._components.txLogger = new TxLogger(self._opts.eventsDecoder, self._opts.txListener, this, self.executionContext)
     self._components.txLogger.event.register('debuggingRequested', (hash) => {
       // TODO should probably be in the run module
       if (!self._opts.appManager.isActive('debugger')) self._opts.appManager.activateOne('debugger')
@@ -668,7 +668,7 @@ class Terminal extends Plugin {
       return done(null, 'This type of command has been deprecated and is not functionning anymore. Please run remix.help() to list available commands.')
     }
     var self = this
-    var context = domTerminalFeatures(self, scopedCommands)
+    var context = domTerminalFeatures(self, scopedCommands, self.executionContext)
     try {
       var cmds = vm.createContext(Object.assign(self._jsSandboxContext, context, self._jsSandboxRegistered))
       var result = vm.runInContext(script, cmds)
@@ -680,7 +680,7 @@ class Terminal extends Plugin {
   }
 }
 
-function domTerminalFeatures (self, scopedCommands) {
+function domTerminalFeatures (self, scopedCommands, executionContext) {
   return {
     swarmgw,
     ethers,

src/app/tabs/debugger-tab.js

@@ -21,9 +21,10 @@ const profile = {
 
 class DebuggerTab extends ViewPlugin {
 
-  constructor () {
+  constructor (executionContext) {
     super(profile)
     this.el = null
+    this.executionContext = executionContext
   }
 
   render () {
@@ -33,7 +34,7 @@ class DebuggerTab extends ViewPlugin {
       <div class="${css.debuggerTabView}" id="debugView">
         <div id="debugger" class="${css.debugger}"></div>
       </div>`
-    this.debuggerUI = new DebuggerUI(this.el.querySelector('#debugger'))
+    this.debuggerUI = new DebuggerUI(this.el.querySelector('#debugger'), this.executionContext)
     return this.el
   }
 

src/app/tabs/debugger/debuggerUI.js

@@ -9,7 +9,6 @@ var SourceHighlighter = require('../../editor/sourceHighlighter')
 
 var EventManager = require('../../../lib/events')
 
-var executionContext = require('../../../execution-context')
 var globalRegistry = require('../../../global/registry')
 
 var remixLib = require('remix-lib')
@@ -31,8 +30,9 @@ var css = csjs`
 
 class DebuggerUI {
 
-  constructor (container) {
+  constructor (container, executionContext) {
     this.registry = globalRegistry
+    this.executionContext = executionContext
     this.event = new EventManager()
 
     this.isActive = false
@@ -105,13 +105,13 @@ class DebuggerUI {
 
   getDebugWeb3 () {
     return new Promise((resolve, reject) => {
-      executionContext.detectNetwork((error, network) => {
+      this.executionContext.detectNetwork((error, network) => {
         let web3
         if (error || !network) {
-          web3 = init.web3DebugNode(executionContext.web3())
+          web3 = init.web3DebugNode(this.executionContext.web3())
         } else {
           const webDebugNode = init.web3DebugNode(network.name)
-          web3 = !webDebugNode ? executionContext.web3() : webDebugNode
+          web3 = !webDebugNode ? this.executionContext.web3() : webDebugNode
         }
         init.extendWeb3(web3)
         resolve(web3)

src/app/tabs/network-module.js

@@ -1,4 +1,3 @@
-const executionContext = require('../../execution-context')
 import { Plugin } from '@remixproject/engine'
 import * as packageJson from '../../../package.json'
 
@@ -15,10 +14,11 @@ export const profile = {
 // - methods: ['getNetworkProvider', 'getEndpoint', 'detectNetwork', 'addNetwork', 'removeNetwork']
 
 export class NetworkModule extends Plugin {
-  constructor () {
+  constructor (executionContext) {
     super(profile)
+    this.executionContext = executionContext
     // TODO: See with remix-lib to make sementic coherent
-    executionContext.event.register('contextChanged', (provider) => {
+    this.executionContext.event.register('contextChanged', (provider) => {
       this.emit('providerChanged', provider)
     })
     /*
@@ -37,34 +37,34 @@ export class NetworkModule extends Plugin {
 
   /** Return the current network provider (web3, vm, injected) */
   getNetworkProvider () {
-    return executionContext.getProvider()
+    return this.executionContext.getProvider()
   }
 
   /** Return the current network */
   detectNetwork () {
     return new Promise((resolve, reject) => {
-      executionContext.detectNetwork((error, network) => {
+      this.executionContext.detectNetwork((error, network) => {
         error ? reject(error) : resolve(network)
       })
     })
   }
 
   /** Return the url only if network provider is 'web3' */
   getEndpoint () {
-    const provider = executionContext.getProvider()
+    const provider = this.executionContext.getProvider()
     if (provider !== 'web3') {
       throw new Error('no endpoint: current provider is either injected or vm')
     }
-    return executionContext.web3().currentProvider.host
+    return this.executionContext.web3().currentProvider.host
   }
 
   /** Add a custom network to the list of available networks */
   addNetwork (customNetwork) {
-    executionContext.addProvider(customNetwork)
+    this.executionContext.addProvider(customNetwork)
   }
 
   /** Remove a network to the list of availble networks */
   removeNetwork (name) {
-    executionContext.removeProvider(name)
+    this.executionContext.removeProvider(name)
   }
 }

src/app/tabs/runTab/contractDropdown.js

@@ -8,9 +8,11 @@ var modalDialog = require('../../ui/modaldialog')
 var MultiParamManager = require('../../ui/multiParamManager')
 
 class ContractDropdownUI {
-  constructor (dropdownLogic, logCallback) {
+  constructor (blockchain, dropdownLogic, logCallback, runView) {
+    this.blockchain = blockchain
     this.dropdownLogic = dropdownLogic
     this.logCallback = logCallback
+    this.runView = runView
     this.event = new EventManager()
 
     this.listenToEvents()
@@ -39,8 +41,6 @@ class ContractDropdownUI {
         document.querySelector(`.${css.contractNames}`).classList.add(css.contractNamesError)
       }
     })
-
-    this.dropdownLogic.event.register('currentFileChanged', this.changeCurrentFile.bind(this))
   }
 
   render () {
@@ -108,8 +108,9 @@ class ContractDropdownUI {
     }
 
     const selectedContract = this.getSelectedContract()
-    const clickCallback = (valArray, inputsValues) => {
-      this.createInstance(inputsValues)
+    const clickCallback = async (valArray, inputsValues) => {
+      var selectedContract = this.getSelectedContract()
+      this.createInstance(selectedContract, inputsValues)
     }
     const createConstructorInstance = new MultiParamManager(
       0,
@@ -130,9 +131,7 @@ class ContractDropdownUI {
     return this.dropdownLogic.getSelectedContract(contractName, compilerAtributeName)
   }
 
-  createInstance (args) {
-    var selectedContract = this.getSelectedContract()
-
+  async createInstance (selectedContract, args) {
     if (selectedContract.bytecodeObject.length === 0) {
       return modalDialogCustom.alert('This contract may be abstract, not implement an abstract parent\'s methods completely or not invoke an inherited contract\'s constructor correctly.')
     }
@@ -177,22 +176,63 @@ class ContractDropdownUI {
       this.event.trigger('newContractInstanceAdded', [contractObject, address, contractObject.name])
     }
 
+    let contractMetadata
+    try {
+      contractMetadata = await this.runView.call('compilerMetadata', 'deployMetadataOf', selectedContract.name)
+    } catch (error) {
+      return statusCb(`creation of ${selectedContract.name} errored: ` + error)
+    }
+
+    const compilerContracts = this.dropdownLogic.getCompilerContracts()
+    const confirmationCb = this.getConfirmationCb(modalDialog, confirmDialog)
+
     if (selectedContract.isOverSizeLimit()) {
       return modalDialog('Contract code size over limit', yo`<div>Contract creation initialization returns data with length of more than 24576 bytes. The deployment will likely fails. <br>
       More info: <a href="https://github.com/ethereum/EIPs/blob/master/EIPS/eip-170.md" target="_blank">eip-170</a>
       </div>`,
         {
           label: 'Force Send',
           fn: () => {
-            this.dropdownLogic.forceSend(selectedContract, args, continueCb, promptCb, modalDialog, confirmDialog, statusCb, finalCb)
+            this.blockchain.deployContract(selectedContract, args, contractMetadata, compilerContracts, {continueCb, promptCb, statusCb, finalCb}, confirmationCb)
           }}, {
             label: 'Cancel',
             fn: () => {
               this.logCallback(`creation of ${selectedContract.name} canceled by user.`)
             }
           })
     }
-    this.dropdownLogic.forceSend(selectedContract, args, continueCb, promptCb, modalDialog, confirmDialog, statusCb, finalCb)
+    this.blockchain.deployContract(selectedContract, args, contractMetadata, compilerContracts, {continueCb, promptCb, statusCb, finalCb}, confirmationCb)
+  }
+
+  getConfirmationCb (modalDialog, confirmDialog) {
+    const confirmationCb = (network, tx, gasEstimation, continueTxExecution, cancelCb) => {
+      if (network.name !== 'Main') {
+        return continueTxExecution(null)
+      }
+      const amount = this.dropdownLogic.fromWei(tx.value, true, 'ether')
+      const content = confirmDialog(tx, amount, gasEstimation, null, this.dropdownLogic.determineGasFees(tx), this.blockchain.determineGasPrice)
+
+      modalDialog('Confirm transaction', content,
+        { label: 'Confirm',
+          fn: () => {
+            this.config.setUnpersistedProperty('doNotShowTransactionConfirmationAgain', content.querySelector('input#confirmsetting').checked)
+            // TODO: check if this is check is still valid given the refactor
+            if (!content.gasPriceStatus) {
+              cancelCb('Given gas price is not correct')
+            } else {
+              var gasPrice = this.dropdownLogic.toWei(content.querySelector('#gasprice').value, 'gwei')
+              continueTxExecution(gasPrice)
+            }
+          }}, {
+            label: 'Cancel',
+            fn: () => {
+              return cancelCb('Transaction canceled by user.')
+            }
+          }
+      )
+    }
+
+    return confirmationCb
   }
 
   loadFromAddress () {
@@ -215,7 +255,6 @@ class ContractDropdownUI {
       }
     )
   }
-
 }
 
 module.exports = ContractDropdownUI