From 8a3ed3591d99f42f20b25e84d17936ecfe2121fd Mon Sep 17 00:00:00 2001 From: David Disu Date: Tue, 28 Dec 2021 16:23:15 +0100 Subject: [PATCH] Remove yo-yo dependency in run-tab --- apps/remix-ide/src/app/udapp/run-tab.js | 16 +------ .../remix-ui/run-tab/src/lib/actions/index.ts | 12 ++++- .../run-tab/src/lib/actions/payload.ts | 15 ++++++- .../src/lib/components/environment.tsx | 40 +---------------- .../run-tab/src/lib/components/settingsUI.tsx | 2 +- .../run-tab/src/lib/components/web3Dialog.tsx | 44 +++++++++++++++++++ .../run-tab/src/lib/reducers/runTab.ts | 26 ++++++++++- libs/remix-ui/run-tab/src/lib/run-tab.tsx | 24 +++++++++- libs/remix-ui/run-tab/src/lib/types/index.ts | 7 ++- 9 files changed, 122 insertions(+), 64 deletions(-) create mode 100644 libs/remix-ui/run-tab/src/lib/components/web3Dialog.tsx diff --git a/apps/remix-ide/src/app/udapp/run-tab.js b/apps/remix-ide/src/app/udapp/run-tab.js index 40db3bdb2b..5fe56053fa 100644 --- a/apps/remix-ide/src/app/udapp/run-tab.js +++ b/apps/remix-ide/src/app/udapp/run-tab.js @@ -4,10 +4,8 @@ import { RunTabUI } from '@remix-ui/run-tab' import { ViewPlugin } from '@remixproject/engine-web' import * as packageJson from '../../../../../package.json' -const yo = require('yo-yo') const EventManager = require('../../lib/events') const Recorder = require('../tabs/runTab/model/recorder.js') -const toaster = require('../ui/tooltip') const _paq = window._paq = window._paq || [] const profile = { @@ -65,18 +63,8 @@ export class RunTab extends ViewPlugin { async setEnvironmentMode (env) { const canCall = await this.askUserPermission('setEnvironmentMode', 'change the environment used') if (canCall) { - toaster(yo` -
- - - ${this.currentRequest.from} - - is changing your environment to - ${env} - -
- `, '', { time: 3000 }) - this.settingsUI.setExecutionContext(env) + env = typeof env === 'string' ? { context: env } : env + this.emit('setEnvironmentModeReducer', env, this.currentRequest.from) } } diff --git a/libs/remix-ui/run-tab/src/lib/actions/index.ts b/libs/remix-ui/run-tab/src/lib/actions/index.ts index abd2f3be6e..16b74d1ba5 100644 --- a/libs/remix-ui/run-tab/src/lib/actions/index.ts +++ b/libs/remix-ui/run-tab/src/lib/actions/index.ts @@ -3,7 +3,7 @@ import React from 'react' import * as ethJSUtil from 'ethereumjs-util' import Web3 from 'web3' import { addressToString, createNonClashingNameAsync, shortenAddress } from '@remix-ui/helper' -import { addNewInstance, addProvider, clearAllInstances, clearRecorderCount, displayNotification, displayPopUp, fetchAccountsListFailed, fetchAccountsListRequest, fetchAccountsListSuccess, fetchContractListSuccess, hidePopUp, removeExistingInstance, removeProvider, setBaseFeePerGas, setConfirmSettings, setCurrentFile, setDecodedResponse, setExecutionEnvironment, setExternalEndpoint, setGasLimit, setGasPrice, setGasPriceStatus, setIpfsCheckedState, setLoadType, setMatchPassphrase, setMaxFee, setMaxPriorityFee, setNetworkName, setPassphrase, setPathToScenario, setRecorderCount, setSelectedAccount, setSendUnit, setSendValue, setTxFeeContent } from './payload' +import { addNewInstance, addProvider, clearAllInstances, clearRecorderCount, displayNotification, displayPopUp, fetchAccountsListFailed, fetchAccountsListRequest, fetchAccountsListSuccess, fetchContractListSuccess, hidePopUp, removeExistingInstance, removeProvider, setBaseFeePerGas, setConfirmSettings, setCurrentFile, setDecodedResponse, setEnvToasterContent, setExecutionEnvironment, setExternalEndpoint, setGasLimit, setGasPrice, setGasPriceStatus, setIpfsCheckedState, setLoadType, setMatchPassphrase, setMaxFee, setMaxPriorityFee, setNetworkName, setPassphrase, setPathToScenario, setRecorderCount, setSelectedAccount, setSendUnit, setSendValue, setTxFeeContent, setWeb3Dialog } from './payload' import { RunTab } from '../types/run-tab' import { CompilerAbstract } from '@remix-project/remix-solidity' import * as remixLib from '@remix-project/remix-lib' @@ -102,6 +102,11 @@ const setupEvents = () => { plugin.on('optimism-compiler', 'compilationFinished', (file, source, languageVersion, data) => broadcastCompilationResult(file, source, languageVersion, data)) + plugin.on('udapp', 'setEnvironmentModeReducer', (env: { context: string, fork: string }, from: string) => { + dispatch(displayPopUp(plugin.REACT_API.envToasterContent(env, from))) + setExecutionContext(env, plugin.REACT_API.web3Dialog()) + }) + plugin.fileManager.events.on('currentFileChanged', (currentFile: string) => { if (/.(.abi)$/.exec(currentFile)) { dispatch(setLoadType('abi')) @@ -124,6 +129,11 @@ const setupEvents = () => { }) } +export const initWebDialogs = (envToasterContent: (env: { context: string, fork: string }, from: string) => void, web3Dialog: () => void) => async (dispatch: React.Dispatch) => { + dispatch(setEnvToasterContent(envToasterContent)) + dispatch(setWeb3Dialog) +} + const updateAccountBalances = () => { const accounts = plugin.REACT_API.accounts.loadedAccounts 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 781da041ec..7ba6172b32 100644 --- a/libs/remix-ui/run-tab/src/lib/actions/payload.ts +++ b/libs/remix-ui/run-tab/src/lib/actions/payload.ts @@ -104,7 +104,7 @@ export const setExternalEndpoint = (endpoint: string) => { } } -export const displayPopUp = (message: string) => { +export const displayPopUp = (message: string | JSX.Element) => { return { type: 'DISPLAY_POPUP_MESSAGE', payload: message @@ -269,3 +269,16 @@ export const clearRecorderCount = () => { type: 'CLEAR_RECORDER_COUNT' } } + +export const setEnvToasterContent = (content: (env: { context: string, fork: string }, from: string) => void) => { + return { + type: 'SET_ENV_TOASTER_CONTENT', + payload: content + } +} + +export const setWeb3Dialog = () => { + return { + type: 'SET_WEB3_DIALOG' + } +} diff --git a/libs/remix-ui/run-tab/src/lib/components/environment.tsx b/libs/remix-ui/run-tab/src/lib/components/environment.tsx index 3c91ed9741..852d376d8f 100644 --- a/libs/remix-ui/run-tab/src/lib/components/environment.tsx +++ b/libs/remix-ui/run-tab/src/lib/components/environment.tsx @@ -3,55 +3,17 @@ import React from 'react' import { EnvironmentProps } from '../types' export function EnvironmentUI (props: EnvironmentProps) { - const handleInputEndpoint = (e: any) => { - props.setWeb3Endpoint(e.target.value) - } - const handleChangeExEnv = (env: string) => { const provider = props.providers.providerList.find(exEnv => exEnv.value === env) const fork = provider.fork // can be undefined if connected to an external source (web3 provider / injected) let context = provider.value context = context.startsWith('vm') ? 'vm' : context // context has to be 'vm', 'web3' or 'injected' - const displayContent = web3ProviderDialogBody() + const displayContent = props.web3ProviderDialog() props.setExecutionContext({ context, fork }, displayContent) } - const web3ProviderDialogBody = () => { - const thePath = '' - - return ( - <> -
- Note: To use Geth & https://remix.ethereum.org, configure it to allow requests from Remix:(see Geth Docs on rpc server) -
geth --http --http.corsdomain https://remix.ethereum.org
-
- To run Remix & a local Geth test node, use this command: (see Geth Docs on Dev mode) -
geth --http --http.corsdomain="${window.origin}" --http.api web3,eth,debug,personal,net --vmdebug --datadir ${thePath} --dev console
-
-
- WARNING: It is not safe to use the --http.corsdomain flag with a wildcard: --http.corsdomain * -
-
For more info: Remix Docs on Web3 Provider -
-
- Web3 Provider Endpoint -
- - - ) - } - return (