Merge branch 'nxwebpack' of https://github.com/ethereum/remix-project into nxwebpack

.circleci/config.yml

@@ -137,7 +137,7 @@ jobs:
     parameters:
       script:
         type: string
-    parallelism: 10
+    parallelism: 4
     steps:
       - browser-tools/install-browser-tools
       - run:

apps/debugger/tsconfig.spec.json

@@ -1,15 +0,0 @@
-{
-  "extends": "./tsconfig.json",
-  "compilerOptions": {
-    "outDir": "../../dist/out-tsc",
-    "module": "commonjs",
-    "types": ["jest", "node"]
-  },
-  "include": [
-    "**/*.spec.ts",
-    "**/*.spec.tsx",
-    "**/*.spec.js",
-    "**/*.spec.jsx",
-    "**/*.d.ts"
-  ]
-}

apps/debugger/webpack.config.js

@@ -10,6 +10,11 @@ module.exports = config => {
         ...nxWebpackConfig.resolve.fallback,
         "crypto": require.resolve("crypto-browserify"),
         "stream": require.resolve("stream-browserify"),
+        "http"  : require.resolve("stream-http"),
+        "https" : require.resolve("https-browserify"),
+        "path"  : require.resolve("path-browserify"),
+        "module": false,
+        "fs"    : false
       },
     }
   }

apps/etherscan/tsconfig.app.json

@@ -5,10 +5,19 @@
     "types": ["node"]
   },
   "files": [
-    
     "../../node_modules/@nrwl/react/typings/cssmodule.d.ts",
     "../../node_modules/@nrwl/react/typings/image.d.ts"
   ],
-  "exclude": ["**/*.spec.ts", "**/*.spec.tsx"],
+  "exclude": [
+    "jest.config.ts",
+    "**/*.spec.ts",
+    "**/*.test.ts",
+    "**/*.spec.tsx",
+    "**/*.test.tsx",
+    "**/*.spec.js",
+    "**/*.test.js",
+    "**/*.spec.jsx",
+    "**/*.test.jsx"
+  ],
   "include": ["**/*.js", "**/*.jsx", "**/*.ts", "**/*.tsx"]
 }

apps/etherscan/tsconfig.json

@@ -4,11 +4,7 @@
     "jsx": "react-jsx",
     "allowJs": true,
     "esModuleInterop": true,
-    "allowSyntheticDefaultImports": true,
+    "allowSyntheticDefaultImports": true
-    "forceConsistentCasingInFileNames": true,
-    "strict": true,
-    "noImplicitReturns": true,
-    "noFallthroughCasesInSwitch": true
   },
   "files": [],
   "include": [],

apps/remix-ide/ci/lint.sh

@@ -1,23 +0,0 @@
-#!/usr/bin/env bash
-
-set -e
-
-BUILD_ID=${CIRCLE_BUILD_NUM:-${TRAVIS_JOB_NUMBER}}
-echo "$BUILD_ID"
-TEST_EXITCODE=0
-
-npx nx graph --file=projects.json 
-KEYS=$(jq -r '.projects | keys' workspace.json  | tr -d '[],"')
-
-(for row in $KEYS; do
-    if [ "$row" != "debugger" ]
-    then
-        echo ${row}
-    fi
-done) | circleci tests split | { while read i;do yarn run lint $i; done }
-
-echo "$TEST_EXITCODE"
-if [ "$TEST_EXITCODE" -eq 1 ]
-then
-  exit 1
-fi

apps/remix-ide/src/app/plugins/parser/services/code-parser-antlr-service.ts

@@ -1,6 +1,6 @@
 'use strict'
 
-import { AstNode } from "@remix-project/remix-solidity-ts"
+import { AstNode } from "@remix-project/remix-solidity"
 import { CodeParser } from "../code-parser"
 import { antlr } from '../types'
 import { pathToFileURL } from 'url'

apps/remix-ide/src/app/plugins/parser/services/code-parser-compiler.ts

@@ -6,7 +6,7 @@ import { CompilationResult, CompilationSource } from '@remix-project/remix-solid
 import { CodeParser } from "../code-parser";
 import { fileDecoration, fileDecorationType } from '@remix-ui/file-decorators'
 import { sourceMappingDecoder } from '@remix-project/remix-debug'
-import { CompilerRetriggerMode, CompilationSourceCode } from '@remix-project/remix-solidity-ts';
+import { CompilerRetriggerMode, CompilationSourceCode } from '@remix-project/remix-solidity';
 import { MarkerSeverity } from 'monaco-editor';
 import { findLinesInStringWithMatch, SearchResultLine } from '@remix-ui/search'
 import { lastCompilationResult } from '@remixproject/plugin-api';

apps/remix-ide/src/app/tabs/compile-tab.js

@@ -5,7 +5,7 @@ import { CompileTabLogic } from '@remix-ui/solidity-compiler' // eslint-disable-
 import { CompilerApiMixin } from '@remixproject/solidity-compiler-plugin' // eslint-disable-line
 import { ViewPlugin } from '@remixproject/engine-web'
 import { QueryParams } from '@remix-project/remix-lib'
-// import { ICompilerApi } from '@remix-project/remix-lib-ts'
+// import { ICompilerApi } from '@remix-project/remix-lib'
 import * as packageJson from '../../../../../package.json'
 import { compilerConfigChangedToastMsg, compileToastMsg } from '@remix-ui/helper'
 import { isNative } from '../../remixAppManager'

apps/remix-ide/src/assets/css/themes/remix-dark_tvx1s2.css

@@ -4018,6 +4018,7 @@ input[type="submit"].btn-block {
 .card-body {
   flex: 1 1 auto;
   padding: 1.25rem;
+  color: #b2b8cd;
 }
 .card-title {
   color: #DFE1EA;

apps/remix-ide/src/blockchain/blockchain.js

@@ -11,7 +11,7 @@ import InjectedProvider from './providers/injected.js'
 import NodeProvider from './providers/node.js'
 import { execution, EventManager, helpers } from '@remix-project/remix-lib'
 import { etherScanLink } from './helper'
-import { logBuilder, cancelUpgradeMsg, cancelProxyMsg } from "@remix-ui/helper"
+import { logBuilder, cancelUpgradeMsg, cancelProxyMsg, addressToString } from "@remix-ui/helper"
 const { txFormat, txExecution, typeConversion, txListener: Txlistener, TxRunner, TxRunnerWeb3, txHelper } = execution
 const { txResultHelper: resultToRemixTx } = helpers
 const packageJson = require('../../../../package.json')
@@ -180,7 +180,7 @@ export class Blockchain extends Plugin {
       if (networkInfo.name === 'VM') this.config.set('vm/proxy', address)
       else this.config.set(`${networkInfo.name}/${networkInfo.currentFork}/${networkInfo.id}/proxy`, address)
       _paq.push(['trackEvent', 'blockchain', 'Deploy With Proxy', 'Proxy deployment successful'])
-      return this.call('udapp', 'resolveContractAndAddInstance', implementationContractObject, address)
+      this.call('udapp', 'addInstance', addressToString(address), implementationContractObject.abi, implementationContractObject.name)
     }
 
     this.runTx(args, confirmationCb, continueCb, promptCb, finalCb)
@@ -223,7 +223,7 @@ export class Blockchain extends Plugin {
         return this.call('terminal', 'logHtml', log)
       }
       _paq.push(['trackEvent', 'blockchain', 'Upgrade With Proxy', 'Upgrade Successful'])
-      return this.call('udapp', 'resolveContractAndAddInstance', newImplementationContractObject, proxyAddress)
+      this.call('udapp', 'addInstance', addressToString(proxyAddress), newImplementationContractObject.abi, newImplementationContractObject.name)
     }
     this.runTx(args, confirmationCb, continueCb, promptCb, finalCb)
   }

apps/solidity-compiler/src/app/compiler-api.ts

