fix: resolved `remix.exeCurrent()` error

libs/remix-ui/terminal/src/lib/commands.ts

@@ -9,44 +9,48 @@ export const allCommands = [
   // { 'remix.execute(filepath)': 'Run the script specified by file path. If filepath is empty, script currently displayed in the editor is executed.' },
   { 'remix.exeCurrent()': 'Run the script currently displayed in the editor.' },
   // { 'remix.help()': 'Display this help message.' },
-  { 'remix.loadgist(id)': 'Load a gist in the file explorer.' },
+  // { 'remix.loadgist(id)': 'Load a gist in the file explorer.' },
-  { 'remix.loadurl(url)': 'Load the given url in the file explorer. The url can be of type github, swarm or ipfs.' },
+  // { 'remix.loadurl(url)': 'Load the given url in the file explorer. The url can be of type github, swarm or ipfs.' },
 
-  { 'swarmgw.get(url, cb)': 'Download files from Swarm via https://swarm-gateways.net/' },
+  // { 'swarmgw.get(url, cb)': 'Download files from Swarm via https://swarm-gateways.net/' },
-  { 'swarmgw.put(content, cb)': 'Upload files to Swarm via https://swarm-gateways.net/' },
+  // { 'swarmgw.put(content, cb)': 'Upload files to Swarm via https://swarm-gateways.net/' },
 
   { 'ethers.Contract': 'This API provides a graceful connection to a contract deployed on the blockchain, simplifying calling and querying its functions and handling all the binary protocol and conversion as necessarily.' },
-  { 'ethers.HDNode': 'A Hierarchical Deterministic Wallet represents a large tree of private keys which can reliably be reproduced from an initial seed.' },
+  // { 'ethers.HDNode': 'A Hierarchical Deterministic Wallet represents a large tree of private keys which can reliably be reproduced from an initial seed.' },
-  { 'ethers.Interface': 'The Interface Object is a meta-class that accepts a Solidity (or compatible) Application Binary Interface (ABI) and populates functions to deal with encoding and decoding the parameters to pass in and results returned.' },
+  // { 'ethers.Interface': 'The Interface Object is a meta-class that accepts a Solidity (or compatible) Application Binary Interface (ABI) and populates functions to deal with encoding and decoding the parameters to pass in and results returned.' },
   { 'ethers.providers': 'A Provider abstracts a connection to the Ethereum blockchain, for issuing queries and sending state changing transactions.' },
-  { 'ethers.SigningKey': 'The SigningKey interface provides an abstraction around the secp256k1 elliptic curve cryptography library.' },
+  // { 'ethers.SigningKey': 'The SigningKey interface provides an abstraction around the secp256k1 elliptic curve cryptography library.' },
-  { 'ethers.utils': 'The utility functions exposed in both the ethers umbrella package and the ethers-utils.' },
+  // { 'ethers.utils': 'The utility functions exposed in both the ethers umbrella package and the ethers-utils.' },
-  { 'ethers.utils.AbiCoder': 'Create a new ABI Coder object' },
+  // { 'ethers.utils.AbiCoder': 'Create a new ABI Coder object' },
-  { 'ethers.utils.RLP': 'This encoding method is used internally for several aspects of Ethereum, such as encoding transactions and determining contract addresses.' },
+  // { 'ethers.utils.RLP': 'This encoding method is used internally for several aspects of Ethereum, such as encoding transactions and determining contract addresses.' },
   { 'ethers.Wallet': 'A wallet manages a private/public key pair which is used to cryptographically sign transactions and prove ownership on the Ethereum network.' },
   { 'ethers.version': 'Contains the version of the ethers container object.' },
 
   { 'web3.eth': 'Eth module for interacting with the Ethereum network.' },
   { 'web3.eth.accounts': 'The web3.eth.accounts contains functions to generate Ethereum accounts and sign transactions and data.' },
-  { 'web3.eth.abi': 'The web3.eth.abi functions let you de- and encode parameters to ABI (Application Binary Interface) for function calls to the EVM (Ethereum Virtual Machine).' },
+  //TODO: need to break down the object return from abi response
+  // { 'web3.eth.abi': 'The web3.eth.abi functions let you de- and encode parameters to ABI (Application Binary Interface) for function calls to the EVM (Ethereum Virtual Machine).' },
   { 'web3.eth.ens': 'The web3.eth.ens functions let you interacting with ENS.' },
   { 'web3.eth.Iban': 'The web3.eth.Iban function lets convert Ethereum addresses from and to IBAN and BBAN.' },
   { 'web3.eth.net': 'Net module for interacting with network properties.' },
   { 'web3.eth.personal': 'Personal module for interacting with the Ethereum accounts.' },
   { 'web3.eth.subscribe': 'The web3.eth.subscribe function lets you subscribe to specific events in the blockchain.' },
   { 'web3.givenProvider': 'When using web3.js in an Ethereum compatible browser, it will set with the current native provider by that browser. Will return the given provider by the (browser) environment, otherwise null.' },
-  { 'web3.modules': 'Contains the version of the web3 container object.' },
+  // { 'web3.modules': 'Contains the version of the web3 container object.' },
   { 'web3.providers': 'Contains the current available providers.' },
   { 'web3.shh': 'Shh module for interacting with the whisper protocol' },
   { 'web3.utils': 'This package provides utility functions for Ethereum dapps and other web3.js packages.' },
   { 'web3.version': 'Contains the version of the web3 container object.' },
 
   { 'web3.eth.clearSubscriptions();': 'Resets subscriptions.' },
-  { 'web3.eth.Contract(jsonInterface[, address][, options])': 'The web3.eth.Contract object makes it easy to interact with smart contracts on the ethereum blockchain.' },
+//   { 'web3.eth.Contract(jsonInterface[, address][, options])': 'The web3.eth.Contract object makes it easy to interact with smart contracts on the ethereum blockchain.' },
-  { 'web3.eth.accounts.create([entropy]);': 'The web3.eth.accounts contains functions to generate Ethereum accounts and sign transactions and data.' },
+//   { 'web3.eth.accounts.create([entropy]);': 'The web3.eth.accounts contains functions to generate Ethereum accounts and sign transactions and data.' },
-  { 'web3.eth.getAccounts();': 'Retrieve the list of accounts' },
+//   { 'web3.eth.getAccounts();': 'Retrieve the list of accounts' },
-  { 'web3.eth.accounts.privateKeyToAccount(privateKey [, ignoreLength ]);': 'Get the account from the private key' },
+//   { 'web3.eth.accounts.privateKeyToAccount(privateKey [, ignoreLength ]);': 'Get the account from the private key' },
-  { 'web3.eth.accounts.signTransaction(tx, privateKey [, callback]);': 'Sign Transaction' },
+//   { 'web3.eth.accounts.signTransaction(tx, privateKey [, callback]);': 'Sign Transaction' },
-  { 'web3.eth.accounts.recoverTransaction(rawTransaction);': 'Sign Transaction' },
+//   { 'web3.eth.accounts.recoverTransaction(rawTransaction);': 'Sign Transaction' },
-  { 'web3.eth.accounts.hashMessage(message);': 'Hash message' }
+//   { 'web3.eth.accounts.hashMessage(message);': 'Hash message' }
 ]
