Udapp as a LibrayPlugin in RunTab.

package.json

@@ -51,7 +51,7 @@
     "onchange": "^3.2.1",
     "remix-analyzer": "0.3.8",
     "remix-debug": "0.3.9",
-    "remix-lib": "0.4.7",
+    "remix-lib": "^0.4.8",
     "remix-solidity": "0.3.10",
     "remix-tabs": "1.0.48",
     "remix-tests": "0.1.13",
@@ -61,7 +61,6 @@
     "selenium-standalone": "^6.0.1",
     "semver": "^6.1.2",
     "solc": "^0.5.0",
-    "standard": "^8.5.0",
     "swarmgw": "^0.3.1",
     "tape": "^4.5.1",
     "uglify-js": "^2.8.16",
@@ -73,9 +72,10 @@
     "yo-yoify": "^3.7.3"
   },
   "dependencies": {
+    "@remixproject/engine": "^0.1.5",
     "http-server": "^0.11.1",
-    "@remixproject/engine": "^0.1.2-7",
-    "remixd": "0.1.8-alpha.6"
+    "remixd": "0.1.8-alpha.6",
+    "standard": "^8.5.0"
   },
   "repository": {
     "type": "git",

src/app.js

@@ -11,7 +11,6 @@ var loadFileFromParent = require('./loadFilesFromParent')
 var { OffsetToLineColumnConverter } = require('./lib/offsetToLineColumnConverter')
 var QueryParams = require('./lib/query-params')
 var GistHandler = require('./lib/gist-handler')
-var makeUdapp = require('./makeUdapp')
 var Storage = remixLib.Storage
 var Browserfiles = require('./app/files/browser-files')
 var SharedFolder = require('./app/files/shared-folder')
@@ -34,10 +33,11 @@ const SettingsTab = require('./app/tabs/settings-tab')
 const AnalysisTab = require('./app/tabs/analysis-tab')
 const DebuggerTab = require('./app/tabs/debugger-tab')
 const TestTab = require('./app/tabs/test-tab')
-const RunTab = require('./app/tabs/run-tab')
 const FilePanel = require('./app/panels/file-panel')
 const Editor = require('./app/editor/editor')
 
+import { RunTab, makeUdapp } from './app/udapp';
+
 import PanelsResize from './lib/panels-resize'
 import { RemixAppManager } from './remixAppManager'
 import { FramingService } from './framingService'
@@ -49,6 +49,7 @@ import { HiddenPanel } from './app/components/hidden-panel'
 import { VerticalIcons } from './app/components/vertical-icons'
 import { LandingPage } from './app/ui/landing-page/landing-page'
 import { MainPanel } from './app/components/main-panel'
+import { UniversalDApp } from 'remix-lib'
 
 var css = csjs`
   html { box-sizing: border-box; }
@@ -244,7 +245,8 @@ Please make a backup of your contracts and start using http://remix.ethereum.org
   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, eventsDecoder, txlistener} = makeUdapp(compilersArtefacts, (domEl) => mainview.getTerminal().logHtml(domEl))
+  const udapp = new UniversalDApp(registry.get('config').api)
+  const {eventsDecoder, txlistener} = makeUdapp(udapp, compilersArtefacts, (domEl) => mainview.getTerminal().logHtml(domEl))
   // ----------------- network service (resolve network id / name) ----------------------------
   const networkModule = new NetworkModule()
   // ----------------- convert offset to line/column service ----------------------------
@@ -258,7 +260,6 @@ Please make a backup of your contracts and start using http://remix.ethereum.org
     fileManager,
     compilerMetadataGenerator,
     compilersArtefacts,
-    udapp,
     networkModule,
     offsetToLineColumnConverter
   ])
@@ -301,7 +302,7 @@ Please make a backup of your contracts and start using http://remix.ethereum.org
   ])
 
   // CONTENT VIEWS & DEFAULT PLUGINS
-  let compileTab = new CompileTab(
+  const compileTab = new CompileTab(
     editor,
     registry.get('config').api,
     new Renderer(),
@@ -309,7 +310,7 @@ Please make a backup of your contracts and start using http://remix.ethereum.org
     registry.get('filemanager').api,
     registry.get('fileproviders').api,
   )
-  let run = new RunTab(
+  const run = new RunTab(
     udapp,
     registry.get('config').api,
     registry.get('filemanager').api,
@@ -319,9 +320,9 @@ Please make a backup of your contracts and start using http://remix.ethereum.org
     networkModule,
     mainview
   )
-  let analysis = new AnalysisTab(registry)
-  let debug = new DebuggerTab()
-  let test = new TestTab(
+  const analysis = new AnalysisTab(registry)
+  const debug = new DebuggerTab()
+  const test = new TestTab(
     registry.get('filemanager').api,
     filePanel,
     compileTab,
@@ -338,7 +339,7 @@ Please make a backup of your contracts and start using http://remix.ethereum.org
     ...appManager.registeredPlugins()
   ])
 
-  await appManager.activate(['contentImport', 'theme', 'sourceHighlighters', 'fileManager', 'compilerMetadata', 'compilerArtefacts', 'udapp', 'network', 'offsetToLineColumnConverter'])
+  await appManager.activate(['contentImport', 'theme', 'sourceHighlighters', 'fileManager', 'compilerMetadata', 'compilerArtefacts', 'network', 'offsetToLineColumnConverter'])
   await appManager.activate(['mainPanel'])
   await appManager.activate(['menuicons', 'home', 'sidePanel', 'pluginManager', 'fileExplorers', 'settings'])
 

src/app/components/panel.js

@@ -44,7 +44,6 @@ export class AbstractPanel extends HostPlugin {
    * @param {HTMLElement} content the HTMLContent of the plugin
    */
   add (view, name) {
-    console.log('panel', name, view)
     if (this.contents[name]) throw new Error(`Plugin ${name} already rendered`)
     view.style.height = '100%'
     view.style.width = '100%'

src/app/components/vertical-icons.js

@@ -310,7 +310,7 @@ export class VerticalIcons extends Plugin {
     </div>
     `
 
-    this.iconKind['run'] = yo`
+    this.iconKind['udapp'] = yo`
     <div id='runIcons'>
     </div>
     `
@@ -345,7 +345,7 @@ export class VerticalIcons extends Plugin {
         ${home}
         ${this.iconKind['fileexplorer']}
         ${this.iconKind['compile']}
-        ${this.iconKind['run']}
+        ${this.iconKind['udapp']}
         ${this.iconKind['testing']}
         ${this.iconKind['analysis']}
         ${this.iconKind['debugging']}

src/app/panels/terminal.js

@@ -199,7 +199,11 @@ class Terminal extends Plugin {
       </div>
     `
     setInterval(async () => {
+      try {
         self._view.pendingTxCount.innerHTML = await self.call('udapp', 'pendingTransactionsCount')
+      } catch {
+        console.log('Terminal try to call "udapp".')
+      }
     }, 1000)
 
     function listenOnNetwork (ev) {

src/app/tabs/compile-tab.js

@@ -30,7 +30,7 @@ const profile = {
   location: 'sidePanel',
   documentation: 'https://remix-ide.readthedocs.io/en/latest/solidity_editor.html',
   version: packageJson.version,
-  methods: ['getCompilationResult']
+  methods: ['getCompilationResult', 'compile']
 
 }
 

src/app/udapp/index.js

+export * from './run-tab'
+export * from './make-udapp'
\ No newline at end of file

src/makeUdapp.js → src/app/udapp/make-udapp.js

-var UniversalDApp = require('./universal-dapp.js')
-var registry = require('./global/registry')
+var registry = require('../../global/registry')
 var remixLib = require('remix-lib')
 var yo = require('yo-yo')
 var executionContext = remixLib.execution.executionContext
 var Txlistener = remixLib.execution.txListener
 var EventsDecoder = remixLib.execution.EventsDecoder
-var TransactionReceiptResolver = require('./lib/transactionReceiptResolver')
+var TransactionReceiptResolver = require('../../lib/transactionReceiptResolver')
 
-module.exports = (compilersArtefacts, logHtmlCallback) => {
+export function makeUdapp(udapp, compilersArtefacts, logHtmlCallback) {
   // ----------------- UniversalDApp -----------------
-  const udapp = new UniversalDApp(registry)
   // TODO: to remove when possible
   udapp.event.register('transactionBroadcasted', (txhash, networkName) => {
     var txLink = executionContext.txDetailsLink(networkName, txhash)

src/app/tabs/run-tab.js → src/app/udapp/run-tab.js

-var $ = require('jquery')
-var yo = require('yo-yo')
-var EventManager = require('../../lib/events')
-var Card = require('../ui/card')
-var css = require('./styles/run-tab-styles')
-
-var Settings = require('./runTab/model/settings.js')
-var SettingsUI = require('./runTab/settings.js')
+import { LibraryPlugin } from '@remixproject/engine';
+import * as packageJson from '../../../package.json'
 
-var DropdownLogic = require('./runTab/model/dropdownlogic.js')
-var ContractDropdownUI = require('./runTab/contractDropdown.js')
-var UniversalDAppUI = require('../ui/universal-dapp-ui')
+const $ = require('jquery')
+const yo = require('yo-yo')
+const EventManager = require('../../lib/events')
+const Card = require('../ui/card')
 
-var Recorder = require('./runTab/model/recorder.js')
-var RecorderUI = require('./runTab/recorder.js')
+const css = require('../tabs/styles/run-tab-styles')
+const Settings = require('../tabs/runTab/model/settings.js')
+const SettingsUI = require('../tabs/runTab/settings.js')
+const Recorder = require('../tabs/runTab/model/recorder.js')
+const RecorderUI = require('../tabs/runTab/recorder.js')
+const DropdownLogic = require('../tabs/runTab/model/dropdownlogic.js')
+const ContractDropdownUI = require('../tabs/runTab/contractDropdown.js')
 
+const UniversalDAppUI = require('../ui/universal-dapp-ui')
 const executionContext = require('../../execution-context')
 
-import { ViewPlugin } from '@remixproject/engine'
-import * as packageJson from '../../../package.json'
-
 const profile = {
-  name: 'run',
+  name: 'udapp',
   displayName: 'Deploy & run transactions',
-  methods: [],
-  events: [],
   icon: 'data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxNi4wLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DQo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzFfY29weSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgeD0iMHB4Ig0KCSB5PSIwcHgiIHdpZHRoPSI3NDIuNTQ1cHgiIGhlaWdodD0iNjc2Ljg4NnB4IiB2aWV3Qm94PSIwIC0wLjIwNCA3NDIuNTQ1IDY3Ni44ODYiDQoJIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAtMC4yMDQgNzQyLjU0NSA2NzYuODg2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwb2x5Z29uIHN0cm9rZT0iI0ZGRkZGRiIgc3Ryb2tlLW1pdGVybGltaXQ9IjEwIiBwb2ludHM9IjI5NS45MTEsMC43MTEgNDg4LjkxMSwzMDQuMTg2IDQ4OC45MTEsMzk3LjE4MSAyOTMuOTExLDY3Ni41NTYgDQoJCTc0MS43ODYsMzQ5Ljk0MyAJIi8+DQoJPHBvbHlnb24gc3Ryb2tlPSIjRkZGRkZGIiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIHBvaW50cz0iNDE3LjA4Myw0MDYuNTg5IDIwOS43OTEsNTE5LjQ5NCAxLjg0Niw0MDYuMjM0IDIwOS43OTEsNjc1Ljg2MyAJIi8+DQoJPHBvbHlnb24gc3Ryb2tlPSIjRkZGRkZGIiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIHBvaW50cz0iNDE3LjA4MywzMTguNzA3IDIwOS43OTEsMC43MTEgMS44NDYsMzE4LjQyOCAyMDkuNzkxLDQzMS42ODkgCSIvPg0KPC9nPg0KPC9zdmc+DQo=',
   description: 'execute and save transactions',
-  kind: 'run',
+  kind: 'udapp',
   location: 'sidePanel',
   documentation: 'https://remix-ide.readthedocs.io/en/latest/run.html',
-  version: packageJson.version
+  version: packageJson.version,
+  permission: true,
+  events: ['newTransaction'],
+  methods: ['createVMAccount', 'sendTransaction', 'getAccounts', 'pendingTransactionsCount']
 }
 
-class RunTab extends ViewPlugin {
+export class RunTab extends LibraryPlugin {
 
   constructor (udapp, config, fileManager, editor, filePanel, compilersArtefacts, networkModule, mainView) {
-    super(profile)
+    super(udapp, profile)
     this.event = new EventManager()
     this.config = config
     this.udapp = udapp
@@ -55,11 +54,11 @@ class RunTab extends ViewPlugin {
       },
       getValue: (cb) => {
         try {
-          var number = document.querySelector('#value').value
-          var select = document.getElementById('unit')
-          var index = select.selectedIndex
-          var selectedUnit = select.querySelectorAll('option')[index].dataset.unit
-          var unit = 'ether' // default
+          const number = document.querySelector('#value').value
+          const select = document.getElementById('unit')
+          const index = select.selectedIndex
+          const selectedUnit = select.querySelectorAll('option')[index].dataset.unit
+          let unit = 'ether' // default
           if (['ether', 'finney', 'gwei', 'wei'].indexOf(selectedUnit) >= 0) {
             unit = selectedUnit
           }
@@ -126,11 +125,11 @@ class RunTab extends ViewPlugin {
   }
 
   renderDropdown (udappUI, fileManager, compilersArtefacts, config, editor, udapp, filePanel, logCallback) {
-    var dropdownLogic = new DropdownLogic(fileManager, compilersArtefacts, config, editor, udapp, filePanel, this)
+    const dropdownLogic = new DropdownLogic(fileManager, compilersArtefacts, config, editor, udapp, filePanel, this)
     this.contractDropdownUI = new ContractDropdownUI(dropdownLogic, logCallback)
 
     this.contractDropdownUI.event.register('clearInstance', () => {
-      var noInstancesText = this.noInstancesText
+      const noInstancesText = this.noInstancesText
       if (noInstancesText.parentNode) { noInstancesText.parentNode.removeChild(noInstancesText) }
     })
     this.contractDropdownUI.event.register('newContractABIAdded', (abi, address) => {
@@ -144,7 +143,7 @@ class RunTab extends ViewPlugin {
   renderRecorder (udapp, udappUI, fileManager, config, logCallback) {
     this.recorderCount = yo`<span>0</span>`
 
-    var recorder = new Recorder(udapp, fileManager, config)
+    const recorder = new Recorder(udapp, fileManager, config)
     recorder.event.register('recorderCountChange', (count) => {
       this.recorderCount.innerText = count
     })
@@ -206,7 +205,4 @@ class RunTab extends ViewPlugin {
     this.renderRecorderCard()
     return this.renderContainer()
   }
-
 }
\ No newline at end of file
-
-module.exports = RunTab

src/app/ui/landing-page/landing-page.js

@@ -125,21 +125,21 @@ export class LandingPage extends ViewPlugin {
 
     let startSolidity = () => {
       this.appManager.ensureActivated('solidity')
-      this.appManager.ensureActivated('run')
+      this.appManager.ensureActivated('udapp')
       this.appManager.ensureActivated('solidityStaticAnalysis')
       this.appManager.ensureActivated('solidityUnitTesting')
       this.verticalIcons.select('solidity')
     }
     let startVyper = () => {
       this.appManager.ensureActivated('vyper')
-      this.appManager.ensureActivated('run')
+      this.appManager.ensureActivated('udapp')
       this.verticalIcons.select('vyper')
     }
 
     let startPipeline = () => {
       this.appManager.ensureActivated('solidity')
       this.appManager.ensureActivated('pipeline')
-      this.appManager.ensureActivated('run')
+      this.appManager.ensureActivated('udapp')
     }
     let startDebugger = () => {
       this.appManager.ensureActivated('debugger')

src/app/ui/landing-page/workspace.js

@@ -16,7 +16,7 @@ export const defaultWorkspaces = (appManager) => {
       true,
       () => {
         appManager.ensureActivated('solidity')
-        appManager.ensureActivated('run')
+        appManager.ensureActivated('udapp')
         appManager.ensureActivated('solidityStaticAnalysis')
         appManager.ensureActivated('solidityUnitTesting')
       }, () => {}),
@@ -26,7 +26,7 @@ export const defaultWorkspaces = (appManager) => {
       true,
       () => {
         appManager.ensureActivated('vyper')
-        appManager.ensureActivated('run')
+        appManager.ensureActivated('udapp')
       }, () => {}),
     new Workspace('Debugger', 'Debug transactions with remix', false, () => {
       appManager.ensureActivated('debugger')
@@ -34,7 +34,7 @@ export const defaultWorkspaces = (appManager) => {
     new Workspace('Pipeline', '', false, () => {
       appManager.ensureActivated('solidity')
       appManager.ensureActivated('pipeline')
-      appManager.ensureActivated('run')
+      appManager.ensureActivated('udapp')
     })
   ]
 }

test-browser/commands/addAtAddressInstance.js

@@ -13,7 +13,7 @@ class addAtAddressInstance extends EventEmitter {
 }
 
 function addInstance (browser, address, isValidFormat, isValidChecksum, callback) {
-  browser.clickLaunchIcon('run').clearValue('.ataddressinput').setValue('.ataddressinput', address, function () {
+  browser.clickLaunchIcon('udapp').clearValue('.ataddressinput').setValue('.ataddressinput', address, function () {
     browser.click('button[id^="runAndDeployAtAdressButton"]')
         .execute(function () {
           var ret = document.querySelector('div[class^="modal-body"] div').innerHTML

test-browser/commands/addFile.js

@@ -13,7 +13,7 @@ class AddFile extends EventEmitter {
 }
 
 function addFile (browser, name, content, done) {
-  browser.clickLaunchIcon('run').clickLaunchIcon('fileExplorers').click('.newFile')
+  browser.clickLaunchIcon('udapp').clickLaunchIcon('fileExplorers').click('.newFile')
       .perform((client, done) => {
         browser.execute(function (fileName) {
           if (fileName !== 'Untitled.sol') {

test-browser/commands/createContract.js

@@ -13,7 +13,7 @@ class CreateContract extends EventEmitter {
 }
 
 function createContract (browser, inputParams, callback) {
-  browser.clickLaunchIcon('settings').clickLaunchIcon('run')
+  browser.clickLaunchIcon('settings').clickLaunchIcon('udapp')
     .setValue('div[class^="contractActionsContainerSingle"] input', inputParams, function () {
       browser.click('#runTabView button[class^="instanceButton"]').pause(500).perform(function () { callback() })
     })

test-browser/commands/selectContract.js

@@ -13,7 +13,7 @@ class SelectContract extends EventEmitter {
 }
 
 function selectContract (browser, contractName, callback) {
-  browser.clickLaunchIcon('settings').clickLaunchIcon('run')
+  browser.clickLaunchIcon('settings').clickLaunchIcon('udapp')
   .setValue('#runTabView select[class^="contractNames"]', contractName).perform(() => {
     callback()
   })

test-browser/tests/ballot.js

@@ -19,7 +19,7 @@ module.exports = {
     .waitForElementVisible('#icon-panel', 10000)
     .clickLaunchIcon('solidity')
     .testContracts('Untitled.sol', sources[0]['browser/Untitled.sol'], ['Ballot'])
-    .clickLaunchIcon('run')
+    .clickLaunchIcon('udapp')
     .setValue('input[placeholder="uint8 _numProposals"]', '1')
     .click('#runTabView button[class^="instanceButton"]')
     .waitForElementPresent('.instance:nth-of-type(2)')
@@ -43,7 +43,7 @@ module.exports = {
   },
 
   'Access Ballot via at address': function (browser) {
-    browser.clickLaunchIcon('run')
+    browser.clickLaunchIcon('udapp')
     .click('button[class^="udappClose"]')
     .addFile('ballot.abi', { content: ballotABI })
     .addAtAddressInstance('0x692a70D2e424a56D2C6C27aA97D1a86395877b3B', true, false)

test-browser/tests/recorder.js

@@ -12,7 +12,7 @@ module.exports = {
   'Test Recorder': function (browser) {
     var addressRef
     browser.addFile('scenario.json', {content: records})
-        .clickLaunchIcon('run')
+        .clickLaunchIcon('udapp')
         .click('div[class^="cardContainer"] i[class^="arrow"]')
         .click('#runTabView .runtransaction')
         .waitForElementPresent('.instance:nth-of-type(2)')

test-browser/tests/signingMessage.js

@@ -11,7 +11,7 @@ module.exports = {
   },
   'Test Signature': function (browser) {
     let hash, signature
-    browser.clickLaunchIcon('run').signMessage('test message', (h, s) => {
+    browser.clickLaunchIcon('udapp').signMessage('test message', (h, s) => {
       hash = h
       signature = s
       console.log('hash', hash)

test-browser/tests/transactionExecution.js

@@ -12,7 +12,7 @@ module.exports = {
 
   'Execute Simple Contract and Test Terminal': function (browser) {
     browser.testContracts('Untitled.sol', sources[0]['browser/Untitled.sol'], ['TestContract'])
-        .clickLaunchIcon('run')
+        .clickLaunchIcon('udapp')
         .click('#runTabView button[class^="instanceButton"]')
         .waitForElementPresent('.instance:nth-of-type(2)')
         .click('.instance:nth-of-type(2) > div > button')
@@ -39,7 +39,7 @@ module.exports = {
 
   'Test Complex Return Values': function (browser) {
     browser.testContracts('returnValues.sol', sources[1]['browser/returnValues.sol'], ['testReturnValues'])
-      .clickLaunchIcon('run')
+      .clickLaunchIcon('udapp')
       .click('#runTabView button[class^="instanceButton"]')
       .waitForElementPresent('.instance:nth-of-type(2)')
       .click('.instance:nth-of-type(2) > div > button')
@@ -76,7 +76,7 @@ module.exports = {
 
   'Test Complex Input Values': function (browser) {
     browser.testContracts('inputValues.sol', sources[2]['browser/inputValues.sol'], ['test'])
-        .clickLaunchIcon('run')
+        .clickLaunchIcon('udapp')
         .click('#runTabView button[class^="instanceButton"]')
         .waitForElementPresent('.instance:nth-of-type(2)')
         .click('.instance:nth-of-type(2) > div > button')