@@ -1,7 +1,7 @@
 import React from 'react';
 import { compile, helper } from '@remix-project/remix-solidity'
 import { CompileTabLogic, parseContracts } from '@remix-ui/solidity-compiler' // eslint-disable-line
-import type { ConfigurationSettings } from '@remix-project/remix-lib-ts'
+import type { ConfigurationSettings } from '@remix-project/remix-lib'
 
 export const CompilerApiMixin = (Base) => class extends Base {
   currentFile: string

apps/solidity-compiler/src/app/compiler.ts

@@ -3,7 +3,7 @@
 import { PluginClient } from '@remixproject/plugin'
 import { createClient } from '@remixproject/plugin-webview'
 import { CompilerApiMixin } from './compiler-api'
-import { ICompilerApi } from '@remix-project/remix-lib-ts'
+import { ICompilerApi } from '@remix-project/remix-lib'
 import { CompileTabLogic } from '@remix-ui/solidity-compiler'
 
 const defaultCompilerParameters = {

apps/solidity-compiler/tsconfig.spec.json

@@ -1,15 +0,0 @@
-{
-  "extends": "./tsconfig.json",
-  "compilerOptions": {
-    "outDir": "../../dist/out-tsc",
-    "module": "commonjs",
-    "types": ["jest", "node"]
-  },
-  "include": [
-    "**/*.spec.ts",
-    "**/*.spec.tsx",
-    "**/*.spec.js",
-    "**/*.spec.jsx",
-    "**/*.d.ts"
-  ]
-}

apps/vyper/project.json

@@ -25,7 +25,7 @@
         ],
         "styles": ["apps/vyper/src/styles.css"],
         "scripts": [],
-        "webpackConfig": "@nrwl/react/plugins/webpack"
+        "webpackConfig": "apps/vyper/webpack.config.js"
       },
       "configurations": {
         "development": {

apps/vyper/webpack.config.js

@@ -1,17 +1,21 @@
 const nxWebpack = require('@nrwl/react/plugins/webpack')
-const TerserPlugin = require('terser-webpack-plugin')
 
 module.exports = config => {
   const nxWebpackConfig = nxWebpack(config)
   const webpackConfig = {
     ...nxWebpackConfig,
-    node: {
+    resolve   : {
-      fs: 'empty',
+      ...nxWebpackConfig.resolve,
-      tls: 'empty',
+      fallback: {
-      readline: 'empty',
+        ...nxWebpackConfig.resolve.fallback,
-      net: 'empty',
+        "crypto": require.resolve("crypto-browserify"),
-      module: 'empty',
+        "stream": require.resolve("stream-browserify"),
-      child_process: 'empty'
+        "http"  : require.resolve("stream-http"),
+        "https" : require.resolve("https-browserify"),
+        "path"  : require.resolve("path-browserify"),
+        "module": false,
+        "fs"    : false
+      },
     }
   }
 
@@ -20,10 +24,6 @@ module.exports = config => {
       ...webpackConfig,
       mode: 'production',
       devtool: 'source-map',
-      optimization: {
-        minimize: true,
-        minimizer: [new TerserPlugin()]
-      }
     }
   } else {
     return webpackConfig

libs/remix-core-plugin/src/lib/compiler-artefacts.ts

@@ -198,8 +198,7 @@ export class CompilerArtefacts extends Plugin {
     return this.compilersArtefactsPerFile[file]
   }
 
-  // compilerData is a CompilerAbstract object
+  addResolvedContract (address: string, compilerData: CompilerAbstract) {
-  addResolvedContract (address, compilerData) {
     this.compilersArtefacts[address] = compilerData
   }
 

libs/remix-core-plugin/src/lib/compiler-fetch-and-compile.ts

@@ -4,6 +4,7 @@ import { util } from '@remix-project/remix-lib'
 import { toChecksumAddress } from 'ethereumjs-util'
 import { fetchContractFromEtherscan } from './helpers/fetch-etherscan'
 import { fetchContractFromSourcify } from './helpers/fetch-sourcify'
+import { UUPSDeployedByteCode, UUPSCompilerVersion } from './constants/uups'
 
 const profile = {
   name: 'fetchAndCompile',
@@ -48,6 +49,33 @@ export class FetchAndCompile extends Plugin {
     if (resolved) return resolved
     if (this.unresolvedAddresses.includes(contractAddress)) return localCompilation()
 
+    if (codeAtAddress === '0x' + UUPSDeployedByteCode) { // proxy
+      const settings = {
+        version: UUPSCompilerVersion,
+        language: 'Solidity',
+        evmVersion: null,
+        optimize: false,
+        runs: 0
+      }
+      const compilationTargets = {
+        'proxy.sol': { content: 'import "https://github.com/OpenZeppelin/openzeppelin-contracts/blob/v4.8.0/contracts/proxy/ERC1967/ERC1967Proxy.sol";' }
+      }
+      const compData = await compile(
+        compilationTargets,
+        settings,
+        async (url, cb) => {
+          // we first try to resolve the content from the compilation target using a more appropiate path
+          const path = `${targetPath}/${url}`
+          if (compilationTargets[path] && compilationTargets[path].content) {
+            return cb(null, compilationTargets[path].content)
+          } else {
+            await this.call('contentImport', 'resolveAndSave', url).then((result) => cb(null, result)).catch((error) => cb(error.message))
+          }
+        })
+      await this.call('compilerArtefacts', 'addResolvedContract', contractAddress, compData)
+      return compData
+    }
+
     // sometimes when doing an internal call, the only available artifact is the Solidity interface.
     // resolving addresses of internal call would allow to step over the source code, even if the declaration was made using an Interface.
 

libs/remix-debug/test/decoder/localsTests/int.ts

@@ -11,6 +11,7 @@ import * as sourceMappingDecoder from '../../../src/source/sourceMappingDecoder'
 import * as helper from './helper'
 
 module.exports = function (st, privateKey, contractBytecode, compilationResult, contractCode) {
+  // eslint-disable-next-line no-async-promise-executor
   return new Promise(async (resolve) => {    
     const web3 = await (vmCall as any).getWeb3();
     (vmCall as any).sendTx(web3, { nonce: 0, privateKey: privateKey }, null, 0, contractBytecode, function (error, hash) {      
@@ -27,7 +28,7 @@ module.exports = function (st, privateKey, contractBytecode, compilationResult,
         codeManager.clear()
         const solidityProxy = new SolidityProxy({ getCurrentCalledAddressAt: traceManager.getCurrentCalledAddressAt.bind(traceManager), getCode: codeManager.getCode.bind(codeManager) })
         solidityProxy.reset(compilationResult)
-        var debuggerEvent = new EventManager()
+        const debuggerEvent = new EventManager()
         const offsetToLineColumnConverter = {
           offsetToLineColumn: (rawLocation) => {
             return new Promise((resolve) => {
@@ -36,7 +37,7 @@ module.exports = function (st, privateKey, contractBytecode, compilationResult,
             })
           }
         }
-        var callTree = new InternalCallTree(debuggerEvent, traceManager, solidityProxy, codeManager, { includeLocalVariables: true }, offsetToLineColumnConverter)
+        const callTree = new InternalCallTree(debuggerEvent, traceManager, solidityProxy, codeManager, { includeLocalVariables: true }, offsetToLineColumnConverter)
         callTree.event.register('callTreeBuildFailed', (error) => {
           st.fail(error)
         })

libs/remix-lib/src/util.ts

@@ -239,6 +239,8 @@ export function compareByteCode (code1, code2) {
     code2 = replaceLibReference(code2, pos)
     code1 = replaceLibReference(code1, pos)
   }
+
+  code1 = removeImmutableReference(code1, code2)
   code1 = extractinputParameters(code1)  
   code1 = extractSwarmHash(code1)
   code1 = extractcborMetadata(code1)
@@ -276,6 +278,27 @@ function replaceLibReference (code, pos) {
   return code.substring(0, pos) + '0000000000000000000000000000000000000000' + code.substring(pos + 40)
 }
 
+function removeByIndex (code, index, length, emptyRef) {
+  if (!code) return code
+  return code.slice(0, index) + emptyRef + code.slice(index + length)
+}
+
+function removeImmutableReference (code1, code2) {
+  try {
+    const refOccurence = code2.match(/7f000000000000000000000000000000000000000000000000000000000000000073/g)
+    if (!refOccurence) return code1
+    let offset = 0
+    refOccurence.map((value) => {
+      offset = code2.indexOf(value, offset)
+      code1 = removeByIndex(code1, offset, value.length, '7f000000000000000000000000000000000000000000000000000000000000000073')
+      offset = offset + 1
+    })
+  } catch (e) {
+    console.log('error removeImmutableReference', e)
+  }
+  return code1
+}
+
 function findCallInternal (index, rootCall, callsPath) {
   const calls = Object.keys(rootCall.calls)
   const ret = rootCall

libs/remix-ui/app/src/index.ts

@@ -4,4 +4,3 @@ export { ModalProvider, useDialogDispatchers } from './lib/remix-app/context/pro
 export { AppModal } from './lib/remix-app/interface/index'
 export { AlertModal } from './lib/remix-app/interface/index'
 export { ModalTypes } from './lib/remix-app/types/index'
-export { dispatchModalInterface } from './lib/remix-app/context/context'

libs/remix-ui/app/src/lib/remix-app/components/dragbar/dragbar.tsx

@@ -58,9 +58,10 @@ const DragBar = (props: IRemixDragBarUi) => {
     return () => window.removeEventListener('resize', handleResize)
   }, [])
 
-  function stopDrag(e: MouseEvent, data: any) {
+  function stopDrag(data: any) {
     setDragState(false)
-    if (data.x < props.minWidth) {
+    console.log("drag")
+    if (data.x < props.minWidth + offset) {
       setDragBarPosX(offset)
       props.setHideStatus(true)
     } else {
@@ -70,7 +71,6 @@ const DragBar = (props: IRemixDragBarUi) => {
         setDragBarPosX(offset + props.refObject.current.offsetWidth)
       }, 300)
     }
-
   }
 
   function startDrag() {

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

@@ -1,4 +1,4 @@
-import React, { useContext, useEffect, useRef, useState } from 'react'
+import React, { useEffect, useRef, useState } from 'react'
 import './style/remix-app.css'
 import { RemixUIMainPanel } from '@remix-ui/panel'
 import MatomoDialog from './components/modals/matomo'
@@ -8,7 +8,6 @@ import { AppProvider } from './context/provider'
 import AppDialogs from './components/modals/dialogs'
 import DialogViewPlugin from './components/modals/dialogViewPlugin'
 import { AppContext } from './context/context'
-import { RemixUiVerticalIconsPanel } from '@remix-ui/vertical-icons-panel'
 import { IntlProvider } from 'react-intl'
 
 interface IRemixAppUi {
@@ -83,11 +82,10 @@ const RemixApp = (props: IRemixAppUi) => {
       <AppProvider value={value}>
         <OriginWarning></OriginWarning>
         <MatomoDialog hide={!appReady}></MatomoDialog>
-
         <div className={`remixIDE ${appReady ? '' : 'd-none'}`} data-id="remixIDE">
           <div id="icon-panel" data-id="remixIdeIconPanel" className="iconpanel bg-light">{props.app.menuicons.render()}</div>
           <div ref={sidePanelRef} id="side-panel" data-id="remixIdeSidePanel" className={`sidepanel border-right border-left ${hideSidePanel ? 'd-none' : ''}`}>{props.app.sidePanel.render()}</div>
-          <DragBar resetTrigger={resetTrigger} maximiseTrigger={maximiseTrigger} minWidth={250} refObject={sidePanelRef} hidden={hideSidePanel} setHideStatus={setHideSidePanel}></DragBar>
+          <DragBar resetTrigger={resetTrigger} maximiseTrigger={maximiseTrigger} minWidth={285} refObject={sidePanelRef} hidden={hideSidePanel} setHideStatus={setHideSidePanel}></DragBar>
           <div id="main-panel" data-id="remixIdeMainPanel" className='mainpanel'>
             <RemixUIMainPanel Context={AppContext}></RemixUIMainPanel>
           </div>

libs/remix-ui/debugger-ui/src/lib/idebugger-api.ts

@@ -1,5 +1,5 @@
 
-import type { CompilationSource, CompilerAbstract, SourcesCode } from '@remix-project/remix-solidity-ts' // eslint-disable-line
+import type { CompilationSource, CompilerAbstract, SourcesCode } from '@remix-project/remix-solidity' // eslint-disable-line
 
 export interface LineColumnLocation {
     start: {

libs/remix-ui/debugger-ui/src/lib/vm-debugger/assembly-items.tsx

@@ -1,4 +1,3 @@
-import { stateDecoder } from 'dist/libs/remix-debug/src/solidity-decoder'
 import React, { useState, useRef, useEffect, useReducer } from 'react' // eslint-disable-line
 import { initialState, reducer } from '../../reducers/assembly-items'
 import './styles/assembly-items.css'

libs/remix-ui/editor/src/lib/providers/completionProvider.ts

@@ -1,4 +1,4 @@
-import { AstNode } from "@remix-project/remix-solidity-ts"
+import { AstNode } from "@remix-project/remix-solidity"
 import { isArray } from "lodash"
 import { editor, languages, Position } from "monaco-editor"
 import monaco from "../../types/monaco"

libs/remix-ui/file-decorators/.babelrc

@@ -1,4 +0,0 @@
-{
-  "presets": ["@nrwl/react/babel"],
-  "plugins": []
-}

libs/remix-ui/file-decorators/.eslintrc

@@ -1,19 +0,0 @@
-{
-  "env": {
-      "browser": true,
-      "es6": true
-  },
-  "extends": "../../../.eslintrc.json",
-  "globals": {
-      "Atomics": "readonly",
-      "SharedArrayBuffer": "readonly"
-  },
-  "parserOptions": {
-      "ecmaVersion": 11,
-      "sourceType": "module"
-  },
-  "rules": {
-    "no-unused-vars": "off",
-    "@typescript-eslint/no-unused-vars": "error"  
-  }
-} 

libs/remix-ui/file-decorators/tsconfig.json

@@ -1,16 +0,0 @@
-{
-  "extends": "../../../tsconfig.base.json",
-  "compilerOptions": {
-    "jsx": "react",
-    "allowJs": true,
-    "esModuleInterop": true,
-    "allowSyntheticDefaultImports": true
-  },
-  "files": [],
-  "include": [],
-  "references": [
-    {
-      "path": "./tsconfig.lib.json"
-    }
-  ]
-}

libs/remix-ui/file-decorators/tsconfig.lib.json

@@ -1,13 +0,0 @@
-{
-  "extends": "./tsconfig.json",
-  "compilerOptions": {
-    "outDir": "../../../dist/out-tsc",
-    "types": ["node"]
-  },
-  "files": [
-    "../../../node_modules/@nrwl/react/typings/cssmodule.d.ts",
-    "../../../node_modules/@nrwl/react/typings/image.d.ts"
-  ],
-  "exclude": ["**/*.spec.ts", "**/*.spec.tsx"],
-  "include": ["**/*.js", "**/*.jsx", "**/*.ts", "**/*.tsx"]
-}

libs/remix-ui/helper/src/lib/components/custom-dropdown.tsx

@@ -13,7 +13,7 @@ export const CustomToggle = React.forwardRef(({ children, onClick, icon, classNa
     className={className.replace('dropdown-toggle', '')}
   >
     <div className="d-flex">
-      <div className="mr-auto">{ children }</div>
+      <div className="mr-auto text-nowrap">{ children }</div>
       { icon && <div className="pr-1"><i className={`${icon} pr-1`}></i></div> }
       <div><i className="fad fa-sort-circle"></i></div>
     </div>

libs/remix-ui/home-tab/src/lib/components/customButtonGroupAsArrows.tsx

@@ -1,14 +0,0 @@
-/* eslint-disable @typescript-eslint/no-unused-vars */
-import React from 'react'
-
-function CustomButtonGroupAsArrows ({ next, previous }) {
-  return (
-    <div style={{ textAlign: "center" }}>
-      <h4>These buttons can be positioned anywhere you want on the screen</h4>
-      <button onClick={previous}>Prev</button>
-      <button onClick={next}>Next</button>
-    </div>
-  )
-}
-
-export default CustomButtonGroupAsArrows

libs/remix-ui/home-tab/src/lib/components/customNavButtons.tsx

@@ -1,8 +1,8 @@
 /* eslint-disable @typescript-eslint/no-unused-vars */
 import React from 'react'
 
-const CustomNavButtons = ({ next, previous, goToSlide, ...rest }) => {
+const CustomNavButtons = ({ parent, next, previous, goToSlide, ...rest }) => {
-  const { carouselState: { currentSlide, totalItems, itemWidth, containerWidth } } = rest
+  const { carouselState: { currentSlide, totalItems, containerWidth, transform } } = rest
   return (
     <div className="mt-1 d-flex justify-content-end carousel-button-group">
       <button
@@ -14,11 +14,11 @@ const CustomNavButtons = ({ next, previous, goToSlide, ...rest }) => {
       </button>
       <button
         className={ 
-          ((totalItems - currentSlide) * itemWidth + 5) < containerWidth ? 'disable py-1 border btn' : 'py-1 border btn'}
+          (Math.abs(transform) >= parent?.current?.containerRef?.current?.scrollWidth - containerWidth) ? 'disable py-1 border btn' : 'py-1 border btn'}
         onClick={() => {
           if (currentSlide + 1 < totalItems) goToSlide(currentSlide + 1)
         }}
-        disabled ={((totalItems - currentSlide) * itemWidth + 5) < containerWidth}
+        disabled ={Math.abs(transform) >= parent?.current?.containerRef?.current?.scrollWidth - containerWidth}
       >
         <i className="fas fa-angle-right"></i>
       </button>

libs/remix-ui/home-tab/src/lib/components/homeTabFeatured.tsx

@@ -3,17 +3,11 @@ import React, { useEffect, useState, useRef, useContext } from 'react'
 import { ThemeContext, themes } from '../themeContext'
 import Carousel from 'react-multi-carousel'
 import 'react-multi-carousel/lib/styles.css'
-import CustomNavButtons from './customNavButtons'
 const _paq = window._paq = window._paq || [] // eslint-disable-line
 
 function HomeTabFeatured() {
   const themeFilter = useContext(ThemeContext)
 
-  useEffect(() => {
-    return () => {
-    }
-  }, [])
-
   return (
     <div className="pt-3 pl-2" id="hTFeaturedeSection">
       <label style={{ fontSize: "1.2rem" }}>Featured</label>
@@ -21,7 +15,6 @@ function HomeTabFeatured() {
         <div className="w-100 d-flex flex-column" style={{ height: "200px" }}>
           <ThemeContext.Provider value={themeFilter}>
             <Carousel
-              customButtonGroup={<CustomNavButtons next={undefined} previous={undefined} goToSlide={undefined} />}
               arrows={false}
               swipeable={false}
               draggable={true}
@@ -30,17 +23,18 @@ function HomeTabFeatured() {
               renderDotsOutside={true}
               ssr={true} // means to render carousel on server-side.
               infinite={true}
+              partialVisible={false}
               centerMode={false}
               autoPlay={true}
               keyBoardControl={true}
-              containerClass="border carousel-container"
+              containerClass="border w-full carousel-container"
-              sliderClass="px-2 h-100 justify-content-between"
+              sliderClass="h-100 justify-content-between"
               deviceType={"desktop"}
-              itemClass="px-2 carousel-item-padding-10-px"
+              itemClass=""
               autoPlaySpeed={15000}
               dotListClass="position-relative mt-2"
             >
-              <div className="d-flex">
+              <div className="mx-1 px-1 d-flex">
                 <img src={"assets/img/bgRemi.webp"} style={{ flex: "1", height: "170px", maxWidth: "170px" }} alt="" ></img>
                 <div className="h6 w-50 p-4" style={{ flex: "1" }}>
                   <h5>JUMP INTO WEB3</h5>
@@ -48,7 +42,7 @@ function HomeTabFeatured() {
                   <a className="remixui_home_text" onClick={() => _paq.push(['trackEvent', 'hometab', 'featuredSection', 'jumpIntoWeb3'])} target="__blank" href="https://remix-project.org">More</a>
                 </div>
               </div>
-              <div className="d-flex">
+              <div className="mx-1 px-1 d-flex">
                 <img src={"/assets/img/remixRewardUser.webp"} style={{ flex: "1", height: "170px", maxWidth: "170px" }} alt="" ></img>
                 <div className="h6 p-4" style={{ flex: "1" }}>
                   <h5>REMIX REWARDS</h5>
@@ -59,7 +53,7 @@ function HomeTabFeatured() {
                   <a className="remixui_home_text" target="__blank" onClick={() => _paq.push(['trackEvent', 'hometab', 'featuredSection', 'remixRewards'])} href="https://rewards.remix.ethereum.eth.limo">More</a>
                 </div>
               </div>
-              <div className="d-flex">
+              <div className="mx-1 px-1 d-flex">
                 <img src={"/assets/img/remixRewardBetaTester.webp"} style={{ flex: "1", height: "170px", maxWidth: "170px" }} alt="" ></img>
                 <div className="h6 p-4" style={{ flex: "1" }}>
                   <h5>BETA TESTING</h5>

libs/remix-ui/home-tab/src/lib/components/homeTabFeaturedPlugins.tsx

@@ -20,7 +20,7 @@ interface  HomeTabFeaturedPluginsProps {
 function HomeTabFeaturedPlugins ({plugin}: HomeTabFeaturedPluginsProps) {
 
   const themeFilter = useContext(ThemeContext)
-  const carouselRef = useRef(null)
+  const carouselRef = useRef<any>({})
   const carouselRefDiv = useRef(null)
 
   useEffect(() => {
@@ -47,7 +47,7 @@ function HomeTabFeaturedPlugins ({plugin}: HomeTabFeaturedPluginsProps) {
       let nextSlide = 0
       if (e.wheelDelta < 0) {
         nextSlide = carouselRef.current.state.currentSlide + 1;
-        if ((carouselRef.current.state.totalItems - carouselRef.current.state.currentSlide) * carouselRef.current.state.itemWidth + 5 < carouselRef.current.state.containerWidth) return // 5 is approx margins
+        if (Math.abs(carouselRef.current.state.transform) >= carouselRef.current.containerRef.current.scrollWidth - carouselRef.current.state.containerWidth) return
         carouselRef.current.goToSlide(nextSlide)
       } else {
         nextSlide = carouselRef.current.state.currentSlide - 1;
@@ -92,7 +92,7 @@ function HomeTabFeaturedPlugins ({plugin}: HomeTabFeaturedPluginsProps) {
             ref={carouselRef}
             focusOnSelect={true}
             customButtonGroup={
-              <CustomNavButtons next={undefined} previous={undefined} goToSlide={undefined} />
+              <CustomNavButtons next={undefined} previous={undefined} goToSlide={undefined} parent={carouselRef} />
             }
             arrows={false}
             swipeable={false}

libs/remix-ui/home-tab/src/lib/components/homeTabFile.tsx

@@ -23,13 +23,13 @@ function HomeTabFile ({plugin}: HomeTabFileProps) {
   const [state, setState] = useState<{
     searchInput: string,
     showModalDialog: boolean,
-    modalInfo: { title: string, loadItem: string, examples: Array<string> },
+    modalInfo: { title: string, loadItem: string, examples: Array<string>, prefix?: string },
     importSource: string,
     toasterMsg: string
   }>({
     searchInput: '',
     showModalDialog: false,
-    modalInfo: { title: '', loadItem: '', examples: [] },
+    modalInfo: { title: '', loadItem: '', examples: [], prefix: '' },
     importSource: '',
     toasterMsg: ''
   })
@@ -42,8 +42,15 @@ function HomeTabFile ({plugin}: HomeTabFileProps) {
     _paq.push(['trackEvent', 'hometab', 'filesSection', 'importFrom' + type])
     const contentImport = plugin.contentImport
     const workspace = plugin.fileManager.getProvider('workspace')
+    const startsWith = state.importSource.substring(0, 4)
+
+    if ((type === 'ipfs' || type === 'IPFS') && (startsWith !== 'ipfs' && startsWith !== "IPFS")) {
+      setState(prevState => {
+        return { ...prevState, importSource: startsWith + state.importSource}
+      })
+    }
     contentImport.import(
-      state.importSource,
+      state.modalInfo.prefix + state.importSource,
       (loadingMsg) => dispatch({ tooltip: loadingMsg }),
       async (error, content, cleanUrl, type, url) => {
         if (error) {
@@ -93,9 +100,9 @@ function HomeTabFile ({plugin}: HomeTabFileProps) {
     plugin.verticalIcons.select('filePanel')
   }
 
-  const showFullMessage = (title: string, loadItem: string, examples: Array<string>) => {
+  const showFullMessage = (title: string, loadItem: string, examples: Array<string>, prefix = '') => {
     setState(prevState => {
-      return { ...prevState, showModalDialog: true, modalInfo: { title: title, loadItem: loadItem, examples: examples } }
+      return { ...prevState, showModalDialog: true, modalInfo: { title: title, loadItem: loadItem, examples: examples, prefix } }
     })
   }
 
@@ -126,7 +133,9 @@ function HomeTabFile ({plugin}: HomeTabFileProps) {
               { examples }
             </div>
           </> }
-          <input
+          <div className="d-flex flex-row">
+            { state.modalInfo.prefix && <span className='text-nowrap align-self-center mr-2'>ipfs://</span> }
+            <input
             ref={inputValue}
             type='text'
             name='prompt_text'
@@ -140,6 +149,7 @@ function HomeTabFile ({plugin}: HomeTabFileProps) {
               })
             }}
           />
+          </div>
         </div>
       </ModalDialog>
       <Toaster message={state.toasterMsg} />
@@ -155,9 +165,15 @@ function HomeTabFile ({plugin}: HomeTabFileProps) {
         <button className="btn p-2 border my-1" style={{width: 'fit-content'}} onClick={() => connectToLocalhost()}><FormattedMessage id='home.connectToLocalhost' defaultMessage='Connect to Localhost' /></button>
         <label className="pt-2"><FormattedMessage id='home.loadFrom' defaultMessage='Load From' /></label>
         <div className="d-flex">
-          <button className="btn p-2 border mr-2" data-id="landingPageImportFromGitHubButton" onClick={() => showFullMessage('GitHub', 'github URL', ['https://github.com/0xcert/ethereum-erc721/src/contracts/tokens/nf-token-metadata.sol', 'https://github.com/OpenZeppelin/openzeppelin-solidity/blob/67bca857eedf99bf44a4b6a0fc5b5ed553135316/contracts/access/Roles.sol'])}>GitHub</button>
+          <button
+            className="btn p-2 border mr-2"
+            data-id="landingPageImportFromGitHubButton"
+            onClick={() => showFullMessage('GitHub', 'github URL', ['https://github.com/0xcert/ethereum-erc721/src/contracts/tokens/nf-token-metadata.sol', 'https://github.com/OpenZeppelin/openzeppelin-solidity/blob/67bca857eedf99bf44a4b6a0fc5b5ed553135316/contracts/access/Roles.sol'])}
+          >
+            GitHub
+          </button>
           <button className="btn p-2 border mr-2" data-id="landingPageImportFromGistButton" onClick={() => importFromGist()}>Gist</button>
-          <button className="btn p-2 border mr-2" onClick={() => showFullMessage('Ipfs', 'ipfs URL', ['ipfs://<ipfs-hash>'])}>IPFS</button>
+          <button className="btn p-2 border mr-2" onClick={() => showFullMessage('Ipfs', 'ipfs hash', ['ipfs://QmQQfBMkpDgmxKzYaoAtqfaybzfgGm9b2LWYyT56Chv6xH'], "ipfs://")}>IPFS</button> 
           <button className="btn p-2 border" onClick={() => showFullMessage('Https', 'http/https raw content', ['https://raw.githubusercontent.com/OpenZeppelin/openzeppelin-contracts/master/contracts/token/ERC20/ERC20.sol'])}>HTTPS</button>
         </div>
       </div>

libs/remix-ui/home-tab/src/lib/components/homeTabGetStarted.tsx

@@ -17,7 +17,7 @@ interface  HomeTabGetStartedProps {
 
 function HomeTabGetStarted ({plugin}: HomeTabGetStartedProps) {
   const themeFilter = useContext(ThemeContext)
-  const carouselRef = useRef(null)
+  const carouselRef = useRef<any>({})
   const carouselRefDiv = useRef(null)
 
   useEffect(() => {
@@ -44,7 +44,7 @@ function HomeTabGetStarted ({plugin}: HomeTabGetStartedProps) {
       let nextSlide = 0
       if (e.wheelDelta < 0) {
         nextSlide = carouselRef.current.state.currentSlide + 1;
-        if ((carouselRef.current.state.totalItems - carouselRef.current.state.currentSlide) * carouselRef.current.state.itemWidth + 5 < carouselRef.current.state.containerWidth) return // 5 is approx margins
+        if (Math.abs(carouselRef.current.state.transform) >= carouselRef.current.containerRef.current.scrollWidth - carouselRef.current.state.containerWidth) return
         carouselRef.current.goToSlide(nextSlide)
       } else {
         nextSlide = carouselRef.current.state.currentSlide - 1;
@@ -77,7 +77,7 @@ function HomeTabGetStarted ({plugin}: HomeTabGetStartedProps) {
             ref={carouselRef}
             focusOnSelect={true}
             customButtonGroup={
-              <CustomNavButtons next={undefined} previous={undefined} goToSlide={undefined} />
+              <CustomNavButtons next={undefined} previous={undefined} goToSlide={undefined} parent={carouselRef} />
             }
             arrows={false}
             swipeable={false}

libs/remix-ui/home-tab/src/lib/components/homeTabLearn.tsx

@@ -49,25 +49,27 @@ function HomeTabLearn ({plugin}: HomeTabLearnProps) {
         </button>
       </div>
       <div className="d-flex flex-column">
-        <button className="d-flex flex-column btn border" onClick={() => setState((prevState) => {return { ...prevState, visibleTutorial: VisibleTutorial.Basics }})}>
+        <label className="d-flex flex-column btn border" onClick={() => setState((prevState) => {return { ...prevState, visibleTutorial: VisibleTutorial.Basics }})}>
-          <label className="m-0 float-left" style={{fontSize: "1rem"}}>Remix Basics</label>
+          <label className="card-title align-self-start m-0 float-left" style={{fontSize: "1rem"}}>Remix Basics</label>
           {(state.visibleTutorial === VisibleTutorial.Basics) && <div className="pt-2 d-flex flex-column text-left">
             <span>Introduction to Remix's interface and concepts used in Ethereum, as well as the basics of Solidity.</span>
             <button className="btn btn-sm btn-secondary mt-2" style={{width: 'fit-content'}} onClick={() => startLearnEthTutorial('basics')}>Get Started</button>
           </div>}
-        </button>
+        </label>
-        <button className="d-flex flex-column btn border" onClick={() => setState((prevState) => {return { ...prevState, visibleTutorial: VisibleTutorial.Intermediate }})}>
+        <label className="d-flex flex-column btn border" onClick={() => setState((prevState) => {return { ...prevState, visibleTutorial: VisibleTutorial.Intermediate }})}>
-          <label className="m-0 float-left" style={{fontSize: "1rem"}}>Remix Intermediate</label>
+          <label className="card-title align-self-start m-0 float-left" style={{fontSize: "1rem"}}>Remix Intermediate</label>
-          {(state.visibleTutorial === VisibleTutorial.Intermediate) && <div className="pt-2 d-flex flex-column text-left">Using the web3.js to interact with a contract. Using Recorder tool.
+          {(state.visibleTutorial === VisibleTutorial.Intermediate) && <div className="pt-2 d-flex flex-column text-left">
-          <button className="btn btn-sm btn-secondary mt-2" style={{width: 'fit-content'}} onClick={() => startLearnEthTutorial('useofweb3js')}>Get Started</button>
+            <span>Using the web3.js to interact with a contract. Using Recorder tool.</span>
+            <button className="btn btn-sm btn-secondary mt-2" style={{width: 'fit-content'}} onClick={() => startLearnEthTutorial('useofweb3js')}>Get Started</button>
           </div>}
-        </button>
+        </label>
-        <button className="d-flex flex-column btn border" onClick={() => setState((prevState) => {return { ...prevState, visibleTutorial: VisibleTutorial.Advanced }})}>
+        <label className="d-flex flex-column btn border" onClick={() => setState((prevState) => {return { ...prevState, visibleTutorial: VisibleTutorial.Advanced }})}>
-          <label className="m-0 float-left" style={{fontSize: "1rem"}}>Remix Advanced</label>
+          <label className="card-title align-self-start m-0 float-left" style={{fontSize: "1rem"}}>Remix Advanced</label>
-          {(state.visibleTutorial === VisibleTutorial.Advanced) && <div className="pt-2 d-flex flex-column text-left">Learn the Proxy Pattern and working with Libraries in Remix. Learn to use the Debugger.
+          {(state.visibleTutorial === VisibleTutorial.Advanced) && <div className="pt-2 d-flex flex-column text-left">
-          <button className="btn btn-sm btn-secondary mt-2" style={{width: 'fit-content'}} onClick={() => startLearnEthTutorial('deploylibraries')}>Get Started</button>
+            <span>Learn the Proxy Pattern and working with Libraries in Remix. Learn to use the Debugger.</span>
+            <button className="btn btn-sm btn-secondary mt-2" style={{width: 'fit-content'}} onClick={() => startLearnEthTutorial('deploylibraries')}>Get Started</button>
           </div>}
-        </button>
+        </label>
       </div>
     </div>
   )

libs/remix-ui/home-tab/src/lib/components/homeTabTitle.tsx

@@ -157,7 +157,7 @@ function HomeTabTitle() {
           ref={searchInputRef}
           type="text"
           className="border form-control border-right-0"
-          id="searchInput"
+          id="homeTabSearchInput"
           placeholder="Search Documentation"
           data-id="terminalInputSearch"
         />

libs/remix-ui/locale-module/.babelrc

@@ -1,4 +0,0 @@
-{
-  "presets": ["@nrwl/react/babel"],
-  "plugins": []
-}

libs/remix-ui/locale-module/.eslintrc.json

@@ -1,18 +0,0 @@
-{
-  "extends": ["plugin:@nrwl/nx/react", "../../../.eslintrc.json"],
-  "ignorePatterns": ["!**/*"],
-  "overrides": [
-    {
-      "files": ["*.ts", "*.tsx", "*.js", "*.jsx"],
-      "rules": {}
-    },
-    {
-      "files": ["*.ts", "*.tsx"],
-      "rules": {}
-    },
-    {
-      "files": ["*.js", "*.jsx"],
-      "rules": {}
-    }
-  ]
-}

libs/remix-ui/locale-module/README.md

@@ -1,7 +0,0 @@
-# remix-ui-locale-module
-
-This library was generated with [Nx](https://nx.dev).
-
-## Running unit tests
-
-Run `nx test remix-ui-locale-module` to execute the unit tests via [Jest](https://jestjs.io).

libs/remix-ui/locale-module/tsconfig.json

@@ -1,20 +0,0 @@
-{
-  "extends": "../../../tsconfig.base.json",
-  "compilerOptions": {
-    "jsx": "react-jsx",
-    "allowJs": true,
-    "esModuleInterop": true,
-    "allowSyntheticDefaultImports": true,
-    "forceConsistentCasingInFileNames": true,
-    "strict": true,
-    "noImplicitReturns": true,
-    "noFallthroughCasesInSwitch": true
-  },
-  "files": [],
-  "include": [],
-  "references": [
-    {
-      "path": "./tsconfig.lib.json"
-    }
-  ]
-}

libs/remix-ui/locale-module/tsconfig.lib.json

@@ -1,13 +0,0 @@
-{
-  "extends": "./tsconfig.json",
-  "compilerOptions": {
-    "outDir": "../../../dist/out-tsc",
-    "types": ["node"]
-  },
-  "files": [
-    "../../../node_modules/@nrwl/react/typings/cssmodule.d.ts",
-    "../../../node_modules/@nrwl/react/typings/image.d.ts"
-  ],
-  "exclude": ["**/*.spec.ts", "**/*.spec.tsx"],
-  "include": ["**/*.js", "**/*.jsx", "**/*.ts", "**/*.tsx"]
-}

libs/remix-ui/publish-to-storage/src/lib/publishToIPFS.tsx

@@ -1,7 +1,5 @@
 import IpfsHttpClient from 'ipfs-http-client'
 
-
-
 let ipfsNodes = []
 
 export const publishToIPFS = async (contract, api) => {
@@ -93,7 +91,6 @@ export const publishToIPFS = async (contract, api) => {
 
   try {
     const result = await ipfsVerifiedPublish(metadataContent, '', api)
-
     try {
       contract.metadataHash = result.url.match('dweb:/ipfs/(.+)')[1]
     } catch (e) {

libs/remix-ui/run-tab/src/lib/actions/deploy.ts

@@ -1,6 +1,6 @@
 import { ContractData, FuncABI } from "@remix-project/core-plugin"
 import { RunTab } from "../types/run-tab"
-import { CompilerAbstract as CompilerAbstractType } from '@remix-project/remix-solidity-ts'
+import { CompilerAbstract as CompilerAbstractType } from '@remix-project/remix-solidity'
 import * as remixLib from '@remix-project/remix-lib'
 import { DeployMode, MainnetPrompt } from "../types"
 import { displayNotification, displayPopUp, setDecodedResponse } from "./payload"

libs/remix-ui/run-tab/src/lib/actions/index.ts

@@ -7,7 +7,7 @@ import { clearInstances, clearPopUp, removeInstance, setAccount, setGasFee, setM
   setNetworkNameFromProvider, setPassphrasePrompt, setSelectedContract, setSendTransactionValue, setUnit, 
   updateBaseFeePerGas, updateConfirmSettings, updateGasPrice, updateGasPriceStatus, updateMaxFee, updateMaxPriorityFee, updateScenarioPath } from './actions'
 import { createInstance, getContext, getFuncABIInputs, getSelectedContract, loadAddress, runTransactions, updateInstanceBalance, syncContractsInternal, isValidContractAddress } from './deploy'
-import { CompilerAbstract as CompilerAbstractType } from '@remix-project/remix-solidity-ts'
+import { CompilerAbstract as CompilerAbstractType } from '@remix-project/remix-solidity'
 import { ContractData, FuncABI } from "@remix-project/core-plugin"
 import { DeployMode, MainnetPrompt } from '../types'
 import { runCurrentScenario, storeScenario } from './recorder'

libs/remix-ui/run-tab/src/lib/components/environment.tsx

@@ -28,20 +28,28 @@ export function EnvironmentUI (props: EnvironmentProps) {
     <div className="udapp_crow">
       <label id="selectExEnv" className="udapp_settingsLabel">
         <FormattedMessage id='udapp.environment' defaultMessage='Environment' />
-        <CustomTooltip placement={'right'} tooltipClasses="text-nowrap" tooltipId="info-recorder"
+        <CustomTooltip
-                tooltipText="Open chainlist and add a new provider for the chain you want to interact to.">
+          placement={'right'}
-              <a href='https://chainlist.org/' target='_blank'><i style={{ fontSize: 'medium' }} className={'ml-2 fad fa-plug'} aria-hidden="true"></i></a>
+          tooltipClasses="text-nowrap"
-        </CustomTooltip>
+          tooltipId="info-recorder"
+          tooltipText="Open chainlist and add a new provider for the chain you want to interact to."
+        >
+          <a href='https://chainlist.org/' target='_blank'><i style={{ fontSize: 'medium' }} className={'ml-2 fad fa-plug'} aria-hidden="true"></i></a>
+          </CustomTooltip>
       </label>
       <div className="udapp_environment">
-
+        <Dropdown id="selectExEnvOptions" data-id="settingsSelectEnvOptions" className='udapp_selectExEnvOptions'>
-      <Dropdown id="selectExEnvOptions" data-id="settingsSelectEnvOptions" className='udapp_selectExEnvOptions'>
           <Dropdown.Toggle as={CustomToggle} id="dropdown-custom-components" className="btn btn-light btn-block w-100 d-inline-block border border-dark form-control" icon={null}>
             { isL2(currentProvider) && 'L2 - '}
             { currentProvider && currentProvider.content }
-            { currentProvider && bridges[currentProvider.value] && <CustomTooltip placement={'right'} tooltipClasses="text-nowrap" tooltipId="info-recorder" tooltipText="Click to open a bridge for converting L1 mainnet ETH to the selected network currency.">
+            { currentProvider && bridges[currentProvider.value] && <CustomTooltip
-            <i style={{ fontSize: 'medium' }} className={'ml-2 fal fa-plug'} aria-hidden="true" onClick={() => { window.open(bridges[currentProvider.value], '_blank') }}></i>
+              placement={'right'}
-        </CustomTooltip>}
+              tooltipClasses="text-nowrap"
+              tooltipId="info-recorder"
+              tooltipText="Click to open a bridge for converting L1 mainnet ETH to the selected network currency."
+            >
+              <i style={{ fontSize: 'medium' }} className={'ml-2 fal fa-plug'} aria-hidden="true" onClick={() => { window.open(bridges[currentProvider.value], '_blank') }}></i>
+            </CustomTooltip>}
           </Dropdown.Toggle>
           <Dropdown.Menu as={CustomMenu} className='w-100 custom-dropdown-items' data-id="custom-dropdown-items" >
             {
@@ -53,14 +61,20 @@ export function EnvironmentUI (props: EnvironmentProps) {
                   }}
                   data-id={`dropdown-item-${value}`}
                 >
-                  <span className="pl-3">{ isL2({ value }) && 'L2 - ' }{ content }</span>
+                  <span className="">{ isL2({ value }) && 'L2 - ' }{ content }</span>
                 </Dropdown.Item>
               ))
             }
           </Dropdown.Menu>
         </Dropdown>
-        <CustomTooltip placement={'bottom-start'} tooltipClasses="text-wrap" tooltipId="runAndDeployAddresstooltip"
+        <CustomTooltip
-            tooltipText={<FormattedMessage id='udapp.environmentDocs' defaultMessage='Click for docs about Environment' />}>
+          placement={'bottom-start'}
+          tooltipClasses="text-wrap"
+          tooltipId="runAndDeployAddresstooltip"
+          tooltipText={<FormattedMessage
+          id='udapp.environmentDocs'
+          defaultMessage='Click for docs about Environment' />}
+        >
           <a href="https://remix-ide.readthedocs.io/en/latest/run.html#environment" target="_blank" rel="noreferrer"><i className="udapp_infoDeployAction ml-2 fas fa-info"></i></a>
         </CustomTooltip>
       </div>

libs/remix-ui/run-tab/src/lib/components/network.tsx

@@ -4,7 +4,7 @@ import { NetworkProps } from '../types'
 
 export function NetworkUI (props: NetworkProps) {
   return (
-    <div className="udapp_crow">
+    <div className="">
       <div className="udapp_settingsLabel">
       </div>
       <div className="udapp_environment" data-id="settingsNetworkEnv">

libs/remix-ui/run-tab/src/lib/components/recorderCardUI.tsx

@@ -28,7 +28,7 @@ export function RecorderUI (props: RecorderProps) {
 
 
   return (
-    <div className="udapp_cardContainer list-group-item border border-bottom">
+    <div className="udapp_cardContainer list-group-item border-top border-bottom">
       <div className="udapp_recorderSection d-flex justify-content-between" onClick={toggleClass}>
         <div className="d-flex justify-content-center align-items-center">
           <label className="mt-1 udapp_recorderSectionLabel">

libs/remix-ui/run-tab/src/lib/css/run-tab.css

@@ -45,8 +45,6 @@
   width: 164px;
   min-width: 164px;
 }
-.udapp_col2_2 {
-}
 .udapp_select {
   font-weight: normal;
   width: 100%;
@@ -314,7 +312,7 @@
 .udapp_cActionsWrapper {
   border-top-left-radius: 0;
   border-bottom-left-radius: 0.25rem;
-  border-top-rightt-radius: 0;
+  border-top-right-radius: 0;
   border-bottom-right-radius: 0.25rem;
   padding: 8px 10px 7px;
 }

libs/remix-ui/run-tab/src/lib/reducers/runTab.ts

@@ -1,4 +1,4 @@
-import { CompilerAbstract } from '@remix-project/remix-solidity-ts'
+import { CompilerAbstract } from '@remix-project/remix-solidity'
 import { ContractData } from '@remix-project/core-plugin'
 import { DeployOptions } from '../types'
 import { ADD_INSTANCE, ADD_PROVIDER, CLEAR_INSTANCES, CLEAR_RECORDER_COUNT, DISPLAY_NOTIFICATION, DISPLAY_POPUP_MESSAGE, FETCH_ACCOUNTS_LIST_FAILED, FETCH_ACCOUNTS_LIST_REQUEST, FETCH_ACCOUNTS_LIST_SUCCESS, FETCH_CONTRACT_LIST_FAILED, FETCH_CONTRACT_LIST_REQUEST, FETCH_CONTRACT_LIST_SUCCESS, FETCH_PROVIDER_LIST_FAILED, FETCH_PROVIDER_LIST_REQUEST, FETCH_PROVIDER_LIST_SUCCESS, HIDE_NOTIFICATION, HIDE_POPUP_MESSAGE, REMOVE_INSTANCE, REMOVE_PROVIDER, RESET_STATE, SET_BASE_FEE_PER_GAS, SET_CONFIRM_SETTINGS, SET_CURRENT_CONTRACT, SET_CURRENT_FILE, SET_DECODED_RESPONSE, SET_DEPLOY_OPTIONS, SET_EXECUTION_ENVIRONMENT, SET_EXTERNAL_WEB3_ENDPOINT, SET_GAS_LIMIT, SET_GAS_PRICE, SET_GAS_PRICE_STATUS, SET_IPFS_CHECKED_STATE, SET_LOAD_TYPE, SET_MATCH_PASSPHRASE, SET_MAX_FEE, SET_MAX_PRIORITY_FEE, SET_NETWORK_NAME, SET_PASSPHRASE, SET_PATH_TO_SCENARIO, SET_PERSONAL_MODE, SET_RECORDER_COUNT, SET_SELECTED_ACCOUNT, SET_SEND_UNIT, SET_SEND_VALUE, SET_PROXY_ENV_ADDRESS, ADD_DEPLOY_OPTION, REMOVE_DEPLOY_OPTION, SET_REMIXD_ACTIVATED } from '../constants'

libs/remix-ui/run-tab/src/lib/types/index.ts

@@ -1,5 +1,5 @@
 import { Ref } from 'react'
-import { CompilerAbstract } from '@remix-project/remix-solidity-ts'
+import { CompilerAbstract } from '@remix-project/remix-solidity'
 import { ContractData, FuncABI } from '@remix-project/core-plugin'
 import { ContractList } from '../reducers/runTab'
 import { RunTab } from './run-tab'

libs/remix-ui/solidity-compiler/src/lib/compiler-container.tsx

@@ -2,7 +2,7 @@ import React, { useEffect, useState, useRef, useReducer } from 'react' // eslint
 import { FormattedMessage, useIntl } from 'react-intl'
 import semver from 'semver'
 import { CompilerContainerProps } from './types'
-import { ConfigurationSettings } from '@remix-project/remix-lib-ts'
+import { ConfigurationSettings } from '@remix-project/remix-lib'
 import { checkSpecialChars, CustomTooltip, extractNameFromKey } from '@remix-ui/helper'
 import { canUseWorker, baseURLBin, baseURLWasm, urlFromVersion, pathToURL } from '@remix-project/remix-solidity'
 

libs/remix-ui/solidity-compiler/src/lib/logic/compileTabLogic.ts

@@ -1,4 +1,4 @@
-import { ICompilerApi } from '@remix-project/remix-lib-ts'
+import { ICompilerApi } from '@remix-project/remix-lib'
 import { getValidLanguage, Compiler} from '@remix-project/remix-solidity'
 import { EventEmitter } from 'events'
 

libs/remix-ui/solidity-compiler/src/lib/types/index.ts

@@ -1,4 +1,4 @@
-import { ICompilerApi, ConfigurationSettings } from '@remix-project/remix-lib-ts'
+import { ICompilerApi, ConfigurationSettings } from '@remix-project/remix-lib'
 import { CompileTabLogic } from '../logic/compileTabLogic'
 export type onCurrentFileChanged = (fileName: string) => void
 

libs/remix-ui/static-analyser/.babelrc

@@ -1,4 +0,0 @@
-{
-  "presets": ["@nrwl/react/babel"],
-  "plugins": []
-}

libs/remix-ui/static-analyser/.eslintrc

@@ -1,19 +0,0 @@
-{
-  "env": {
-      "browser": true,
-      "es6": true
-  },
-  "extends": "../../../.eslintrc.json",
-  "globals": {
-      "Atomics": "readonly",
-      "SharedArrayBuffer": "readonly"
-  },
-  "parserOptions": {
-      "ecmaVersion": 11,
-      "sourceType": "module"
-  },
-  "rules": {
-    "no-unused-vars": "off",
-    "@typescript-eslint/no-unused-vars": "error"  
-  }
-} 

libs/remix-ui/static-analyser/README.md

@@ -1,7 +0,0 @@
-# remix-ui-static-analyser
-
-This library was generated with [Nx](https://nx.dev).
-
-## Running unit tests
-
-Run `nx test remix-ui-static-analyser` to execute the unit tests via [Jest](https://jestjs.io).

libs/remix-ui/static-analyser/tsconfig.json

@@ -1,16 +0,0 @@
-{
-  "extends": "../../../tsconfig.base.json",
-  "compilerOptions": {
-    "jsx": "react",
-    "allowJs": true,
-    "esModuleInterop": true,
-    "allowSyntheticDefaultImports": true
-  },
-  "files": [],
-  "include": [],
-  "references": [
-    {
-      "path": "./tsconfig.lib.json"
-    }
-  ]
-}

libs/remix-ui/static-analyser/tsconfig.lib.json

@@ -1,13 +0,0 @@
-{
-  "extends": "./tsconfig.json",
-  "compilerOptions": {
-    "outDir": "../../../dist/out-tsc",
-    "types": ["node"]
-  },
-  "files": [
-    "../../../node_modules/@nrwl/react/typings/cssmodule.d.ts",
-    "../../../node_modules/@nrwl/react/typings/image.d.ts"
-  ],
-  "exclude": ["**/*.spec.ts", "**/*.spec.tsx"],
-  "include": ["**/*.js", "**/*.jsx", "**/*.ts", "**/*.tsx"]
-}

libs/remix-ui/tabs/.babelrc

@@ -1,4 +0,0 @@
-{
-  "presets": ["@nrwl/react/babel"],
-  "plugins": []
-}

libs/remix-ui/tabs/.eslintrc

@@ -1,19 +0,0 @@
-{
-  "env": {
-      "browser": true,
-      "es6": true
-  },
-  "extends": "../../../.eslintrc",
-  "globals": {
-      "Atomics": "readonly",
-      "SharedArrayBuffer": "readonly"
-  },
-  "parserOptions": {
-      "ecmaVersion": 11,
-      "sourceType": "module"
-  },
-  "rules": {
-    "no-unused-vars": "off",
-    "@typescript-eslint/no-unused-vars": "error"  
-  }
-} 

libs/remix-ui/tabs/README.md

@@ -1,4 +0,0 @@
-# remix-ui-tabs
-
-This library was generated with [Nx](https://nx.dev).
-Its purpose is to integrate tabs for the Remix IDE main view.

libs/remix-ui/tabs/tsconfig.json

@@ -1,19 +0,0 @@
-{
-  "extends": "../../../tsconfig.base.json",
-  "compilerOptions": {
-    "jsx": "react",
-    "allowJs": true,
-    "esModuleInterop": true,
-    "allowSyntheticDefaultImports": true
-  },
-  "files": [],
-  "include": [],
-  "references": [
-    {
-      "path": "./tsconfig.lib.json"
-    },
-    {
-      "path": "./tsconfig.spec.json"
-    }
-  ]
-}

libs/remix-ui/tabs/tsconfig.lib.json

@@ -1,13 +0,0 @@
-{
-  "extends": "./tsconfig.json",
-  "compilerOptions": {
-    "outDir": "../../dist/out-tsc",
-    "types": ["node"]
-  },
-  "files": [
-    "../../node_modules/@nrwl/react/typings/cssmodule.d.ts",
-    "../../node_modules/@nrwl/react/typings/image.d.ts"
-  ],
-  "exclude": ["**/*.spec.ts", "**/*.spec.tsx"],
-  "include": ["**/*.js", "**/*.jsx", "**/*.ts", "**/*.tsx"]
-}

tsconfig.paths.json

@@ -16,9 +16,6 @@
             "@remix-project/remix-lib": [
                 "libs/remix-lib/src/index.ts"
             ],
-            "@remix-project/remix-lib-ts": [
-                "libs/remix-lib/src/index.ts"
-            ],
             "@remix-project/remix-niks": [
                 "libs/remix-niks/src/index.ts"
             ],
@@ -31,9 +28,6 @@
             "@remix-project/remix-solidity": [
                 "libs/remix-solidity/src/index"
             ],
-            "@remix-project/remix-solidity-ts": [
-                "libs/remix-solidity/src/index.ts"
-            ],
             "@remix-project/remix-tests": [
                 "libs/remix-tests/src/index.ts"
             ],
@@ -147,7 +141,10 @@
             ],
             "remix-node": [
                 "libs/remix-node/src/index.ts"
-            ]
+            ],
+            "@remix-ui/locale-module": [
+                "libs/remix-ui/locale-module/src/index.ts"
+            ],
         }
     }
 }