Fixed bugs and tests

apps/remix-ide-e2e/src/commands/getEditorValue.ts

@@ -12,6 +12,7 @@ class GetEditorValue extends EventEmitter {
         done()
         const value = typeof result.value === 'string' ? result.value : null
 
+        console.log('value')
         callback(value)
         this.emit('complete')
       })

apps/remix-ide-e2e/src/commands/removeFile.ts

@@ -34,7 +34,7 @@ function removeFile (browser: NightwatchBrowser, path: string, workspace: string
     contextMenuClick(document.querySelector('[data-path="' + path + '"]'))
   }, [path], function () {
     browser
-      .waitForElementVisible('#menuitemdelete')
+      .waitForElementVisible('#menuitemdelete', 60000)
       .click('#menuitemdelete')
       .pause(2000)
       .perform(() => {

apps/remix-ide-e2e/src/tests/remixd.test.ts

@@ -82,7 +82,7 @@ module.exports = {
   'Close Remixd': function (browser) {
     browser
       .clickLaunchIcon('pluginManager')
-      .scrollAndClick('#pluginManager article[id="remixPluginManagerListItem_remixd"] button')
+      .scrollAndClick('#pluginManager *[data-id="pluginManagerComponentDeactivateButtonremixd"]')
       .end()
   }
 }

apps/remix-ide/contracts/.deps/github/OpenZeppelin/openzeppelin-contracts/contracts/token/ERC20/IERC20.sol

-// SPDX-License-Identifier: MIT
-
-pragma solidity ^0.8.0;
-
-/**
- * @dev Interface of the ERC20 standard as defined in the EIP.
- */
-interface IERC20 {
-    /**
-     * @dev Returns the amount of tokens in existence.
-     */
-    function totalSupply() external view returns (uint256);
-
-    /**
-     * @dev Returns the amount of tokens owned by `account`.
-     */
-    function balanceOf(address account) external view returns (uint256);
-
-    /**
-     * @dev Moves `amount` tokens from the caller's account to `recipient`.
-     *
-     * Returns a boolean value indicating whether the operation succeeded.
-     *
-     * Emits a {Transfer} event.
-     */
-    function transfer(address recipient, uint256 amount) external returns (bool);
-
-    /**
-     * @dev Returns the remaining number of tokens that `spender` will be
-     * allowed to spend on behalf of `owner` through {transferFrom}. This is
-     * zero by default.
-     *
-     * This value changes when {approve} or {transferFrom} are called.
-     */
-    function allowance(address owner, address spender) external view returns (uint256);
-
-    /**
-     * @dev Sets `amount` as the allowance of `spender` over the caller's tokens.
-     *
-     * Returns a boolean value indicating whether the operation succeeded.
-     *
-     * IMPORTANT: Beware that changing an allowance with this method brings the risk
-     * that someone may use both the old and the new allowance by unfortunate
-     * transaction ordering. One possible solution to mitigate this race
-     * condition is to first reduce the spender's allowance to 0 and set the
-     * desired value afterwards:
-     * https://github.com/ethereum/EIPs/issues/20#issuecomment-263524729
-     *
-     * Emits an {Approval} event.
-     */
-    function approve(address spender, uint256 amount) external returns (bool);
-
-    /**
-     * @dev Moves `amount` tokens from `sender` to `recipient` using the
-     * allowance mechanism. `amount` is then deducted from the caller's
-     * allowance.
-     *
-     * Returns a boolean value indicating whether the operation succeeded.
-     *
-     * Emits a {Transfer} event.
-     */
-    function transferFrom(
-        address sender,
-        address recipient,
-        uint256 amount
-    ) external returns (bool);
-
-    /**
-     * @dev Emitted when `value` tokens are moved from one account (`from`) to
-     * another (`to`).
-     *
-     * Note that `value` may be zero.
-     */
-    event Transfer(address indexed from, address indexed to, uint256 value);
-
-    /**
-     * @dev Emitted when the allowance of a `spender` for an `owner` is set by
-     * a call to {approve}. `value` is the new allowance.
-     */
-    event Approval(address indexed owner, address indexed spender, uint256 value);
-}

apps/remix-ide/contracts/.deps/github/OpenZeppelin/openzeppelin-contracts/contracts/token/ERC20/extensions/IERC20Metadata.sol

-// SPDX-License-Identifier: MIT
-
-pragma solidity ^0.8.0;
-
-import "../IERC20.sol";
-
-/**
- * @dev Interface for the optional metadata functions from the ERC20 standard.
- *
- * _Available since v4.1._
- */
-interface IERC20Metadata is IERC20 {
-    /**
-     * @dev Returns the name of the token.
-     */
-    function name() external view returns (string memory);
-
-    /**
-     * @dev Returns the symbol of the token.
-     */
-    function symbol() external view returns (string memory);
-
-    /**
-     * @dev Returns the decimals places of the token.
-     */
-    function decimals() external view returns (uint8);
-}

apps/remix-ide/contracts/.deps/github/OpenZeppelin/openzeppelin-contracts/contracts/utils/Context.sol

-// SPDX-License-Identifier: MIT
-
-pragma solidity ^0.8.0;
-
-/**
- * @dev Provides information about the current execution context, including the
- * sender of the transaction and its data. While these are generally available
- * via msg.sender and msg.data, they should not be accessed in such a direct
- * manner, since when dealing with meta-transactions the account sending and
- * paying for execution may not be the actual sender (as far as an application
- * is concerned).
- *
- * This contract is only required for intermediate, library-like contracts.
- */
-abstract contract Context {
-    function _msgSender() internal view virtual returns (address) {
-        return msg.sender;
-    }
-
-    function _msgData() internal view virtual returns (bytes calldata) {
-        return msg.data;
-    }
-}

apps/remix-ide/contracts/folder1/contract_chrome_toremove.sol

+contract test2 { function get () returns (uint) { return 11; }}
\ No newline at end of file

apps/remix-ide/src/app/components/plugin-manager-component.js

@@ -38,10 +38,7 @@ class PluginManagerComponent extends ViewPlugin {
     this.inactivePlugins = []
     this.activeProfiles = this.appManager.actives
     this._paq = _paq
-  }
-
-  triggerEngineEventListener () {
-    this.engine.event.on('onRegistration', () => this.renderComponent())
+    this.listenOnEvent()
   }
 
   /**
@@ -61,10 +58,6 @@ class PluginManagerComponent extends ViewPlugin {
    */
   activateP (name) {
     this.appManager.activatePlugin(name)
-    this.appManager.event.on('activate', () => {
-      this.getAndFilterPlugins()
-      this.triggerEngineEventListener()
-    })
     _paq.push(['trackEvent', 'manager', 'activate', name])
   }
 
@@ -91,10 +84,6 @@ class PluginManagerComponent extends ViewPlugin {
    */
   deactivateP (name) {
     this.call('manager', 'deactivatePlugin', name)
-    this.appManager.event.on('deactivate', () => {
-      this.getAndFilterPlugins()
-      this.triggerEngineEventListener()
-    })
     _paq.push(['trackEvent', 'manager', 'deactivate', name])
   }
 
@@ -107,7 +96,7 @@ class PluginManagerComponent extends ViewPlugin {
       <RemixUiPluginManager
         pluginComponent={this}
       />,
-      document.getElementById('pluginManager'))
+      this.htmlElement)
   }
 
   render () {
@@ -146,6 +135,16 @@ class PluginManagerComponent extends ViewPlugin {
     this.inactivePlugins = deactivatedPlugins
     this.renderComponent()
   }
+
+  listenOnEvent () {
+    this.engine.event.on('onRegistration', () => this.renderComponent())
+    this.appManager.event.on('activate', () => {
+      this.getAndFilterPlugins()
+    })
+    this.appManager.event.on('deactivate', () => {
+      this.getAndFilterPlugins()
+    })
+  }
 }
 
 module.exports = PluginManagerComponent

libs/remix-ui/plugin-manager/src/lib/components/ActivePluginCard.tsx

@@ -10,50 +10,47 @@ interface PluginCardProps {
   profile: any
   buttonText: string
   deactivatePlugin: (pluginName: string) => void
-  setActivePlugins: Dispatch<React.SetStateAction<Profile<any>[]>>
-  activePlugins: Profile[]
+  // setActivePlugins: Dispatch<React.SetStateAction<Profile<any>[]>>
+  // activePlugins: Profile[]
 }
 
 // eslint-disable-next-line no-empty-pattern
 function ActivePluginCard ({
   profile,
   buttonText,
-  deactivatePlugin,
-  activePlugins,
-  setActivePlugins
+  deactivatePlugin
+  // activePlugins,
+  // setActivePlugins
 }: PluginCardProps) {
-  const [displayName] = useState<string>((profile.displayName) ? profile.displayName : profile.name)
-  const [docLink] = useState<JSX.Element>((profile.documentation) ? (
-    <a href={profile.documentation} className="px-1" title="link to documentation" target="_blank" rel="noreferrer">
-      <i aria-hidden="true" className="fas fa-book"/>
-    </a>
-  ) : null)
-  const [versionWarning] = useState<JSX.Element>((profile.version && profile.version.match(/\b(\w*alpha\w*)\b/g)) ? (
-    <small title="Version Alpha" className="remixui_versionWarning plugin-version">alpha</small>
-  ) : (profile.version && profile.version.match(/\b(\w*beta\w*)\b/g)) ? (
-    <small title="Version Beta" className="remixui_versionWarning plugin-version">beta</small>
-  ) : null)
-
   return (
     <div className="list-group list-group-flush plugins-list-group" data-id="pluginManagerComponentActiveTile">
-      <article className="list-group-item py-1 mb-1 plugins-list-group-item" title={displayName}>
+      <article className="list-group-item py-1 mb-1 plugins-list-group-item" title={profile.displayName || profile.name}>
         <div className="remixui_row justify-content-between align-items-center mb-2">
           <h6 className="remixui_displayName plugin-name">
             <div>
-              {displayName}
-              {docLink}
-              {versionWarning}
+              { profile.displayName || profile.name }
+              { profile.documentation &&
+                <a href={profile.documentation} className="px-1" title="link to documentation" target="_blank" rel="noreferrer">
+                  <i aria-hidden="true" className="fas fa-book"/>
+                </a>
+              }
+              { profile.version && profile.version.match(/\b(\w*alpha\w*)\b/g)
+                ? <small title="Version Alpha" className="remixui_versionWarning plugin-version">alpha</small>
+                : profile.version && profile.version.match(/\b(\w*beta\w*)\b/g)
+                  ? <small title="Version Beta" className="remixui_versionWarning plugin-version">beta</small>
+                  : null
+              }
             </div>
             {<button
               onClick={() => {
                 deactivatePlugin(profile.name)
-                const actives: Profile[] = JSON.parse(localStorage.getItem('newActivePlugins'))
-                if (actives && actives.length) {
-                  const newList = _.remove(actives, active => active.name !== profile.name)
-                  // console.log('removed using lodash and this is the result', newList)
-                  localStorage.setItem('newActivePlugins', JSON.stringify(newList))
-                  setActivePlugins(newList)
-                }
+                // const actives: Profile[] = JSON.parse(localStorage.getItem('newActivePlugins'))
+                // if (actives && actives.length) {
+                //   const newList = _.remove(actives, active => active.name !== profile.name)
+                //   // console.log('removed using lodash and this is the result', newList)
+                //   localStorage.setItem('newActivePlugins', JSON.stringify(newList))
+                //   setActivePlugins(newList)
+                // }
               } }
               className="btn btn-secondary btn-sm"
               data-id={`pluginManagerComponentDeactivateButton${profile.name}`}

libs/remix-ui/plugin-manager/src/lib/components/ActivePluginCardContainer.tsx

@@ -10,32 +10,34 @@ interface ActivePluginCardContainerProps {
   activeProfiles: Profile[]
 }
 function ActivePluginCardContainer ({ pluginComponent }: ActivePluginCardContainerProps) {
-  const [activeProfiles, setActiveProfiles] = useState<Profile[]>()
+  // const [activeProfiles, setActiveProfiles] = useState<Profile[]>()
   const deactivatePlugin = (pluginName: string) => {
     pluginComponent.deactivateP(pluginName)
   }
 
-  useEffect(() => {
-    const savedActiveProfiles = JSON.parse(localStorage.getItem('newActivePlugins'))
-    if (pluginComponent.activePlugins && pluginComponent.activePlugins.length > 0) {
-      setActiveProfiles(pluginComponent.activePlugins)
-    } else if (savedActiveProfiles && savedActiveProfiles.length > 0 && pluginComponent.activePlugins.length === 0) {
-      setActiveProfiles(savedActiveProfiles)
-    }
-  }, [pluginComponent, pluginComponent.activePlugins])
+  // useEffect(() => {
+  //   const savedActiveProfiles = JSON.parse(localStorage.getItem('newActivePlugins'))
+  //   if (pluginComponent.activePlugins && pluginComponent.activePlugins.length > 0) {
+  //     setActiveProfiles(pluginComponent.activePlugins)
+  //   } else if (savedActiveProfiles && savedActiveProfiles.length > 0 && pluginComponent.activePlugins.length === 0) {
+  //     setActiveProfiles(savedActiveProfiles)
+  //   }
+  // }, [pluginComponent, pluginComponent.activePlugins])
   return (
     <Fragment>
-      {(activeProfiles && activeProfiles.length) ? <ModuleHeading headingLabel="Active Modules" count={activeProfiles.length} /> : null}
-      {activeProfiles && activeProfiles.map((profile, idx) => (
-        <ActivePluginCard
-          buttonText="Deactivate"
-          profile={profile}
-          deactivatePlugin={deactivatePlugin}
-          key={idx}
-          activePlugins={activeProfiles}
-          setActivePlugins={setActiveProfiles}
-        />
-      ))
+      {(pluginComponent.activePlugins && pluginComponent.activePlugins.length) ? <ModuleHeading headingLabel="Active Modules" count={pluginComponent.activePlugins.length} /> : null}
+      {pluginComponent.activePlugins && pluginComponent.activePlugins.map((profile, idx) => {
+        return (
+          <ActivePluginCard
+            buttonText="Deactivate"
+            profile={profile}
+            deactivatePlugin={deactivatePlugin}
+            key={idx}
+            // activePlugins={pluginComponent.activePlugins}
+            // setActivePlugins={setActiveProfiles}
+          />
+        )
+      })
       }
     </Fragment>
   )

libs/remix-ui/plugin-manager/src/lib/components/InactivePluginCard.tsx

@@ -7,7 +7,7 @@ interface PluginCardProps {
     icon?: string
   }
   buttonText: string
-  activatePlugin: (plugin: Profile) => void
+  activatePlugin: (plugin: string) => void
   // inactivePlugins: Profile[]
   // setInactivePlugins: Dispatch<React.SetStateAction<Profile<any>[]>>
   // setActivePlugins: Dispatch<React.SetStateAction<Profile<any>[]>>
@@ -21,38 +21,34 @@ function InactivePluginCard ({
   buttonText,
   activatePlugin
 }: PluginCardProps) {
-  const [displayName] = useState<string>((profile.displayName) ? profile.displayName : profile.name)
-  const [docLink] = useState<JSX.Element>((profile.documentation) ? (
-    <a href={profile.documentation} className="px-1" title="link to documentation" target="_blank" rel="noreferrer">
-      <i aria-hidden="true" className="fas fa-book"/>
-    </a>
-  ) : null)
-
-  const [versionWarning] = useState<JSX.Element>((profile.version && profile.version.match(/\b(\w*alpha\w*)\b/g)) ? (
-    <small title="Version Alpha" className="remixui_versionWarning plugin-version">alpha</small>
-  ) : (profile.version && profile.version.match(/\b(\w*beta\w*)\b/g)) ? (
-    <small title="Version Beta" className="remixui_versionWarning plugin-version">beta</small>
-  ) : null)
-
   return (
     <div className="list-group list-group-flush plugins-list-group" data-id="pluginManagerComponentActiveTile">
-      <article className="list-group-item py-1 mb-1 plugins-list-group-item" title={displayName}>
+      <article className="list-group-item py-1 mb-1 plugins-list-group-item" title={profile.displayName || profile.name}>
         <div className="remixui_row justify-content-between align-items-center mb-2">
           <h6 className="remixui_displayName plugin-name">
             <div>
-              {displayName}
-              {docLink}
-              {versionWarning}
+              { profile.displayName || profile.name }
+              { profile.documentation &&
+                <a href={profile.documentation} className="px-1" title="link to documentation" target="_blank" rel="noreferrer">
+                  <i aria-hidden="true" className="fas fa-book"/>
+                </a>
+              }
+              { profile.version && profile.version.match(/\b(\w*alpha\w*)\b/g)
+                ? <small title="Version Alpha" className="remixui_versionWarning plugin-version">alpha</small>
+                : profile.version && profile.version.match(/\b(\w*beta\w*)\b/g)
+                  ? <small title="Version Beta" className="remixui_versionWarning plugin-version">beta</small>
+                  : null
+              }
             </div>
             {
               <button
                 onClick={() => {
-                  activatePlugin(profile)
-                  const newActives: Profile[] = JSON.parse(localStorage.getItem('newActivePlugins'))
-                  if (!newActives.includes(profile)) {
-                    newActives.push(profile)
-                    localStorage.setItem('newActivePlugins', JSON.stringify(newActives))
-                  }
+                  activatePlugin(profile.name)
+                  // const newActives: Profile[] = JSON.parse(localStorage.getItem('newActivePlugins'))
+                  // if (!newActives.includes(profile)) {
+                  //   newActives.push(profile)
+                  //   localStorage.setItem('newActivePlugins', JSON.stringify(newActives))
+                  // }
                 }}
                 className="btn btn-success btn-sm"
                 data-id={`pluginManagerComponentActivateButton${profile.name}`}

libs/remix-ui/plugin-manager/src/lib/components/InactivePluginCardContainer.tsx

@@ -21,39 +21,42 @@ interface LocalPluginInterface {
   iframe: {}
 }
 function InactivePluginCardContainer ({ pluginComponent, setInactiveProfiles, inactiveProfiles }: InactivePluginCardContainerProps) {
-  const activatePlugin = (profile: Profile) => {
-    pluginComponent.activateP(profile.name)
+  const activatePlugin = (pluginName: string) => {
+    pluginComponent.activateP(pluginName)
   }
 
-  useEffect(() => {
-    const savedLocalPlugins: LocalPluginInterface = JSON.parse(localStorage.getItem('plugins/local'))
-    const savedActiveProfiles: Profile[] = JSON.parse(localStorage.getItem('newActivePlugins'))
-    if (pluginComponent.inactivePlugins && pluginComponent.inactivePlugins.length) {
-      let temp: Profile[] = []
-      if (Object.keys(savedLocalPlugins).length) {
-        temp = [...pluginComponent.inactivePlugins, savedLocalPlugins.profile as Profile]
-      } else {
-        temp = [...pluginComponent.inactivePlugins]
-      }
-      const filtered = temp.filter(t => {
-        return !savedActiveProfiles.find(active => {
-          return active.name === t.name
-        })
-      })
-      setInactiveProfiles(filtered)
-    }
-  }, [pluginComponent, pluginComponent.inactivePlugins, setInactiveProfiles])
+  // useEffect(() => {
+  //   const savedLocalPlugins: LocalPluginInterface = JSON.parse(localStorage.getItem('plugins/local'))
+  //   const savedActiveProfiles: Profile[] = JSON.parse(localStorage.getItem('newActivePlugins'))
+  //   if (pluginComponent.inactivePlugins && pluginComponent.inactivePlugins.length) {
+  //     let temp: Profile[] = []
+  //     if (Object.keys(savedLocalPlugins).length) {
+  //       temp = [...pluginComponent.inactivePlugins, savedLocalPlugins.profile as Profile]
+  //     } else {
+  //       temp = [...pluginComponent.inactivePlugins]
+  //     }
+  //     const filtered = temp.filter(t => {
+  //       return !savedActiveProfiles.find(active => {
+  //         return active.name === t.name
+  //       })
+  //     })
+  //     setInactiveProfiles(filtered)
+  //   }
+  // }, [pluginComponent, pluginComponent.inactivePlugins, setInactiveProfiles])
   return (
     <Fragment>
-      {(inactiveProfiles && inactiveProfiles.length) ? <ModuleHeading headingLabel="Inactive Modules" count={inactiveProfiles.length} /> : null}
-      {inactiveProfiles && inactiveProfiles.map((profile, idx) => (
-        <InactivePluginCard
-          buttonText="Activate"
-          profile={profile}
-          key={idx}
-          activatePlugin={activatePlugin}
-        />
-      ))
+      {(pluginComponent.inactivePlugins && pluginComponent.inactivePlugins.length) ? <ModuleHeading headingLabel="Inactive Modules" count={pluginComponent.inactivePlugins.length} /> : null}
+      {pluginComponent.inactivePlugins && pluginComponent.inactivePlugins.map((profile, idx) => {
+        // console.log('profile: ', profile)
+        return (
+          <InactivePluginCard
+            buttonText="Activate"
+            profile={profile}
+            key={idx}
+            activatePlugin={activatePlugin}
+          />
+        )
+      })
       }
     </Fragment>
   )

libs/remix-ui/plugin-manager/src/lib/components/LocalPluginForm.tsx

 /* eslint-disable no-debugger */
-import React, { Dispatch, useReducer } from 'react'
+import React, { Dispatch, useReducer, useState } from 'react'
 import { ModalDialog } from '@remix-ui/modal-dialog'
 import { Toaster } from '@remix-ui/toaster'
 import { IframePlugin, WebsocketPlugin } from '@remixproject/engine-web'
@@ -14,45 +14,49 @@ interface LocalPluginFormProps {
   pluginManager: PluginManagerComponent
 }
 
-const handleModalOkClick = async (pluginManager: PluginManagerComponent, plugin: FormStateProps,
-  toastDispatcher: Dispatch<localPluginReducerActionType>) => {
-  try {
-    const profile = JSON.parse(localStorage.getItem('plugins/local'))
-    if (profile && profile.profile && Object.keys(profile).length > 0) {
-      if (pluginManager.appManager.getIds().includes(profile.profile.name)) {
+const defaultProfile = {
+  methods: [],
+  location: 'sidePanel',
+  type: 'iframe'
+}
+
+function LocalPluginForm ({ changeHandler, plugin, closeModal, visible, pluginManager }: LocalPluginFormProps) {
+  const [errorMsg, dispatchToastMsg] = useReducer(localPluginToastReducer, '')
+  const [defaultPlugin] = useState<FormStateProps>(JSON.parse(localStorage.getItem('plugins/local')) || defaultProfile)
+
+  const handleModalOkClick = async () => {
+    try {
+      if (!plugin.name) throw new Error('Plugin should have a name')
+      if (pluginManager.appManager.getIds().includes(plugin.name)) {
         throw new Error('This name has already been used')
       }
-    }
-    if (!plugin.location) throw new Error('Plugin should have a location')
-    if (!plugin.name) throw new Error('Plugin should have a name')
-    if (!plugin.url) throw new Error('Plugin should have an URL')
-    plugin.methods = plugin.methods.split(',').filter(val => val)
-    const localPlugin = plugin.type === 'iframe' ? new IframePlugin(plugin) : new WebsocketPlugin(plugin)
+      if (!plugin.location) throw new Error('Plugin should have a location')
+      if (!plugin.url) throw new Error('Plugin should have an URL')
+      plugin.methods = typeof plugin.methods === 'string' ? plugin.methods.split(',').filter(val => val) : []
+      const localPlugin = plugin.type === 'iframe' ? new IframePlugin(plugin) : new WebsocketPlugin(plugin)
 
-    localPlugin.profile.hash = `local-${plugin.name}`
-    const targetPlugin = {
-      name: localPlugin.profile.name,
-      displayName: localPlugin.profile.displayName,
-      description: (localPlugin.profile.description !== undefined ? localPlugin.profile.description : ''),
-      documentation: localPlugin.profile.url,
-      events: (localPlugin.profile.events !== undefined ? localPlugin.profile.events : []),
-      hash: localPlugin.profile.hash,
-      kind: (localPlugin.profile.kind !== undefined ? localPlugin.profile.kind : ''),
-      methods: localPlugin.profile.methods,
-      type: plugin.type,
-      location: plugin.location,
-      icon: 'assets/img/localPlugin.webp'
+      localPlugin.profile.hash = `local-${plugin.name}`
+      const targetPlugin = {
+        name: localPlugin.profile.name,
+        displayName: localPlugin.profile.displayName,
+        description: (localPlugin.profile.description !== undefined ? localPlugin.profile.description : ''),
+        documentation: localPlugin.profile.url,
+        events: (localPlugin.profile.events !== undefined ? localPlugin.profile.events : []),
+        hash: localPlugin.profile.hash,
+        kind: (localPlugin.profile.kind !== undefined ? localPlugin.profile.kind : ''),
+        methods: localPlugin.profile.methods,
+        type: plugin.type,
+        location: plugin.location,
+        icon: 'assets/img/localPlugin.webp'
+      }
+      localPlugin.profile = { ...localPlugin.profile, ...targetPlugin }
+      pluginManager.activateAndRegisterLocalPlugin(localPlugin)
+    } catch (error) {
+      const action: localPluginReducerActionType = { type: 'show', payload: `${error.message}` }
+      dispatchToastMsg(action)
+      console.log(error)
     }
-    localPlugin.profile = { ...localPlugin.profile, ...targetPlugin }
-    pluginManager.activateAndRegisterLocalPlugin(localPlugin)
-  } catch (error) {
-    const action: localPluginReducerActionType = { type: 'show', payload: `${error.message}` }
-    toastDispatcher(action)
-    console.log(error)
   }
-}
-function LocalPluginForm ({ changeHandler, plugin, closeModal, visible, pluginManager }: LocalPluginFormProps) {
-  const [errorMsg, dispatchToastMsg] = useReducer(localPluginToastReducer, '')
 
   return (
     <><ModalDialog
@@ -61,7 +65,7 @@ function LocalPluginForm ({ changeHandler, plugin, closeModal, visible, pluginMa
       hide={visible}
       title="Local Plugin"
       okLabel="OK"
-      okFn={() => handleModalOkClick(pluginManager, plugin, dispatchToastMsg) }
+      okFn={ handleModalOkClick }
       cancelLabel="Cancel"
       cancelFn={closeModal}
     >
@@ -71,7 +75,7 @@ function LocalPluginForm ({ changeHandler, plugin, closeModal, visible, pluginMa
           <input
             className="form-control"
             onChange={e => changeHandler('name', e.target.value)}
-            value={plugin.name}
+            value={ plugin.name || defaultPlugin.name }
             id="plugin-name"
             data-id="localPluginName"
             placeholder="Should be camelCase" />
@@ -81,7 +85,7 @@ function LocalPluginForm ({ changeHandler, plugin, closeModal, visible, pluginMa
           <input
             className="form-control"
             onChange={e => changeHandler('displayName', e.target.value)}
-            value={plugin.displayName}
+            value={ plugin.displayName || defaultPlugin.displayName }
             id="plugin-displayname"
             data-id="localPluginDisplayName"
             placeholder="Name in the header" />
@@ -91,7 +95,7 @@ function LocalPluginForm ({ changeHandler, plugin, closeModal, visible, pluginMa
           <input
             className="form-control"
             onChange={e => changeHandler('methods', e.target.value)}
-            value={plugin.methods}
+            value={plugin.methods || defaultPlugin.methods}
             id="plugin-methods"
             data-id="localPluginMethods"
             placeholder="Name in the header" />
@@ -102,7 +106,7 @@ function LocalPluginForm ({ changeHandler, plugin, closeModal, visible, pluginMa
           <input
             className="form-control"
             onChange={e => changeHandler('url', e.target.value)}
-            value={plugin.url}
+            value={ plugin.url || defaultPlugin.url }
             id="plugin-url"
             data-id="localPluginUrl"
             placeholder="ex: https://localhost:8000" />

libs/remix-ui/plugin-manager/src/lib/remix-ui-plugin-manager.tsx

@@ -9,37 +9,36 @@ import './remix-ui-plugin-manager.css'
 export const RemixUiPluginManager = ({ pluginComponent }: RemixUiPluginManagerProps) => {
   const [activeProfiles, setActiveProfiles] = useState<Profile[]>(pluginComponent.activePlugins)
   const [inactiveProfiles, setinactiveProfiles] = useState<Profile[]>(pluginComponent.inactivePlugins)
-  const [activated] = useState<string[]>(pluginComponent.activeProfiles)
+  // const [activated] = useState<string[]>(pluginComponent.activeProfiles)
 
-  if (JSON.parse(localStorage.getItem('newActivePlugins')) === null) {
-    localStorage.setItem('newActivePlugins', '[]')
-  }
-  if (JSON.parse(localStorage.getItem('plugins/local')) === null) {
-    localStorage.setItem('plugins/local', '{}')
-  }
-  if (JSON.parse(localStorage.getItem('activatedPluginNames'))) {
-    localStorage.setItem('activatedPluginNames', '[]')
-  }
-  console.log('activated profile names :', activated)
+  // if (JSON.parse(localStorage.getItem('newActivePlugins')) === null) {
+  //   localStorage.setItem('newActivePlugins', '[]')
+  // }
+  // if (JSON.parse(localStorage.getItem('plugins/local')) === null) {
+  //   localStorage.setItem('plugins/local', '{}')
+  // }
+  // if (JSON.parse(localStorage.getItem('activatedPluginNames'))) {
+  //   localStorage.setItem('activatedPluginNames', '[]')
+  // }
 
-  useEffect(() => {
-    console.log('first time into use effect the activated state is', activated)
-    const checkSolidity = async () => {
-      const savedActives: Profile[] = JSON.parse(localStorage.getItem('newActivePlugins'))
-      if (activated.includes('solidity') && activated.includes('solidity-logic')) {
-        if (savedActives && savedActives.length >= 0) {
-          if (!savedActives.find(active => active.name === 'solidity') && !savedActives.find(active => active.name === 'solidity-logic')) {
-            const solidity = await pluginComponent.appManager.getProfile('solidity')
-            const logic = await pluginComponent.appManager.getProfile('solidity-logic')
-            savedActives.push(solidity, logic)
-          }
-        }
-      }
-      console.log('Use effect called, activated state is', activated)
-    }
-    checkSolidity()
-    console.log('activated state right at useEffect exit', activated)
-  }, [activated, pluginComponent.appManager])
+  // useEffect(() => {
+  //   console.log('first time into use effect the activated state is', activated)
+  //   const checkSolidity = async () => {
+  //     const savedActives: Profile[] = JSON.parse(localStorage.getItem('newActivePlugins'))
+  //     if (activated.includes('solidity') && activated.includes('solidity-logic')) {
+  //       if (savedActives && savedActives.length >= 0) {
+  //         if (!savedActives.find(active => active.name === 'solidity') && !savedActives.find(active => active.name === 'solidity-logic')) {
+  //           const solidity = await pluginComponent.appManager.getProfile('solidity')
+  //           const logic = await pluginComponent.appManager.getProfile('solidity-logic')
+  //           savedActives.push(solidity, logic)
+  //         }
+  //       }
+  //     }
+  //     console.log('Use effect called, activated state is', activated)
+  //   }
+  //   checkSolidity()
+  //   console.log('activated state right at useEffect exit', activated)
+  // }, [activated, pluginComponent.appManager])
   return (
     <RootView pluginComponent={pluginComponent}>
       <section data-id="pluginManagerComponentPluginManagerSection">

package.json

@@ -72,7 +72,7 @@
     "nightwatch_local_gist": "npm run build:e2e && nightwatch --config dist/apps/remix-ide-e2e/nightwatch.js dist/apps/remix-ide-e2e/src/tests/gist.spec.js --env=chrome",
     "nightwatch_local_workspace": "npm run build:e2e && nightwatch --config dist/apps/remix-ide-e2e/nightwatch.js dist/apps/remix-ide-e2e/src/tests/workspace.test.js --env=chrome",
     "nightwatch_local_defaultLayout": "npm run build:e2e && nightwatch --config dist/apps/remix-ide-e2e/nightwatch.js dist/apps/remix-ide-e2e/src/tests/defaultLayout.test.js --env=chrome",
-    "nightwatch_local_pluginManager": "npm run build:e2e && nightwatch --config dist/apps/remix-ide-e2e/nightwatch.js dist/apps/remix-ide-e2e/src/tests/pluginManager.spec.js --env=firefox",
+    "nightwatch_local_pluginManager": "npm run build:e2e && nightwatch --config dist/apps/remix-ide-e2e/nightwatch.js dist/apps/remix-ide-e2e/src/tests/pluginManager.spec.js --env=chrome",
     "nightwatch_local_publishContract": "npm run build:e2e && nightwatch --config dist/apps/remix-ide-e2e/nightwatch.js dist/apps/remix-ide-e2e/src/tests/publishContract.test.js --env=chrome",
     "nightwatch_local_generalSettings": "npm run build:e2e && nightwatch --config dist/apps/remix-ide-e2e/nightwatch.js dist/apps/remix-ide-e2e/src/tests/generalSettings.test.js --env=chrome",
     "nightwatch_local_fileExplorer": "npm run build:e2e && nightwatch --config dist/apps/remix-ide-e2e/nightwatch.js dist/apps/remix-ide-e2e/src/tests/fileExplorer.test.js --env=chrome",