+
+
+  

libs/remix-ui/terminal/src/lib/remix-ui-terminal.css

@@ -6,7 +6,8 @@ element.style {
   width: 95%;
   background: transparent;
   border: none;
-  color: #a2a3bd;
+  font-weight: bold;
+  color: #a2a3b4;
   border-top-style: hidden;
   border-right-style: hidden;
   border-left-style: hidden;

libs/remix-ui/terminal/src/lib/remix-ui-terminal.tsx

@@ -67,6 +67,7 @@ export const RemixUiTerminal = (props: RemixUiTerminalProps) => {
   const [scriptRunnserState, scriptRunnerDispatch] = useReducer(registerScriptRunnerReducer, initialState)
   const [isListeningOnNetwork, setIsListeningOnNetwork] = useState(false)
   const [clearConsole, setClearConsole] = useState(false)
+  const [paste, setPaste] = useState(false)
   const [autoCompletState, setAutoCompleteState] = useState({
     activeSuggestion: 0,
     data: {
@@ -175,7 +176,7 @@ export const RemixUiTerminal = (props: RemixUiTerminalProps) => {
     if (script.indexOf('remix.') === 0) {
       // we keep the old feature. This will basically only be called when the command is querying the "remix" object.
       // for all the other case, we use the Code Executor plugin
-      const context = execute(undefined, undefined)
+      const context = { remix: { exeCurrent: () => { return execute(undefined, undefined) } } } 
       try {
         const cmds = vm.createContext(context)
         const result = vm.runInContext(script, cmds)
@@ -420,7 +421,13 @@ export const RemixUiTerminal = (props: RemixUiTerminalProps) => {
     event.preventDefault()
     const inputString = event.target.value
     if (matched(allPrograms, inputString) || inputString.includes('.')) {
-      setAutoCompleteState(prevState => ({ ...prevState, showSuggestions: true, userInput: inputString }))
+      console.log(paste, 'onchange')
+      if (paste) {
+        setPaste(false)
+        setAutoCompleteState(prevState => ({ ...prevState, showSuggestions: false, userInput: inputString }))
+      } else {
+        setAutoCompleteState(prevState => ({ ...prevState, showSuggestions: true, userInput: inputString }))
+      }
       const textList = inputString.split('.')
       if (textList.length === 1) {
         setAutoCompleteState(prevState => ({ ...prevState, data: { _options: [] } }))
@@ -495,7 +502,7 @@ export const RemixUiTerminal = (props: RemixUiTerminalProps) => {
       return (
         <div>
           <span className='txLog_7Xiho'>
-            <span className='tx'>[block:${block} txIndex:${i}]</span>
+            <span className='tx'>[block:{block} txIndex:{i}]</span>
             <div className='txItem'><span className='txItemTitle'>from:</span> {from}</div>
             <div className='txItem'><span className='txItemTitle'>to:</span> {to}</div>
             <div className='txItem'><span className='txItemTitle'>value:</span> {value} wei</div>
@@ -510,7 +517,7 @@ export const RemixUiTerminal = (props: RemixUiTerminalProps) => {
       return (
         <div>
           <span className='txLog'>
-            <span className='tx'>[block:${block} txIndex:${i}]</span>
+            <span className='tx'>[block:{block} txIndex:{i}]</span>
             <div className='txItem'><span className='txItemTitle'>from:</span> {from}</div>
             <div className='txItem'><span className='txItemTitle'>to:</span> {to}</div>
             <div className='txItem'><span className='txItemTitle'>value:</span> {value} wei</div>
@@ -759,10 +766,16 @@ export const RemixUiTerminal = (props: RemixUiTerminalProps) => {
   )
   /* end of autoComplete */
 
+  const handlePaste = () => {
+    setPaste(true)
+    setAutoCompleteState(prevState => ({ ...prevState, activeSuggestion: 0, showSuggestions: false}))
+  }
+
   return (
     <div style={{ height: '323px', flexGrow: 1 }} className='panel'>
       {console.log({ newstate })}
       {console.log({ props })}
+      {console.log({ autoCompletState })}
       <div className="bar">
         {/* ${self._view.dragbar} */}
         <div className="dragbarHorizontal" onMouseDown={mousedown} id='dragId'></div>
@@ -824,7 +837,7 @@ export const RemixUiTerminal = (props: RemixUiTerminalProps) => {
             {newstate.journalBlocks && newstate.journalBlocks.map((x, index) => {
               if (x.name === 'emptyBlock') {
                 return (
-                  <div className="px-4 block" data-id="block_null" key={index}>
+                  <div className="px-4 block" data-id='block_null' key={index}>
                     <span className='txLog'>
                       <span className='tx'><div className='txItem'>[<span className='txItemTitle'>block:{x.message} - </span> 0 {'transactions'} ] </div></span></span>
                   </div>
@@ -845,7 +858,7 @@ export const RemixUiTerminal = (props: RemixUiTerminalProps) => {
           </div>
           <div id="terminalCli" data-id="terminalCli" className="cli" onClick={focusinput}>
             <span className="prompt">{'>'}</span>
-            <input className="input" ref={inputEl} spellCheck="false" contentEditable="true" id="terminalCliInput" data-id="terminalCliInput" onChange={(event) => onChange(event)} onKeyDown={(event) => handleKeyDown(event) } value={autoCompletState.userInput}></input>
+            <input className="input" ref={inputEl} spellCheck="false" contentEditable="true" id="terminalCliInput" data-id="terminalCliInput" onChange={(event) => onChange(event)} onKeyDown={(event) => handleKeyDown(event) } value={autoCompletState.userInput} onPaste={handlePaste}></input>
           </div>
         </div>
       </div>