From 8ae133e442f052198328d7555206fe98e882bfe7 Mon Sep 17 00:00:00 2001 From: ioedeveloper Date: Thu, 17 Jun 2021 18:58:41 +0100 Subject: [PATCH 01/32] Moved existing code to new branch --- .../modal-dialog/src/lib/types/index.ts | 2 +- libs/remix-ui/publish-to-storage/.babelrc | 4 + libs/remix-ui/publish-to-storage/.eslintrc | 16 + libs/remix-ui/publish-to-storage/README.md | 7 + libs/remix-ui/publish-to-storage/src/index.ts | 1 + .../src/lib/publish-to-storage.css | 0 .../src/lib/publish-to-storage.tsx | 138 +++++ .../src/lib/publishOnSwarm.tsx | 102 ++++ .../src/lib/publishToIPFS.tsx | 110 ++++ .../publish-to-storage/src/lib/types/index.ts | 6 + .../remix-ui/publish-to-storage/tsconfig.json | 16 + .../publish-to-storage/tsconfig.lib.json | 13 + libs/remix-ui/solidity-compiler/.babelrc | 4 + libs/remix-ui/solidity-compiler/.eslintrc | 16 + libs/remix-ui/solidity-compiler/README.md | 7 + libs/remix-ui/solidity-compiler/src/index.ts | 1 + .../src/lib/compileTabLogic.ts | 90 +++ .../src/lib/compiler-container.tsx | 521 ++++++++++++++++++ .../src/lib/contract-selection.tsx | 159 ++++++ .../solidity-compiler/src/lib/css/style.css | 234 ++++++++ .../src/lib/solidity-compiler.css | 0 .../src/lib/solidity-compiler.tsx | 97 ++++ .../solidity-compiler/src/lib/types/index.ts | 24 + libs/remix-ui/solidity-compiler/tsconfig.json | 16 + .../solidity-compiler/tsconfig.lib.json | 13 + nx.json | 6 + tsconfig.json | 6 +- workspace.json | 38 ++ 28 files changed, 1643 insertions(+), 4 deletions(-) create mode 100644 libs/remix-ui/publish-to-storage/.babelrc create mode 100644 libs/remix-ui/publish-to-storage/.eslintrc create mode 100644 libs/remix-ui/publish-to-storage/README.md create mode 100644 libs/remix-ui/publish-to-storage/src/index.ts create mode 100644 libs/remix-ui/publish-to-storage/src/lib/publish-to-storage.css create mode 100644 libs/remix-ui/publish-to-storage/src/lib/publish-to-storage.tsx create mode 100644 libs/remix-ui/publish-to-storage/src/lib/publishOnSwarm.tsx create mode 100644 libs/remix-ui/publish-to-storage/src/lib/publishToIPFS.tsx create mode 100644 libs/remix-ui/publish-to-storage/src/lib/types/index.ts create mode 100644 libs/remix-ui/publish-to-storage/tsconfig.json create mode 100644 libs/remix-ui/publish-to-storage/tsconfig.lib.json create mode 100644 libs/remix-ui/solidity-compiler/.babelrc create mode 100644 libs/remix-ui/solidity-compiler/.eslintrc create mode 100644 libs/remix-ui/solidity-compiler/README.md create mode 100644 libs/remix-ui/solidity-compiler/src/index.ts create mode 100644 libs/remix-ui/solidity-compiler/src/lib/compileTabLogic.ts create mode 100644 libs/remix-ui/solidity-compiler/src/lib/compiler-container.tsx create mode 100644 libs/remix-ui/solidity-compiler/src/lib/contract-selection.tsx create mode 100644 libs/remix-ui/solidity-compiler/src/lib/css/style.css create mode 100644 libs/remix-ui/solidity-compiler/src/lib/solidity-compiler.css create mode 100644 libs/remix-ui/solidity-compiler/src/lib/solidity-compiler.tsx create mode 100644 libs/remix-ui/solidity-compiler/src/lib/types/index.ts create mode 100644 libs/remix-ui/solidity-compiler/tsconfig.json create mode 100644 libs/remix-ui/solidity-compiler/tsconfig.lib.json diff --git a/libs/remix-ui/modal-dialog/src/lib/types/index.ts b/libs/remix-ui/modal-dialog/src/lib/types/index.ts index 58d15cdb87..ee2746e3d6 100644 --- a/libs/remix-ui/modal-dialog/src/lib/types/index.ts +++ b/libs/remix-ui/modal-dialog/src/lib/types/index.ts @@ -1,7 +1,7 @@ export interface ModalDialogProps { id?: string title?: string, - message?: string, + message?: string | JSX.Element, okLabel?: string, okFn?: () => void, cancelLabel?: string, diff --git a/libs/remix-ui/publish-to-storage/.babelrc b/libs/remix-ui/publish-to-storage/.babelrc new file mode 100644 index 0000000000..09d67939cc --- /dev/null +++ b/libs/remix-ui/publish-to-storage/.babelrc @@ -0,0 +1,4 @@ +{ + "presets": ["@nrwl/react/babel"], + "plugins": [] +} diff --git a/libs/remix-ui/publish-to-storage/.eslintrc b/libs/remix-ui/publish-to-storage/.eslintrc new file mode 100644 index 0000000000..6b65264565 --- /dev/null +++ b/libs/remix-ui/publish-to-storage/.eslintrc @@ -0,0 +1,16 @@ +{ + "extends": "../../../tsconfig.json", + "compilerOptions": { + "jsx": "react", + "allowJs": true, + "esModuleInterop": true, + "allowSyntheticDefaultImports": true + }, + "files": [], + "include": [], + "references": [ + { + "path": "./tsconfig.lib.json" + } + ] +} diff --git a/libs/remix-ui/publish-to-storage/README.md b/libs/remix-ui/publish-to-storage/README.md new file mode 100644 index 0000000000..d5688bae4c --- /dev/null +++ b/libs/remix-ui/publish-to-storage/README.md @@ -0,0 +1,7 @@ +# remix-ui-publish-to-storage + +This library was generated with [Nx](https://nx.dev). + +## Running unit tests + +Run `nx test remix-ui-publish-to-storage` to execute the unit tests via [Jest](https://jestjs.io). diff --git a/libs/remix-ui/publish-to-storage/src/index.ts b/libs/remix-ui/publish-to-storage/src/index.ts new file mode 100644 index 0000000000..00fccbcf8f --- /dev/null +++ b/libs/remix-ui/publish-to-storage/src/index.ts @@ -0,0 +1 @@ +export * from './lib/remix-ui-publish-to-storage'; diff --git a/libs/remix-ui/publish-to-storage/src/lib/publish-to-storage.css b/libs/remix-ui/publish-to-storage/src/lib/publish-to-storage.css new file mode 100644 index 0000000000..e69de29bb2 diff --git a/libs/remix-ui/publish-to-storage/src/lib/publish-to-storage.tsx b/libs/remix-ui/publish-to-storage/src/lib/publish-to-storage.tsx new file mode 100644 index 0000000000..04cc7f8c3b --- /dev/null +++ b/libs/remix-ui/publish-to-storage/src/lib/publish-to-storage.tsx @@ -0,0 +1,138 @@ +import React, { useEffect, useState } from 'react' // eslint-disable-line +import { ModalDialog } from '@remix-ui/modal-dialog' // eslint-disable-line +import { RemixUiPublishToStorageProps } from './types' +import { publishToIPFS } from './publishToIPFS' +import { publishToSwarm } from './publishOnSwarm' + +import './css/publish-to-storage.css' + +export const PublishToStorage = (props: RemixUiPublishToStorageProps) => { + const { storage, fileProvider, fileManager, contract } = props + const [state, setState] = useState({ + modal: { + title: '', + message: null, + hide: true, + ok: { + label: '', + fn: null + }, + cancel: { + label: '', + fn: null + } + } + }) + + useEffect(() => { + const storageService = async () => { + if ((contract.metadata === undefined || contract.metadata.length === 0)) { + modal('Publish To Storage', 'This contract may be abstract, may not implement an abstract parent\'s methods completely or not invoke an inherited contract\'s constructor correctly.', { + label: 'OK', + fn: () => {} + }, null) + } else { + if (storage === 'swarm') { + try { + const result = await publishToSwarm(contract, fileManager) + + modal(`Published ${contract.name}'s Metadata`, publishMessage(result.uploaded), { + label: 'OK', + fn: () => {} + }, null) + // triggered each time there's a new verified publish (means hash correspond) + fileProvider.addExternal('swarm/' + result.item.hash, result.item.content) + } catch (err) { + try { + err = JSON.stringify(err) + } catch (e) {} + modal(`Swarm Publish Failed`, publishMessageFailed(storage, err), { + label: 'OK', + fn: () => {} + }, null) + } + } else { + try { + const result = await publishToIPFS(contract, fileManager) + + modal(`Published ${contract.name}'s Metadata`, publishMessage(result.uploaded), { + label: 'OK', + fn: () => {} + }, null) + // triggered each time there's a new verified publish (means hash correspond) + fileProvider.addExternal('swarm/' + result.item.hash, result.item.content) + } catch (err) { + modal(`Swarm Publish Failed`, publishMessageFailed(storage, err), { + label: 'OK', + fn: () => {} + }, null) + } + } + } + } + + if (contract) { + storageService() + } +}, [contract]) + + const publishMessage = (uploaded) => { + return ( + Metadata of {contract.name.toLowerCase()} was published successfully.
+
+          
+ { uploaded.map((value) => { +
{ value.filename } :
{ value.output.url }
+ }) } +
+
+
+ ) + } + + const publishMessageFailed = (storage, err) => { + return ( + Failed to publish metadata file to { storage }, please check the { storage } gateways is available.
+ {err} +
+ ) + } + + const handleHideModal = () => { + setState(prevState => { + return { ...prevState, modal: { ...prevState.modal, hide: true, message: null } } + }) + } + + const modal = async (title: string, message: string | JSX.Element, ok: { label: string, fn: () => void }, cancel: { label: string, fn: () => void }) => { + await setState(prevState => { + return { + ...prevState, + modal: { + ...prevState.modal, + hide: false, + message, + title, + ok, + cancel, + handleHide: handleHideModal + } + } + }) + } + + return ( + + { (typeof state.modal.message !== 'string') && state.modal.message } + + ) +} + +export default PublishToStorage diff --git a/libs/remix-ui/publish-to-storage/src/lib/publishOnSwarm.tsx b/libs/remix-ui/publish-to-storage/src/lib/publishOnSwarm.tsx new file mode 100644 index 0000000000..2521b90ea3 --- /dev/null +++ b/libs/remix-ui/publish-to-storage/src/lib/publishOnSwarm.tsx @@ -0,0 +1,102 @@ +import swarm from 'swarmgw' + +const swarmgw = swarm() + +export const publishToSwarm = async (contract, fileManager) => { + // gather list of files to publish + const sources = [] + let metadata + let item = null + const uploaded = [] + + try { + metadata = JSON.parse(contract.metadata) + } catch (e) { + throw new Error(e) + } + + if (metadata === undefined) { + throw new Error('No metadata') + } + + await Promise.all(Object.keys(metadata.sources).map(fileName => { + // find hash + let hash = null + try { + // we try extract the hash defined in the metadata.json + // in order to check if the hash that we get after publishing is the same as the one located in metadata.json + // if it's not the same, we throw "hash mismatch between solidity bytecode and uploaded content" + // if we don't find the hash in the metadata.json, the check is not done. + // + // TODO: refactor this with publishOnIpfs + if (metadata.sources[fileName].urls) { + metadata.sources[fileName].urls.forEach(url => { + if (url.includes('bzz')) hash = url.match('(bzzr|bzz-raw)://(.+)')[1] + }) + } + } catch (e) { + throw new Error('Error while extracting the hash from metadata.json') + } + + fileManager.fileProviderOf(fileName).get(fileName, (error, content) => { + if (error) { + console.log(error) + } else { + sources.push({ + content: content, + hash: hash, + filename: fileName + }) + } + }) + })) + // publish the list of sources in order, fail if any failed + + await Promise.all(sources.map((item) => { + swarmVerifiedPublish(item.content, item.hash, (error, result) => { + try { + item.hash = result.url.match('bzz-raw://(.+)')[1] + } catch (e) { + item.hash = ' - ' + item.fileName + } + item.output = result + uploaded.push(item) + // TODO this is a fix cause Solidity metadata does not contain the right swarm hash (poc 0.3) + metadata.sources[item.filename].urls[0] = result.url + }) + })) + + const metadataContent = JSON.stringify(metadata) + + swarmVerifiedPublish(metadataContent, '', (error, result) => { + try { + contract.metadataHash = result.url.match('bzz-raw://(.+)')[1] + } catch (e) { + contract.metadataHash = ' - metadata.json' + } + if (!error) { + item.content = metadataContent + item.hash = contract.metadataHash + } + uploaded.push({ + content: contract.metadata, + hash: contract.metadataHash, + filename: 'metadata.json', + output: result + }) + }) + + return { uploaded, item } +} + +const swarmVerifiedPublish = (content, expectedHash, cb) => { + swarmgw.put(content, function (err, ret) { + if (err) { + cb(err) + } else if (expectedHash && ret !== expectedHash) { + cb(null, { message: 'hash mismatch between solidity bytecode and uploaded content.', url: 'bzz-raw://' + ret, hash: ret }) + } else { + cb(null, { message: 'ok', url: 'bzz-raw://' + ret, hash: ret }) + } + }) +} diff --git a/libs/remix-ui/publish-to-storage/src/lib/publishToIPFS.tsx b/libs/remix-ui/publish-to-storage/src/lib/publishToIPFS.tsx new file mode 100644 index 0000000000..6f09279b11 --- /dev/null +++ b/libs/remix-ui/publish-to-storage/src/lib/publishToIPFS.tsx @@ -0,0 +1,110 @@ +import IpfsClient from 'ipfs-mini' + +const ipfsNodes = [ + new IpfsClient({ host: 'ipfs.komputing.org', port: 443, protocol: 'https' }), + new IpfsClient({ host: 'ipfs.infura.io', port: 5001, protocol: 'https' }), + new IpfsClient({ host: '127.0.0.1', port: 5001, protocol: 'http' }) +] + +export const publishToIPFS = async (contract, fileManager) => { + // gather list of files to publish + const sources = [] + let metadata + let item = null + const uploaded = [] + + try { + metadata = JSON.parse(contract.metadata) + } catch (e) { + throw new Error(e) + } + + if (metadata === undefined) { + throw new Error('No metadata') + } + + await Promise.all(Object.keys(metadata.sources).map(fileName => { + // find hash + let hash = null + try { + // we try extract the hash defined in the metadata.json + // in order to check if the hash that we get after publishing is the same as the one located in metadata.json + // if it's not the same, we throw "hash mismatch between solidity bytecode and uploaded content" + // if we don't find the hash in the metadata.json, the check is not done. + // + // TODO: refactor this with publishOnSwarm + if (metadata.sources[fileName].urls) { + metadata.sources[fileName].urls.forEach(url => { + if (url.includes('ipfs')) hash = url.match('dweb:/ipfs/(.+)')[1] + }) + } + } catch (e) { + throw new Error('Error while extracting the hash from metadata.json') + } + + fileManager.fileProviderOf(fileName).get(fileName, (error, content) => { + if (error) { + console.log(error) + } else { + sources.push({ + content: content, + hash: hash, + filename: fileName + }) + } + }) + })) + // publish the list of sources in order, fail if any failed + await Promise.all(sources.map(item => { + ipfsVerifiedPublish(item.content, item.hash, (error, result) => { + try { + item.hash = result.url.match('dweb:/ipfs/(.+)')[1] + } catch (e) { + item.hash = ' - ' + item.fileName + } + item.output = result + uploaded.push(item) + }) + })) + const metadataContent = JSON.stringify(metadata) + + ipfsVerifiedPublish(metadataContent, '', (error, result) => { + try { + contract.metadataHash = result.url.match('dweb:/ipfs/(.+)')[1] + } catch (e) { + contract.metadataHash = ' - metadata.json' + } + if (!error) { + item.content = metadataContent + item.hash = contract.metadataHash + } + uploaded.push({ + content: contract.metadata, + hash: contract.metadataHash, + filename: 'metadata.json', + output: result + }) + }) + + return { uploaded, item } +} + +const ipfsVerifiedPublish = async (content, expectedHash, cb) => { + try { + const results = await severalGatewaysPush(content) + if (expectedHash && results !== expectedHash) { + cb(null, { message: 'hash mismatch between solidity bytecode and uploaded content.', url: 'dweb:/ipfs/' + results, hash: results }) + } else { + cb(null, { message: 'ok', url: 'dweb:/ipfs/' + results, hash: results }) + } + } catch (error) { + cb(error) + } +} + +const severalGatewaysPush = (content) => { + const invert = p => new Promise((resolve, reject) => p.then(reject).catch(resolve)) // Invert res and rej + const promises = ipfsNodes.map((node) => invert(node.add(content))) + + return invert(Promise.all(promises)) +} diff --git a/libs/remix-ui/publish-to-storage/src/lib/types/index.ts b/libs/remix-ui/publish-to-storage/src/lib/types/index.ts new file mode 100644 index 0000000000..db95172c81 --- /dev/null +++ b/libs/remix-ui/publish-to-storage/src/lib/types/index.ts @@ -0,0 +1,6 @@ +export interface RemixUiPublishToStorageProps { + storage: string, + fileProvider: any, + fileManager: any, + contract: any +} diff --git a/libs/remix-ui/publish-to-storage/tsconfig.json b/libs/remix-ui/publish-to-storage/tsconfig.json new file mode 100644 index 0000000000..6b65264565 --- /dev/null +++ b/libs/remix-ui/publish-to-storage/tsconfig.json @@ -0,0 +1,16 @@ +{ + "extends": "../../../tsconfig.json", + "compilerOptions": { + "jsx": "react", + "allowJs": true, + "esModuleInterop": true, + "allowSyntheticDefaultImports": true + }, + "files": [], + "include": [], + "references": [ + { + "path": "./tsconfig.lib.json" + } + ] +} diff --git a/libs/remix-ui/publish-to-storage/tsconfig.lib.json b/libs/remix-ui/publish-to-storage/tsconfig.lib.json new file mode 100644 index 0000000000..b560bc4dec --- /dev/null +++ b/libs/remix-ui/publish-to-storage/tsconfig.lib.json @@ -0,0 +1,13 @@ +{ + "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"] +} diff --git a/libs/remix-ui/solidity-compiler/.babelrc b/libs/remix-ui/solidity-compiler/.babelrc new file mode 100644 index 0000000000..09d67939cc --- /dev/null +++ b/libs/remix-ui/solidity-compiler/.babelrc @@ -0,0 +1,4 @@ +{ + "presets": ["@nrwl/react/babel"], + "plugins": [] +} diff --git a/libs/remix-ui/solidity-compiler/.eslintrc b/libs/remix-ui/solidity-compiler/.eslintrc new file mode 100644 index 0000000000..6b65264565 --- /dev/null +++ b/libs/remix-ui/solidity-compiler/.eslintrc @@ -0,0 +1,16 @@ +{ + "extends": "../../../tsconfig.json", + "compilerOptions": { + "jsx": "react", + "allowJs": true, + "esModuleInterop": true, + "allowSyntheticDefaultImports": true + }, + "files": [], + "include": [], + "references": [ + { + "path": "./tsconfig.lib.json" + } + ] +} diff --git a/libs/remix-ui/solidity-compiler/README.md b/libs/remix-ui/solidity-compiler/README.md new file mode 100644 index 0000000000..9bcc1b1012 --- /dev/null +++ b/libs/remix-ui/solidity-compiler/README.md @@ -0,0 +1,7 @@ +# remix-ui-solidity-compiler + +This library was generated with [Nx](https://nx.dev). + +## Running unit tests + +Run `nx test remix-ui-solidity-compiler` to execute the unit tests via [Jest](https://jestjs.io). diff --git a/libs/remix-ui/solidity-compiler/src/index.ts b/libs/remix-ui/solidity-compiler/src/index.ts new file mode 100644 index 0000000000..6ebd19dc79 --- /dev/null +++ b/libs/remix-ui/solidity-compiler/src/index.ts @@ -0,0 +1 @@ +export * from './lib/remix-ui-solidity-compiler'; diff --git a/libs/remix-ui/solidity-compiler/src/lib/compileTabLogic.ts b/libs/remix-ui/solidity-compiler/src/lib/compileTabLogic.ts new file mode 100644 index 0000000000..8fd88f1f49 --- /dev/null +++ b/libs/remix-ui/solidity-compiler/src/lib/compileTabLogic.ts @@ -0,0 +1,90 @@ +var Compiler = require('@remix-project/remix-solidity').Compiler + +export default class CompileTab { + public compiler + public optimize + public runs: number + public evmVersion: string + public compilerImport + + constructor (public queryParams, public fileManager, public editor, public config, public fileProvider, public contentImport, public miscApi) { + // this.event = new EventEmitter() + this.compiler = new Compiler((url, cb) => this.compilerImport.resolveAndSave(url).then((result) => cb(null, result)).catch((error) => cb(error.message))) + } + + init () { + this.optimize = this.queryParams.get().optimize + this.optimize = this.optimize === 'true' + this.queryParams.update({ optimize: this.optimize }) + this.compiler.set('optimize', this.optimize) + + this.runs = this.queryParams.get().runs + this.runs = this.runs || 200 + this.queryParams.update({ runs: this.runs }) + this.compiler.set('runs', this.runs) + + this.evmVersion = this.queryParams.get().evmVersion + if (this.evmVersion === 'undefined' || this.evmVersion === 'null' || !this.evmVersion) { + this.evmVersion = null + } + this.queryParams.update({ evmVersion: this.evmVersion }) + this.compiler.set('evmVersion', this.evmVersion) + } + + setOptimize (newOptimizeValue) { + this.optimize = newOptimizeValue + this.queryParams.update({ optimize: this.optimize }) + this.compiler.set('optimize', this.optimize) + } + + setRuns (runs) { + this.runs = runs + this.queryParams.update({ runs: this.runs }) + this.compiler.set('runs', this.runs) + } + + setEvmVersion (newEvmVersion) { + this.evmVersion = newEvmVersion + this.queryParams.update({ evmVersion: this.evmVersion }) + this.compiler.set('evmVersion', this.evmVersion) + } + + /** + * Set the compiler to using Solidity or Yul (default to Solidity) + * @params lang {'Solidity' | 'Yul'} ... + */ + setLanguage (lang) { + this.compiler.set('language', lang) + } + + /** + * Compile a specific file of the file manager + * @param {string} target the path to the file to compile + */ + compileFile (target) { + if (!target) throw new Error('No target provided for compiliation') + const provider = this.fileManager.fileProviderOf(target) + + if (!provider) throw new Error(`cannot compile ${target}. Does not belong to any explorer`) + return new Promise((resolve, reject) => { + provider.get(target, (error, content) => { + if (error) return reject(error) + const sources = { [target]: { content } } + // this.event.emit('startingCompilation') + // setTimeout fix the animation on chrome... (animation triggered by 'staringCompilation') + setTimeout(() => { this.compiler.compile(sources, target); resolve(true) }, 100) + }) + }) + } + + runCompiler () { + try { + this.fileManager.saveCurrentFile() + this.miscApi.clearAnnotations() + var currentFile = this.config.get('currentFile') + return this.compileFile(currentFile) + } catch (err) { + console.error(err) + } + } +} diff --git a/libs/remix-ui/solidity-compiler/src/lib/compiler-container.tsx b/libs/remix-ui/solidity-compiler/src/lib/compiler-container.tsx new file mode 100644 index 0000000000..fea7de22e8 --- /dev/null +++ b/libs/remix-ui/solidity-compiler/src/lib/compiler-container.tsx @@ -0,0 +1,521 @@ +import React, { useEffect, useState, useRef } from 'react' // eslint-disable-line +import semver from 'semver' +import { CompilerContainerProps } from './types' +import * as helper from '../../../../../apps/remix-ide/src/lib/helper' +import { canUseWorker, baseURLBin, baseURLWasm, urlFromVersion, pathToURL, promisedMiniXhr } from '../../../../../apps/remix-ide/src/app/compiler/compiler-utils' // eslint-disable-line + +import './css/style.css' + +export const CompilerContainer = (props: CompilerContainerProps) => { + const { editor, config, queryParams, compileTabLogic, tooltip, modal } = props // eslint-disable-line + const [state, setState] = useState({ + hideWarnings: false, + autoCompile: false, + optimise: false, + compileTimeout: null, + timeout: 300, + allversions: [], + selectedVersion: null, + defaultVersion: 'soljson-v0.7.4+commit.3f05b770.js', // this default version is defined: in makeMockCompiler (for browser test) + selectedLanguage: '', + runs: '', + compiledFileName: '', + includeNightlies: false, + language: '', + evmVersion: '' + }) + const compileIcon = useRef(null) + const warningIcon = useRef(null) + const promptMessageInput = useRef(null) + + useEffect(() => { + fetchAllVersion((allversions, selectedVersion, isURL) => { + setState(prevState => { + return { ...prevState, allversions } + }) + if (isURL) _updateVersionSelector(selectedVersion) + else { + setState(prevState => { + return { ...prevState, selectedVersion } + }) + // if (this._view.versionSelector) this._updateVersionSelector() + } + }) + }, []) + + useEffect(() => { + if (compileTabLogic && compileTabLogic.compiler) { + compileTabLogic.compiler.event.register('compilerLoaded', compilerLoaded) + + setState(prevState => { + return { ...prevState, hideWarnings: config.get('hideWarnings'), autoCompile: config.get('autoCompile'), optimise: config.get('optimise') } + }) + } + }, [compileTabLogic]) + + const compilerLoaded = (version: string) => { + setVersionText(version) + } + + const setVersionText = (text) => { + // if (this._view.version) this._view.version.innerText = text + } + + // fetching both normal and wasm builds and creating a [version, baseUrl] map + const fetchAllVersion = async (callback) => { + let selectedVersion, allVersionsWasm, isURL + let allVersions = [{ path: 'builtin', longVersion: 'latest local version - 0.7.4' }] + // fetch normal builds + const binRes = await promisedMiniXhr(`${baseURLBin}/list.json`) + // fetch wasm builds + const wasmRes = await promisedMiniXhr(`${baseURLWasm}/list.json`) + if (binRes.event.type === 'error' && wasmRes.event.type === 'error') { + selectedVersion = 'builtin' + return callback(allVersions, selectedVersion) + } + try { + const versions = JSON.parse(binRes.json).builds.slice().reverse() + + allVersions = [...allVersions, ...versions] + selectedVersion = state.defaultVersion + if (queryParams.get().version) selectedVersion = queryParams.get().version + // Check if version is a URL and corresponding filename starts with 'soljson' + if (selectedVersion.startsWith('https://')) { + const urlArr = selectedVersion.split('/') + + if (urlArr[urlArr.length - 1].startsWith('soljson')) isURL = true + } + if (wasmRes.event.type !== 'error') { + allVersionsWasm = JSON.parse(wasmRes.json).builds.slice().reverse() + } + } catch (e) { + tooltip('Cannot load compiler version list. It might have been blocked by an advertisement blocker. Please try deactivating any of them from this page and reload. Error: ' + e) + } + // replace in allVersions those compiler builds which exist in allVersionsWasm with new once + if (allVersionsWasm && allVersions) { + allVersions.forEach((compiler, index) => { + const wasmIndex = allVersionsWasm.findIndex(wasmCompiler => { return wasmCompiler.longVersion === compiler.longVersion }) + if (wasmIndex !== -1) { + allVersions[index] = allVersionsWasm[wasmIndex] + pathToURL[compiler.path] = baseURLWasm + } else { + pathToURL[compiler.path] = baseURLBin + } + }) + } + callback(allVersions, selectedVersion, isURL) + } + + /** + * Update the compilation button with the name of the current file + */ + const currentFile = (name = '') => { + if (name && name !== '') { + _setCompilerVersionFromPragma(name) + } + const compiledFileName = name.split('/').pop() + + setState(prevState => { + return { ...prevState, compiledFileName } + }) + } + + // Load solc compiler version according to pragma in contract file + const _setCompilerVersionFromPragma = (filename: string) => { + if (!state.allversions) return + compileTabLogic.fileManager.readFile(filename).then(data => { + const pragmaArr = data.match(/(pragma solidity (.+?);)/g) + if (pragmaArr && pragmaArr.length === 1) { + const pragmaStr = pragmaArr[0].replace('pragma solidity', '').trim() + const pragma = pragmaStr.substring(0, pragmaStr.length - 1) + const releasedVersions = state.allversions.filter(obj => !obj.prerelease).map(obj => obj.version) + const allVersions = state.allversions.map(obj => _retrieveVersion(obj.version)) + const currentCompilerName = _retrieveVersion(/** this._view.versionSelector.selectedOptions[0].label **/) + // contains only numbers part, for example '0.4.22' + const pureVersion = _retrieveVersion() + // is nightly build newer than the last release + const isNewestNightly = currentCompilerName.includes('nightly') && semver.gt(pureVersion, releasedVersions[0]) + // checking if the selected version is in the pragma range + const isInRange = semver.satisfies(pureVersion, pragma) + // checking if the selected version is from official compilers list(excluding custom versions) and in range or greater + const isOfficial = allVersions.includes(currentCompilerName) + if (isOfficial && (!isInRange && !isNewestNightly)) { + const compilerToLoad = semver.maxSatisfying(releasedVersions, pragma) + const compilerPath = state.allversions.filter(obj => !obj.prerelease && obj.version === compilerToLoad)[0].path + if (state.selectedVersion !== compilerPath) { + state.selectedVersion = compilerPath + _updateVersionSelector() + } + } + } + }) + } + + const isSolFileSelected = (currentFile = '') => { + if (!currentFile) currentFile = config.get('currentFile') + if (!currentFile) return false + const extention = currentFile.substr(currentFile.length - 3, currentFile.length) + return extention.toLowerCase() === 'sol' || extention.toLowerCase() === 'yul' + } + + const deactivate = () => { + // deactivate editor listeners + editor.event.unregister('contentChanged') + editor.event.unregister('sessionSwitched') + } + + const activate = () => { + const currentFileName = config.get('currentFile') + + currentFile(currentFileName) + listenToEvents() + } + + const listenToEvents = () => { + editor.event.register('sessionSwitched', () => { + if (!compileIcon.current) return + scheduleCompilation() + }) + + compileTabLogic.event.on('startingCompilation', () => { + if (!compileIcon.current) return + compileIcon.current.setAttribute('title', 'compiling...') + compileIcon.current.classList.remove('remixui_bouncingIcon') + compileIcon.current.classList.add('remixui_spinningIcon') + }) + + compileTabLogic.compiler.event.register('compilationDuration', (speed) => { + if (!warningIcon.current) return + if (speed > 1000) { + const msg = `Last compilation took ${speed}ms. We suggest to turn off autocompilation.` + + warningIcon.current.setAttribute('title', msg) + warningIcon.current.style.visibility = 'visible' + } else { + warningIcon.current.style.visibility = 'hidden' + } + }) + + editor.event.register('contentChanged', () => { + if (!compileIcon.current) return + scheduleCompilation() + compileIcon.current.classList.add('remixui_bouncingIcon') // @TODO: compileView tab + }) + + compileTabLogic.compiler.event.register('loadingCompiler', () => { + if (!compileIcon.current) return + // _disableCompileBtn(true) + compileIcon.current.setAttribute('title', 'compiler is loading, please wait a few moments.') + compileIcon.current.classList.add('remixui_spinningIcon') + warningIcon.current.style.visibility = 'hidden' + _updateLanguageSelector() + }) + + compileTabLogic.compiler.event.register('compilerLoaded', () => { + if (!compileIcon.current) return + // _disableCompileBtn(false) + compileIcon.current.setAttribute('title', '') + compileIcon.current.classList.remove('remixui_spinningIcon') + if (state.autoCompile) compileIfAutoCompileOn() + }) + + compileTabLogic.compiler.event.register('compilationFinished', (success, data, source) => { + if (!compileIcon.current) return + compileIcon.current.setAttribute('title', 'idle') + compileIcon.current.classList.remove('remixui_spinningIcon') + compileIcon.current.classList.remove('remixui_bouncingIcon') + }) + } + + const scheduleCompilation = () => { + if (!state.autoCompile) return + if (state.compileTimeout) window.clearTimeout(state.compileTimeout) + const compileTimeout = window.setTimeout(() => compileIfAutoCompileOn(), state.timeout) + + setState(prevState => { + return { ...prevState, compileTimeout } + }) + } + + const compileIfAutoCompileOn = () => { + if (config.get('autoCompile')) { + compile() + } + } + + const compile = () => { + const currentFile = config.get('currentFile') + + if (!isSolFileSelected()) return + + _setCompilerVersionFromPragma(currentFile) + compileTabLogic.runCompiler() + } + + const _retrieveVersion = (version?) => { + // if (!version) version = this._view.versionSelector.value + return semver.coerce(version) ? semver.coerce(version).version : '' + } + + const _updateVersionSelector = (customUrl = '') => { + // update selectedversion of previous one got filtered out + let selectedVersion = state.selectedVersion + if (!selectedVersion || !_shouldBeAdded(selectedVersion)) { + selectedVersion = state.defaultVersion + setState(prevState => { + return { ...prevState, selectedVersion } + }) + } + queryParams.update({ version: selectedVersion }) + let url + + if (customUrl !== '') { + selectedVersion = customUrl + setState(prevState => { + return { ...prevState, selectedVersion } + }) + // this._view.versionSelector.appendChild(yo``) + url = customUrl + queryParams.update({ version: selectedVersion }) + } else if (selectedVersion === 'builtin') { + let location: string | Location = window.document.location + let path = location.pathname + if (!path.startsWith('/')) path = '/' + path + location = `${location.protocol}//${location.host}${path}assets/js` + if (location.endsWith('index.html')) location = location.substring(0, location.length - 10) + if (!location.endsWith('/')) location += '/' + url = location + 'soljson.js' + } else { + console.log('selectedVersion: ', selectedVersion) + if (selectedVersion.indexOf('soljson') !== 0 || helper.checkSpecialChars(selectedVersion)) { + return console.log('loading ' + selectedVersion + ' not allowed') + } + url = `${urlFromVersion(selectedVersion)}` + } + + // Workers cannot load js on "file:"-URLs and we get a + // "Uncaught RangeError: Maximum call stack size exceeded" error on Chromium, + // resort to non-worker version in that case. + if (selectedVersion !== 'builtin' && canUseWorker(selectedVersion)) { + compileTabLogic.compiler.loadVersion(true, url) + // setVersionText('(loading using worker)') + } else { + compileTabLogic.compiler.loadVersion(false, url) + // setVersionText('(loading)') + } + } + + const _shouldBeAdded = (version) => { + return !version.includes('nightly') || + (version.includes('nightly') && state.includeNightlies) + } + + // const setVersionText = (text) => { + // if (this._view.version) this._view.version.innerText = text + // } + + const promtCompiler = () => { + modal('Add a custom compiler', promptMessage('URL'), 'OK', addCustomCompiler, 'Cancel', () => {}) + // modalDialogCustom.prompt( + // 'Add a custom compiler', + // 'URL', + // '', + // (url) => this.addCustomCompiler(url) + // ) + } + + const promptMessage = (message) => { + return ( + <> + { message } + + + ) + } + + const addCustomCompiler = () => { + const url = promptMessageInput.current.value + + setState(prevState => { + return { ...prevState, selectedVersion: url } + }) + _updateVersionSelector(url) + } + + const handleLoadVersion = (value) => { + setState(prevState => { + return { ...prevState, selectedVersion: value } + }) + _updateVersionSelector() + _updateLanguageSelector() + } + + const _updateLanguageSelector = () => { + // This is the first version when Yul is available + if (!semver.valid(_retrieveVersion()) || semver.lt(_retrieveVersion(), 'v0.5.7+commit.6da8b019.js')) { + // this._view.languageSelector.setAttribute('disabled', '') + // this._view.languageSelector.value = 'Solidity' + // this.compileTabLogic.setLanguage('Solidity') + } else { + // this._view.languageSelector.removeAttribute('disabled') + } + } + + const handleAutoCompile = (e) => { + const checked = e.target.checked + + config.set('autoCompile', checked) + setState(prevState => { + return { ...prevState, autoCompile: checked } + }) + } + + const handleOptimizeChange = (e) => { + const checked = !!e.target.checked + + config.set('optimise', checked) + compileTabLogic.setOptimize(checked) + if (compileTabLogic.optimize) { + compileTabLogic.setRuns(parseInt(state.runs)) + } else { + compileTabLogic.setRuns(200) + } + compileIfAutoCompileOn() + setState(prevState => { + return { ...prevState, optimise: checked } + }) + } + + const onChangeRuns = (e) => { + const runs = e.target.value + + compileTabLogic.setRuns(parseInt(runs)) + compileIfAutoCompileOn() + setState(prevState => { + return { ...prevState, runs } + }) + } + + const handleHideWarningsChange = (e) => { + const checked = e.target.checked + + config.set('hideWarnings', checked) + compileIfAutoCompileOn() + setState(prevState => { + return { ...prevState, hideWarnings: checked } + }) + } + + const handleNightliesChange = () => { + setState(prevState => { + return { ...prevState, includeNightlies: !prevState.includeNightlies } + }) + } + + const handleLanguageChange = (value) => { + compileTabLogic.setLanguage(value) + compileIfAutoCompileOn() + setState(prevState => { + return { ...prevState, language: value } + }) + } + + const handleEvmVersionChange = (value) => { + let v = value + if (v === 'default') { + v = null + } + compileTabLogic.setEvmVersion(v) + compileIfAutoCompileOn() + setState(prevState => { + return { ...prevState, evmVersion: value } + }) + } + + return ( +
+
+
+
+ + +
+
+ + +
+
+ + +
+
+ + +
+
+

Compiler Configuration

+
+ + +
+
+
+ + + +
+
+
+ + +
+
+ +
+
+
+ ) +} + +export default CompilerContainer diff --git a/libs/remix-ui/solidity-compiler/src/lib/contract-selection.tsx b/libs/remix-ui/solidity-compiler/src/lib/contract-selection.tsx new file mode 100644 index 0000000000..ee5011bd36 --- /dev/null +++ b/libs/remix-ui/solidity-compiler/src/lib/contract-selection.tsx @@ -0,0 +1,159 @@ +import React, { useState, useEffect } from 'react' // eslint-disable-line +import { ContractSelectionProps } from './types' +import { PublishToStorage } from '@remix-ui/publish-to-storage' + +import './css/style.css' + +export const ContractSelection = (props: ContractSelectionProps) => { + const { contractMap, fileManager, fileProvider } = props + const [state, setState] = useState({ + contractList: null, + selectedContract: '' + }) + + useEffect(() => { + const contractList = contractMap ? Object.keys(contractMap).map((key) => ({ + name: key, + file: getFileName(contractMap[key].file) + })) : [] + + setState(prevState => { + return { ...prevState, contractList } + }) + }, []) + // Return the file name of a path: ex "browser/ballot.sol" -> "ballot.sol" + const getFileName = (path) => { + const part = path.split('/') + + return part[part.length - 1] + } + + const selectContract = (contractName: string) => { + setState(prevState => { + return { ...prevState, selectedContract: contractName } + }) + } + + const handlePublishToStorage = (type) => { + + } + + const copyABI = () => { + copyContractProperty('abi') + } + + const copyContractProperty = (property) => { + let content = getContractProperty(property) + // if (!content) { + // addTooltip('No content available for ' + property) + // return + // } + + // try { + // if (typeof content !== 'string') { + // content = JSON.stringify(content, null, '\t') + // } + // } catch (e) {} + + // copy(content) + // addTooltip('Copied value to clipboard') + } + + const getContractProperty = (property) => { + // if (!this.selectedContract) throw new Error('No contract compiled yet') + // const contractProperties = this.data.contractsDetails[this.selectedContract] + // return contractProperties[property] || null + } + + const details = () => { + const help = { + Assembly: 'Assembly opcodes describing the contract including corresponding solidity source code', + Opcodes: 'Assembly opcodes describing the contract', + 'Runtime Bytecode': 'Bytecode storing the state and being executed during normal contract call', + bytecode: 'Bytecode being executed during contract creation', + functionHashes: 'List of declared function and their corresponding hash', + gasEstimates: 'Gas estimation for each function call', + metadata: 'Contains all informations related to the compilation', + metadataHash: 'Hash representing all metadata information', + abi: 'ABI: describing all the functions (input/output params, scope, ...)', + name: 'Name of the compiled contract', + swarmLocation: 'Swarm url where all metadata information can be found (contract needs to be published first)', + web3Deploy: 'Copy/paste this code to any JavaScript/Web3 console to deploy this contract' + } + if (!this.selectedContract) throw new Error('No contract compiled yet') + const contractProperties = this.data.contractsDetails[this.selectedContract] + const log = yo`
` + Object.keys(contractProperties).map(propertyName => { + const copyDetails = yo`${copyToClipboard(() => contractProperties[propertyName])}` + const questionMark = yo`` + log.appendChild(yo`
+
${propertyName} ${copyDetails} ${questionMark}
+ ${this.insertValue(contractProperties, propertyName)} +
`) + }) + modalDialog(this.selectedContract, log, { label: '' }, { label: 'Close' }) + } + + const copyBytecode = () => { + copyContractProperty('bytecode') + } + + return ( + // define swarm logo + <> + { state.contractList.length ? +
+ {/* Select Compiler Version */} +
+ + +
+
+ + + + {/* Copy to Clipboard */} +
+
+
+ + +
+
+
+
+
:
+ No Contract Compiled Yet +
+ } + + + ) + + // if (contractList.length) { + // this.selectedContract = selectEl.value + // } else { + // delete this.selectedContract + // } + // return result + + // return () +} + +export default ContractSelection diff --git a/libs/remix-ui/solidity-compiler/src/lib/css/style.css b/libs/remix-ui/solidity-compiler/src/lib/css/style.css new file mode 100644 index 0000000000..3846ca0f0f --- /dev/null +++ b/libs/remix-ui/solidity-compiler/src/lib/css/style.css @@ -0,0 +1,234 @@ +.remixui_title { + font-size: 1.1em; + font-weight: bold; + margin-bottom: 1em; +} +.remixui_panicError { + color: red; + font-size: 20px; +} +.remixui_crow { + display: flex; + overflow: auto; + clear: both; + padding: .2em; +} +.remixui_checkboxText { + font-weight: normal; +} +.remixui_crow label { + cursor:pointer; +} +.remixui_crowNoFlex { + overflow: auto; + clear: both; +} +.remixui_info { + padding: 10px; + word-break: break-word; +} +.remixui_contract { + display: block; + margin: 3% 0; +} +.remixui_nightlyBuilds { + display: flex; + flex-direction: row; + align-items: center; +} +.remixui_autocompileContainer { + display: flex; + align-items: center; +} +.remixui_runs { + width: 40%; +} +.remixui_hideWarningsContainer { + display: flex; + align-items: center; +} +.remixui_autocompile {} +.remixui_autocompileTitle { + font-weight: bold; + margin: 1% 0; +} +.remixui_autocompileText { + margin: 1% 0; + font-size: 12px; + overflow: hidden; + word-break: normal; + line-height: initial; +} +.remixui_warnCompilationSlow { + margin-left: 1%; +} +.remixui_compilerConfig { + display: flex; + align-items: center; +} +.remixui_compilerConfig label { + margin: 0; +} +.remixui_compilerSection { + padding: 12px 24px 16px; +} +.remixui_compilerLabel { + margin-bottom: 2px; + font-size: 11px; + line-height: 12px; + text-transform: uppercase; +} +.remixui_copyButton { + padding: 6px; + font-weight: bold; + font-size: 11px; + line-height: 15px; +} +.remixui_name { + display: flex; +} +.remixui_size { + display: flex; +} +.remixui_checkboxes { + display: flex; + width: 100%; + justify-content: space-between; + flex-wrap: wrap; +} +.remixui_compileButton { + width: 100%; + margin: 15px 0 10px 0; + font-size: 12px; +} +.remixui_container { + margin: 0; + margin-bottom: 2%; +} +.remixui_optimizeContainer { + display: flex; +} +.remixui_noContractAlert { + display: flex; + justify-content: center; + align-items: center; +} +.remixui_contractHelperButtons { + margin-top: 6px; + display: flex; + align-items: center; + justify-content: space-between; + float: right; +} +.remixui_copyToClipboard { + font-size: 1rem; +} +.remixui_copyIcon { + margin-right: 5px; +} +.remixui_log { + display: flex; + flex-direction: column; + margin-bottom: 5%; + overflow: visible; +} +.remixui_key { + margin-right: 5px; + text-transform: uppercase; + width: 100%; +} +.remixui_value { + display: flex; + width: 100%; + margin-top: 1.5%; +} +.remixui_questionMark { + margin-left: 2%; + cursor: pointer; +} +.remixui_questionMark:hover { +} +.remixui_detailsJSON { + padding: 8px 0; + border: none; +} +.remixui_icon { + margin-right: 0.3em; +} +.remixui_errorBlobs { + padding-left: 5px; + padding-right: 5px; + word-break: break-word; +} +.remixui_storageLogo { + width: 20px; + height: 20px; +} +.remixui_spinningIcon { + display: inline-block; + position: relative; + animation: spin 2s infinite linear; + -moz-animation: spin 2s infinite linear; + -o-animation: spin 2s infinite linear; + -webkit-animation: spin 2s infinite linear; +} +@keyframes spin { + 0% { transform: rotate(0deg); } + 100% { transform: rotate(360deg); } +} +@-webkit-keyframes spin { + 0% { transform: rotate(0deg); } + 100% { transform: rotate(360deg); } +} +@-moz-keyframes spin { + 0% { transform: rotate(0deg); } + 100% { transform: rotate(360deg); } +} +@-o-keyframes spin { + 0% { transform: rotate(0deg); } + 100% { transform: rotate(360deg); } +} +@-ms-keyframes spin { + 0% { transform: rotate(0deg); } + 100% { transform: rotate(360deg); } +} + +.remixui_bouncingIcon { + display: inline-block; + position: relative; + -moz-animation: bounce 2s infinite linear; + -o-animation: bounce 2s infinite linear; + -webkit-animation: bounce 2s infinite linear; + animation: bounce 2s infinite linear; +} + +@-webkit-keyframes bounce { + 0% { top: 0; } + 50% { top: -0.2em; } + 70% { top: -0.3em; } + 100% { top: 0; } +} +@-moz-keyframes bounce { + 0% { top: 0; } + 50% { top: -0.2em; } + 70% { top: -0.3em; } + 100% { top: 0; } +} +@-o-keyframes bounce { + 0% { top: 0; } + 50% { top: -0.2em; } + 70% { top: -0.3em; } + 100% { top: 0; } +} +@-ms-keyframes bounce { + 0% { top: 0; } + 50% { top: -0.2em; } + 70% { top: -0.3em; } + 100% { top: 0; } +} +@keyframes bounce { + 0% { top: 0; } + 50% { top: -0.2em; } + 70% { top: -0.3em; } + 100% { top: 0; } +} diff --git a/libs/remix-ui/solidity-compiler/src/lib/solidity-compiler.css b/libs/remix-ui/solidity-compiler/src/lib/solidity-compiler.css new file mode 100644 index 0000000000..e69de29bb2 diff --git a/libs/remix-ui/solidity-compiler/src/lib/solidity-compiler.tsx b/libs/remix-ui/solidity-compiler/src/lib/solidity-compiler.tsx new file mode 100644 index 0000000000..5ddb63fcb3 --- /dev/null +++ b/libs/remix-ui/solidity-compiler/src/lib/solidity-compiler.tsx @@ -0,0 +1,97 @@ +import React, { useState, useEffect } from 'react' // eslint-disable-line +import { SolidityCompilerProps } from './types' +import { CompilerContainer } from './compiler-container' // eslint-disable-line +import CompileTabLogic from './compileTabLogic' +import { Toaster } from '@remix-ui/toaster' // eslint-disable-line +import { ModalDialog } from '@remix-ui/modal-dialog' // eslint-disable-line + +import './css/style.css' + +export const SolidityCompiler = (props: SolidityCompilerProps) => { + const { editor, config, fileProvider, fileManager, contentImport, queryParams, plugin } = props + const [state, setState] = useState({ + contractsDetails: {}, + eventHandlers: {}, + loading: false, + compileTabLogic: null, + compiler: null, + toasterMsg: '', + modal: { + hide: true, + title: '', + message: null, + okLabel: '', + okFn: () => {}, + cancelLabel: '', + cancelFn: () => {}, + handleHide: null + } + }) + + useEffect(() => { + const miscApi = { clearAnnotations } + const compileTabLogic = new CompileTabLogic(queryParams, fileManager, editor, config, fileProvider, contentImport, miscApi) + const compiler = compileTabLogic.compiler + + compileTabLogic.init() + setState(prevState => { + return { ...prevState, compileTabLogic, compiler } + }) + }, []) + + const toast = (message: string) => { + setState(prevState => { + return { ...prevState, toasterMsg: message } + }) + } + + const clearAnnotations = () => { + plugin.call('editor', 'clearAnnotations') + } + + const modal = async (title: string, message: string | JSX.Element, okLabel: string, okFn: () => void, cancelLabel?: string, cancelFn?: () => void) => { + await setState(prevState => { + return { + ...prevState, + modal: { + ...prevState.modal, + message, + title, + okLabel, + okFn, + cancelLabel, + cancelFn + } + } + }) + } + + const handleHideModal = () => { + setState(prevState => { + return { ...prevState, modal: { ...state.modal, hide: true, message: null } } + }) + } + // this.onActivationInternal() + return ( + <> +
+ + {/* ${this._view.contractSelection} */} +
+
+ + + { (typeof state.modal.message !== 'string') && state.modal.message } + + + ) +} + +export default SolidityCompiler diff --git a/libs/remix-ui/solidity-compiler/src/lib/types/index.ts b/libs/remix-ui/solidity-compiler/src/lib/types/index.ts new file mode 100644 index 0000000000..5d080fdccb --- /dev/null +++ b/libs/remix-ui/solidity-compiler/src/lib/types/index.ts @@ -0,0 +1,24 @@ + +export interface SolidityCompilerProps { + editor: any, + config: any, + fileProvider: any, + fileManager: any, + contentImport: any, + plugin: any, + queryParams: any +} + +export interface CompilerContainerProps { + editor: any, + config: any, + queryParams: any, + compileTabLogic: any, + tooltip: (message: string) => void, + modal: (title: string, message: string | JSX.Element, okLabel: string, okFn: () => void, cancelLabel?: string, cancelFn?: () => void) => void +} +export interface ContractSelectionProps { + contractMap: { + file: string + } +} diff --git a/libs/remix-ui/solidity-compiler/tsconfig.json b/libs/remix-ui/solidity-compiler/tsconfig.json new file mode 100644 index 0000000000..6b65264565 --- /dev/null +++ b/libs/remix-ui/solidity-compiler/tsconfig.json @@ -0,0 +1,16 @@ +{ + "extends": "../../../tsconfig.json", + "compilerOptions": { + "jsx": "react", + "allowJs": true, + "esModuleInterop": true, + "allowSyntheticDefaultImports": true + }, + "files": [], + "include": [], + "references": [ + { + "path": "./tsconfig.lib.json" + } + ] +} diff --git a/libs/remix-ui/solidity-compiler/tsconfig.lib.json b/libs/remix-ui/solidity-compiler/tsconfig.lib.json new file mode 100644 index 0000000000..b560bc4dec --- /dev/null +++ b/libs/remix-ui/solidity-compiler/tsconfig.lib.json @@ -0,0 +1,13 @@ +{ + "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"] +} diff --git a/nx.json b/nx.json index d78b387cbd..fe85503935 100644 --- a/nx.json +++ b/nx.json @@ -107,6 +107,12 @@ }, "remix-core-plugin": { "tags": [] + }, + "remix-ui-solidity-compiler": { + "tags": [] + }, + "remix-ui-publish-to-storage": { + "tags": [] } } } diff --git a/tsconfig.json b/tsconfig.json index 275dcae946..272024fb8c 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -42,9 +42,9 @@ "@remix-ui/static-analyser": ["libs/remix-ui/static-analyser/src/index.ts"], "@remix-ui/checkbox": ["libs/remix-ui/checkbox/src/index.ts"], "@remix-ui/settings": ["libs/remix-ui/settings/src/index.ts"], - "@remix-project/core-plugin": [ - "libs/remix-core-plugin/src/index.ts" - ] + "@remix-project/core-plugin": ["libs/remix-core-plugin/src/index.ts"], + "@remix-ui/solidity-compiler": ["libs/remix-ui/solidity-compiler/src/index.ts"], + "@remix-project/publish-to-storage": ["libs/remix-ui/publish-to-storage/src/index.ts"] } }, "exclude": ["node_modules", "tmp"] diff --git a/workspace.json b/workspace.json index 6f3f42646f..256cf52172 100644 --- a/workspace.json +++ b/workspace.json @@ -808,6 +808,44 @@ } } }, + "remix-ui-solidity-compiler": { + "root": "libs/remix-ui/solidity-compiler", + "sourceRoot": "libs/remix-ui/solidity-compiler/src", + "projectType": "library", + "schematics": {}, + "architect": { + "lint": { + "builder": "@nrwl/linter:lint", + "options": { + "linter": "eslint", + "tsConfig": ["libs/remix-ui/solidity-compiler/tsconfig.lib.json"], + "exclude": [ + "**/node_modules/**", + "!libs/remix-ui/solidity-compiler/**/*" + ] + } + } + } + }, + "remix-ui-publish-to-storage": { + "root": "libs/remix-ui/publish-to-storage", + "sourceRoot": "libs/remix-ui/publish-to-storage/src", + "projectType": "library", + "schematics": {}, + "architect": { + "lint": { + "builder": "@nrwl/linter:lint", + "options": { + "linter": "eslint", + "tsConfig": ["libs/remix-ui/publish-to-storage/tsconfig.lib.json"], + "exclude": [ + "**/node_modules/**", + "!libs/remix-ui/publish-to-storage/**/*" + ] + } + } + } + }, "cli": { "defaultCollection": "@nrwl/react" }, From 071f0bdf65b7ef73b947939019308a5d6dc7d4b3 Mon Sep 17 00:00:00 2001 From: ioedeveloper Date: Tue, 22 Jun 2021 11:51:53 +0100 Subject: [PATCH 02/32] Fixed uncaught error when clicking solidity icon from homepage --- apps/remix-ide/src/app/tabs/compile-tab.js | 48 ++-- .../src/app/tabs/compileTab/compileTab.js | 234 +++++++++--------- libs/remix-ui/publish-to-storage/src/index.ts | 2 +- libs/remix-ui/solidity-compiler/src/index.ts | 2 +- .../src/lib/actions/compiler.ts | 40 +++ .../src/lib/compileTabLogic.ts | 54 +++- .../src/lib/compiler-container.tsx | 40 +-- .../src/lib/contract-selection.tsx | 2 +- .../src/lib/reducers/compiler.ts | 52 ++++ .../src/lib/solidity-compiler.tsx | 18 +- .../solidity-compiler/src/lib/types/index.ts | 3 +- tsconfig.json | 10 +- 12 files changed, 313 insertions(+), 192 deletions(-) create mode 100644 libs/remix-ui/solidity-compiler/src/lib/actions/compiler.ts create mode 100644 libs/remix-ui/solidity-compiler/src/lib/reducers/compiler.ts diff --git a/apps/remix-ide/src/app/tabs/compile-tab.js b/apps/remix-ide/src/app/tabs/compile-tab.js index e24d18a949..b9c50cc654 100644 --- a/apps/remix-ide/src/app/tabs/compile-tab.js +++ b/apps/remix-ide/src/app/tabs/compile-tab.js @@ -1,4 +1,7 @@ /* global */ +import React from 'react' // eslint-disable-line +import ReactDOM from 'react-dom' +import { SolidityCompiler } from '@remix-ui/solidity-compiler' // eslint-disable-line import { ViewPlugin } from '@remixproject/engine-web' import * as packageJson from '../../../../../package.json' import publishToStorage from '../../publishToStorage' @@ -19,9 +22,7 @@ const Renderer = require('../ui/renderer') const globalRegistry = require('../../global/registry') var css = require('./styles/compile-tab-styles') - -const CompileTabLogic = require('./compileTab/compileTab.js') -const CompilerContainer = require('./compileTab/compilerContainer.js') +// const CompilerContainer = require('./compileTab/compilerContainer.js') const profile = { name: 'solidity', @@ -73,18 +74,11 @@ class CompileTab extends ViewPlugin { this.fileProvider, this.contentImport ) - } - - onActivationInternal () { this.compiler = this.compileTabLogic.compiler this.compileTabLogic.init() - this.compilerContainer = new CompilerContainer( - this.compileTabLogic, - this.editor, - this.config, - this.queryParams - ) + this.el = document.createElement('div') + this.el.setAttribute('id', 'compileTabView') } resetResults () { @@ -490,19 +484,23 @@ class CompileTab extends ViewPlugin { } render () { - if (this._view.el) return this._view.el - this.onActivationInternal() - this._view.errorContainer = yo`
` - this._view.contractSelection = this.contractSelection() - this._view.compilerContainer = this.compilerContainer.render() - this.compilerContainer.activate() - this._view.el = yo` -
- ${this._view.compilerContainer} - ${this._view.contractSelection} - ${this._view.errorContainer} -
` - return this._view.el + this.renderComponent() + return this.el + } + + renderComponent () { + ReactDOM.render( + + , this.el) } onActivation () { diff --git a/apps/remix-ide/src/app/tabs/compileTab/compileTab.js b/apps/remix-ide/src/app/tabs/compileTab/compileTab.js index b357f8a8aa..427b625f25 100644 --- a/apps/remix-ide/src/app/tabs/compileTab/compileTab.js +++ b/apps/remix-ide/src/app/tabs/compileTab/compileTab.js @@ -1,130 +1,130 @@ -import * as packageJson from '../../../../../../package.json' -import { Plugin } from '@remixproject/engine' -const EventEmitter = require('events') -var Compiler = require('@remix-project/remix-solidity').Compiler +// import * as packageJson from '../../../../../../package.json' +// import { Plugin } from '@remixproject/engine' +// const EventEmitter = require('events') +// var Compiler = require('@remix-project/remix-solidity').Compiler -const profile = { - name: 'solidity-logic', - displayName: 'Solidity compiler logic', - description: 'Compile solidity contracts - Logic', - version: packageJson.version -} +// const profile = { +// name: 'solidity-logic', +// displayName: 'Solidity compiler logic', +// description: 'Compile solidity contracts - Logic', +// version: packageJson.version +// } -class CompileTab extends Plugin { - constructor (queryParams, fileManager, editor, config, fileProvider, contentImport) { - super(profile) - this.event = new EventEmitter() - this.queryParams = queryParams - this.compilerImport = contentImport - this.compiler = new Compiler((url, cb) => this.compilerImport.resolveAndSave(url).then((result) => cb(null, result)).catch((error) => cb(error.message))) - this.fileManager = fileManager - this.editor = editor - this.config = config - this.fileProvider = fileProvider - } +// class CompileTab extends Plugin { +// constructor (queryParams, fileManager, editor, config, fileProvider, contentImport) { +// super(profile) +// this.event = new EventEmitter() +// this.queryParams = queryParams +// this.compilerImport = contentImport +// this.compiler = new Compiler((url, cb) => this.compilerImport.resolveAndSave(url).then((result) => cb(null, result)).catch((error) => cb(error.message))) +// this.fileManager = fileManager +// this.editor = editor +// this.config = config +// this.fileProvider = fileProvider +// } - init () { - this.optimize = this.queryParams.get().optimize - this.optimize = this.optimize === 'true' - this.queryParams.update({ optimize: this.optimize }) - this.compiler.set('optimize', this.optimize) +// init () { +// this.optimize = this.queryParams.get().optimize +// this.optimize = this.optimize === 'true' +// this.queryParams.update({ optimize: this.optimize }) +// this.compiler.set('optimize', this.optimize) - this.runs = this.queryParams.get().runs - this.runs = this.runs || 200 - this.queryParams.update({ runs: this.runs }) - this.compiler.set('runs', this.runs) +// this.runs = this.queryParams.get().runs +// this.runs = this.runs || 200 +// this.queryParams.update({ runs: this.runs }) +// this.compiler.set('runs', this.runs) - this.evmVersion = this.queryParams.get().evmVersion - if (this.evmVersion === 'undefined' || this.evmVersion === 'null' || !this.evmVersion) { - this.evmVersion = null - } - this.queryParams.update({ evmVersion: this.evmVersion }) - this.compiler.set('evmVersion', this.evmVersion) - } +// this.evmVersion = this.queryParams.get().evmVersion +// if (this.evmVersion === 'undefined' || this.evmVersion === 'null' || !this.evmVersion) { +// this.evmVersion = null +// } +// this.queryParams.update({ evmVersion: this.evmVersion }) +// this.compiler.set('evmVersion', this.evmVersion) +// } - setOptimize (newOptimizeValue) { - this.optimize = newOptimizeValue - this.queryParams.update({ optimize: this.optimize }) - this.compiler.set('optimize', this.optimize) - } +// setOptimize (newOptimizeValue) { +// this.optimize = newOptimizeValue +// this.queryParams.update({ optimize: this.optimize }) +// this.compiler.set('optimize', this.optimize) +// } - setRuns (runs) { - this.runs = runs - this.queryParams.update({ runs: this.runs }) - this.compiler.set('runs', this.runs) - } +// setRuns (runs) { +// this.runs = runs +// this.queryParams.update({ runs: this.runs }) +// this.compiler.set('runs', this.runs) +// } - setEvmVersion (newEvmVersion) { - this.evmVersion = newEvmVersion - this.queryParams.update({ evmVersion: this.evmVersion }) - this.compiler.set('evmVersion', this.evmVersion) - } +// setEvmVersion (newEvmVersion) { +// this.evmVersion = newEvmVersion +// this.queryParams.update({ evmVersion: this.evmVersion }) +// this.compiler.set('evmVersion', this.evmVersion) +// } - /** - * Set the compiler to using Solidity or Yul (default to Solidity) - * @params lang {'Solidity' | 'Yul'} ... - */ - setLanguage (lang) { - this.compiler.set('language', lang) - } +// /** +// * Set the compiler to using Solidity or Yul (default to Solidity) +// * @params lang {'Solidity' | 'Yul'} ... +// */ +// setLanguage (lang) { +// this.compiler.set('language', lang) +// } - /** - * Compile a specific file of the file manager - * @param {string} target the path to the file to compile - */ - compileFile (target) { - if (!target) throw new Error('No target provided for compiliation') - const provider = this.fileManager.fileProviderOf(target) - if (!provider) throw new Error(`cannot compile ${target}. Does not belong to any explorer`) - return new Promise((resolve, reject) => { - provider.get(target, (error, content) => { - if (error) return reject(error) - const sources = { [target]: { content } } - this.event.emit('startingCompilation') - // setTimeout fix the animation on chrome... (animation triggered by 'staringCompilation') - setTimeout(() => { this.compiler.compile(sources, target); resolve() }, 100) - }) - }) - } +// /** +// * Compile a specific file of the file manager +// * @param {string} target the path to the file to compile +// */ +// compileFile (target) { +// if (!target) throw new Error('No target provided for compiliation') +// const provider = this.fileManager.fileProviderOf(target) +// if (!provider) throw new Error(`cannot compile ${target}. Does not belong to any explorer`) +// return new Promise((resolve, reject) => { +// provider.get(target, (error, content) => { +// if (error) return reject(error) +// const sources = { [target]: { content } } +// this.event.emit('startingCompilation') +// // setTimeout fix the animation on chrome... (animation triggered by 'staringCompilation') +// setTimeout(() => { this.compiler.compile(sources, target); resolve() }, 100) +// }) +// }) +// } - async isHardhatProject () { - if (this.fileManager.mode === 'localhost') { - return await this.fileManager.exists('hardhat.config.js') - } else return false - } +// async isHardhatProject () { +// if (this.fileManager.mode === 'localhost') { +// return await this.fileManager.exists('hardhat.config.js') +// } else return false +// } - runCompiler (hhCompilation) { - try { - if (this.fileManager.mode === 'localhost' && hhCompilation) { - const { currentVersion, optimize, runs } = this.compiler.state - if (currentVersion) { - const fileContent = `module.exports = { - solidity: '${currentVersion.substring(0, currentVersion.indexOf('+commit'))}', - settings: { - optimizer: { - enabled: ${optimize}, - runs: ${runs} - } - } - } - ` - const configFilePath = 'remix-compiler.config.js' - this.fileManager.setFileContent(configFilePath, fileContent) - this.call('hardhat', 'compile', configFilePath).then((result) => { - this.call('terminal', 'log', { type: 'info', value: result }) - }).catch((error) => { - this.call('terminal', 'log', { type: 'error', value: error }) - }) - } - } - this.fileManager.saveCurrentFile() - this.event.emit('removeAnnotations') - var currentFile = this.config.get('currentFile') - return this.compileFile(currentFile) - } catch (err) { - console.error(err) - } - } -} +// runCompiler (hhCompilation) { +// try { +// if (this.fileManager.mode === 'localhost' && hhCompilation) { +// const { currentVersion, optimize, runs } = this.compiler.state +// if (currentVersion) { +// const fileContent = `module.exports = { +// solidity: '${currentVersion.substring(0, currentVersion.indexOf('+commit'))}', +// settings: { +// optimizer: { +// enabled: ${optimize}, +// runs: ${runs} +// } +// } +// } +// ` +// const configFilePath = 'remix-compiler.config.js' +// this.fileManager.setFileContent(configFilePath, fileContent) +// this.call('hardhat', 'compile', configFilePath).then((result) => { +// this.call('terminal', 'log', { type: 'info', value: result }) +// }).catch((error) => { +// this.call('terminal', 'log', { type: 'error', value: error }) +// }) +// } +// } +// this.fileManager.saveCurrentFile() +// this.event.emit('removeAnnotations') +// var currentFile = this.config.get('currentFile') +// return this.compileFile(currentFile) +// } catch (err) { +// console.error(err) +// } +// } +// } -module.exports = CompileTab +// module.exports = CompileTab diff --git a/libs/remix-ui/publish-to-storage/src/index.ts b/libs/remix-ui/publish-to-storage/src/index.ts index 00fccbcf8f..79e6f4dac6 100644 --- a/libs/remix-ui/publish-to-storage/src/index.ts +++ b/libs/remix-ui/publish-to-storage/src/index.ts @@ -1 +1 @@ -export * from './lib/remix-ui-publish-to-storage'; +export * from './lib/publish-to-storage' diff --git a/libs/remix-ui/solidity-compiler/src/index.ts b/libs/remix-ui/solidity-compiler/src/index.ts index 6ebd19dc79..3634357b17 100644 --- a/libs/remix-ui/solidity-compiler/src/index.ts +++ b/libs/remix-ui/solidity-compiler/src/index.ts @@ -1 +1 @@ -export * from './lib/remix-ui-solidity-compiler'; +export * from './lib/solidity-compiler' diff --git a/libs/remix-ui/solidity-compiler/src/lib/actions/compiler.ts b/libs/remix-ui/solidity-compiler/src/lib/actions/compiler.ts new file mode 100644 index 0000000000..668699b2f7 --- /dev/null +++ b/libs/remix-ui/solidity-compiler/src/lib/actions/compiler.ts @@ -0,0 +1,40 @@ +import React from 'react' + +const queuedEvents = [] +const pendingEvents = {} +let provider = null +let plugin = null +let dispatch: React.Dispatch = null + +export const fetchCompilerError = (error: any) => { + return { + type: 'FETCH_COMPILER_ERROR', + payload: error + } +} + +export const fetchCompilerRequest = (promise: Promise) => { + return { + type: 'FETCH_COMPILER_REQUEST', + payload: promise + } +} + +export const fetchCompilerSuccess = (compiler) => { + return { + type: 'FETCH_COMPILER_SUCCESS', + payload: compiler + } +} + +export const fetchCompiler = (provider, path: string) => (dispatch: React.Dispatch) => { + const promise = fetchDirectoryContent(provider, path) + + dispatch(fetchDirectoryRequest(promise)) + promise.then((files) => { + dispatch(fetchDirectorySuccess(path, files)) + }).catch((error) => { + dispatch(fetchDirectoryError({ error })) + }) + return promise +} diff --git a/libs/remix-ui/solidity-compiler/src/lib/compileTabLogic.ts b/libs/remix-ui/solidity-compiler/src/lib/compileTabLogic.ts index 8fd88f1f49..63c3c563c9 100644 --- a/libs/remix-ui/solidity-compiler/src/lib/compileTabLogic.ts +++ b/libs/remix-ui/solidity-compiler/src/lib/compileTabLogic.ts @@ -1,14 +1,25 @@ -var Compiler = require('@remix-project/remix-solidity').Compiler +import { Plugin } from '@remixproject/engine' -export default class CompileTab { +const packageJson = require('../../../../../package.json') +const Compiler = require('@remix-project/remix-solidity').Compiler +const EventEmitter = require('events') +const profile = { + name: 'solidity-logic', + displayName: 'Solidity compiler logic', + description: 'Compile solidity contracts - Logic', + version: packageJson.version +} +export default class CompileTab extends Plugin { public compiler public optimize public runs: number public evmVersion: string public compilerImport + public event - constructor (public queryParams, public fileManager, public editor, public config, public fileProvider, public contentImport, public miscApi) { - // this.event = new EventEmitter() + constructor (public queryParams, public fileManager, public editor, public config, public fileProvider, public contentImport) { + super(profile) + this.event = new EventEmitter() this.compiler = new Compiler((url, cb) => this.compilerImport.resolveAndSave(url).then((result) => cb(null, result)).catch((error) => cb(error.message))) } @@ -64,23 +75,50 @@ export default class CompileTab { compileFile (target) { if (!target) throw new Error('No target provided for compiliation') const provider = this.fileManager.fileProviderOf(target) - if (!provider) throw new Error(`cannot compile ${target}. Does not belong to any explorer`) return new Promise((resolve, reject) => { provider.get(target, (error, content) => { if (error) return reject(error) const sources = { [target]: { content } } - // this.event.emit('startingCompilation') + this.event.emit('startingCompilation') // setTimeout fix the animation on chrome... (animation triggered by 'staringCompilation') setTimeout(() => { this.compiler.compile(sources, target); resolve(true) }, 100) }) }) } - runCompiler () { + async isHardhatProject () { + if (this.fileManager.mode === 'localhost') { + return await this.fileManager.exists('hardhat.config.js') + } else return false + } + + runCompiler (hhCompilation) { try { + if (this.fileManager.mode === 'localhost' && hhCompilation) { + const { currentVersion, optimize, runs } = this.compiler.state + if (currentVersion) { + const fileContent = `module.exports = { + solidity: '${currentVersion.substring(0, currentVersion.indexOf('+commit'))}', + settings: { + optimizer: { + enabled: ${optimize}, + runs: ${runs} + } + } + } + ` + const configFilePath = 'remix-compiler.config.js' + this.fileManager.setFileContent(configFilePath, fileContent) + this.call('hardhat', 'compile', configFilePath).then((result) => { + this.call('terminal', 'log', { type: 'info', value: result }) + }).catch((error) => { + this.call('terminal', 'log', { type: 'error', value: error }) + }) + } + } this.fileManager.saveCurrentFile() - this.miscApi.clearAnnotations() + this.event.emit('removeAnnotations') var currentFile = this.config.get('currentFile') return this.compileFile(currentFile) } catch (err) { diff --git a/libs/remix-ui/solidity-compiler/src/lib/compiler-container.tsx b/libs/remix-ui/solidity-compiler/src/lib/compiler-container.tsx index fea7de22e8..1d508e6608 100644 --- a/libs/remix-ui/solidity-compiler/src/lib/compiler-container.tsx +++ b/libs/remix-ui/solidity-compiler/src/lib/compiler-container.tsx @@ -16,7 +16,7 @@ export const CompilerContainer = (props: CompilerContainerProps) => { timeout: 300, allversions: [], selectedVersion: null, - defaultVersion: 'soljson-v0.7.4+commit.3f05b770.js', // this default version is defined: in makeMockCompiler (for browser test) + defaultVersion: 'soljson-v0.8.4+commit.c7e474f2.js', // this default version is defined: in makeMockCompiler (for browser test) selectedLanguage: '', runs: '', compiledFileName: '', @@ -38,7 +38,7 @@ export const CompilerContainer = (props: CompilerContainerProps) => { setState(prevState => { return { ...prevState, selectedVersion } }) - // if (this._view.versionSelector) this._updateVersionSelector() + _updateVersionSelector() } }) }, []) @@ -48,7 +48,13 @@ export const CompilerContainer = (props: CompilerContainerProps) => { compileTabLogic.compiler.event.register('compilerLoaded', compilerLoaded) setState(prevState => { - return { ...prevState, hideWarnings: config.get('hideWarnings'), autoCompile: config.get('autoCompile'), optimise: config.get('optimise') } + return { + ...prevState, + hideWarnings: config.get('hideWarnings') || false, + autoCompile: config.get('autoCompile') || false, + optimise: config.get('optimise') || false, + includeNightlies: config.get('includeNightlies') || false + } }) } }, [compileTabLogic]) @@ -286,7 +292,6 @@ export const CompilerContainer = (props: CompilerContainerProps) => { if (!location.endsWith('/')) location += '/' url = location + 'soljson.js' } else { - console.log('selectedVersion: ', selectedVersion) if (selectedVersion.indexOf('soljson') !== 0 || helper.checkSpecialChars(selectedVersion)) { return console.log('loading ' + selectedVersion + ' not allowed') } @@ -406,9 +411,12 @@ export const CompilerContainer = (props: CompilerContainerProps) => { }) } - const handleNightliesChange = () => { + const handleNightliesChange = (e) => { + const checked = e.target.checked + + config.set('includeNightlies', checked) setState(prevState => { - return { ...prevState, includeNightlies: !prevState.includeNightlies } + return { ...prevState, includeNightlies: checked } }) } @@ -441,19 +449,19 @@ export const CompilerContainer = (props: CompilerContainerProps) => { Compiler - handleLoadVersion(e.target.value) } className="custom-select" id="versionSelector" disabled={state.allversions.length <= 0}> + { state.allversions.length <= 0 && } { state.allversions.length <= 0 && } { state.allversions.map((build, i) => { return _shouldBeAdded(build.longVersion) - ? + ? : null }) }
- +
@@ -480,28 +488,28 @@ export const CompilerContainer = (props: CompilerContainerProps) => {

Compiler Configuration

- +
- + {/* */} - + /> */}
- + {/* */}
diff --git a/libs/remix-ui/solidity-compiler/src/lib/contract-selection.tsx b/libs/remix-ui/solidity-compiler/src/lib/contract-selection.tsx index ee5011bd36..cae8d6bee2 100644 --- a/libs/remix-ui/solidity-compiler/src/lib/contract-selection.tsx +++ b/libs/remix-ui/solidity-compiler/src/lib/contract-selection.tsx @@ -5,7 +5,7 @@ import { PublishToStorage } from '@remix-ui/publish-to-storage' import './css/style.css' export const ContractSelection = (props: ContractSelectionProps) => { - const { contractMap, fileManager, fileProvider } = props + const { contractMap } = props const [state, setState] = useState({ contractList: null, selectedContract: '' diff --git a/libs/remix-ui/solidity-compiler/src/lib/reducers/compiler.ts b/libs/remix-ui/solidity-compiler/src/lib/reducers/compiler.ts new file mode 100644 index 0000000000..2fd8b933ff --- /dev/null +++ b/libs/remix-ui/solidity-compiler/src/lib/reducers/compiler.ts @@ -0,0 +1,52 @@ +interface Action { + type: string; + payload: Record; +} + +export const compilerInitialState = { + compiler: { + compiler: null, + isRequesting: false, + isSuccessful: false, + error: null + } +} + +export const compilerReducer = (state = compilerInitialState, action: Action) => { + switch (action.type) { + case 'FETCH_COMPILER_REQUEST': { + return { + ...state, + compiler: action.payload, + isRequesting: true, + isSuccessful: false, + error: null + } + } + case 'FETCH_COMPILER_SUCCESS': { + return { + ...state, + provider: { + ...state, + compiler: action.payload, + isRequesting: false, + isSuccessful: true, + error: null + } + } + } + case 'FETCH_COMPILER_ERROR': { + return { + ...state, + provider: { + ...state, + isRequesting: false, + isSuccessful: false, + error: action.payload + } + } + } + default: + throw new Error() + } +} \ No newline at end of file diff --git a/libs/remix-ui/solidity-compiler/src/lib/solidity-compiler.tsx b/libs/remix-ui/solidity-compiler/src/lib/solidity-compiler.tsx index 5ddb63fcb3..b29078280d 100644 --- a/libs/remix-ui/solidity-compiler/src/lib/solidity-compiler.tsx +++ b/libs/remix-ui/solidity-compiler/src/lib/solidity-compiler.tsx @@ -1,14 +1,13 @@ import React, { useState, useEffect } from 'react' // eslint-disable-line import { SolidityCompilerProps } from './types' import { CompilerContainer } from './compiler-container' // eslint-disable-line -import CompileTabLogic from './compileTabLogic' import { Toaster } from '@remix-ui/toaster' // eslint-disable-line import { ModalDialog } from '@remix-ui/modal-dialog' // eslint-disable-line import './css/style.css' export const SolidityCompiler = (props: SolidityCompilerProps) => { - const { editor, config, fileProvider, fileManager, contentImport, queryParams, plugin } = props + const { editor, config, queryParams, plugin, compileTabLogic } = props const [state, setState] = useState({ contractsDetails: {}, eventHandlers: {}, @@ -28,17 +27,6 @@ export const SolidityCompiler = (props: SolidityCompilerProps) => { } }) - useEffect(() => { - const miscApi = { clearAnnotations } - const compileTabLogic = new CompileTabLogic(queryParams, fileManager, editor, config, fileProvider, contentImport, miscApi) - const compiler = compileTabLogic.compiler - - compileTabLogic.init() - setState(prevState => { - return { ...prevState, compileTabLogic, compiler } - }) - }, []) - const toast = (message: string) => { setState(prevState => { return { ...prevState, toasterMsg: message } @@ -71,11 +59,11 @@ export const SolidityCompiler = (props: SolidityCompilerProps) => { return { ...prevState, modal: { ...state.modal, hide: true, message: null } } }) } - // this.onActivationInternal() + return ( <>
- + {/* ${this._view.contractSelection} */}
diff --git a/libs/remix-ui/solidity-compiler/src/lib/types/index.ts b/libs/remix-ui/solidity-compiler/src/lib/types/index.ts index 5d080fdccb..64c8d982c1 100644 --- a/libs/remix-ui/solidity-compiler/src/lib/types/index.ts +++ b/libs/remix-ui/solidity-compiler/src/lib/types/index.ts @@ -6,7 +6,8 @@ export interface SolidityCompilerProps { fileManager: any, contentImport: any, plugin: any, - queryParams: any + queryParams: any, + compileTabLogic: any } export interface CompilerContainerProps { diff --git a/tsconfig.json b/tsconfig.json index 272024fb8c..1c54c30023 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -20,14 +20,10 @@ "@remix-project/remix-astwalker": ["dist/libs/remix-astwalker/index.js"], "@remix-project/remix-debug": ["dist/libs/remix-debug/src/index.js"], "@remix-project/remix-lib": ["dist/libs/remix-lib/src/index.js"], - "@remix-project/remix-simulator": [ - "dist/libs/remix-simulator/src/index.js" - ], + "@remix-project/remix-simulator": ["dist/libs/remix-simulator/src/index.js"], "@remix-project/remix-solidity": ["dist/libs/remix-solidity/index.js"], "@remix-project/remix-tests": ["dist/libs/remix-tests/src/index.js"], - "@remix-project/remix-url-resolver": [ - "dist/libs/remix-url-resolver/index.js" - ], + "@remix-project/remix-url-resolver": ["dist/libs/remix-url-resolver/index.js"], "@remixproject/debugger-plugin": ["apps/debugger/src/index.ts"], "@remix-project/remixd": ["dist/libs/remixd/index.js"], "@remix-ui/tree-view": ["libs/remix-ui/tree-view/src/index.ts"], @@ -44,7 +40,7 @@ "@remix-ui/settings": ["libs/remix-ui/settings/src/index.ts"], "@remix-project/core-plugin": ["libs/remix-core-plugin/src/index.ts"], "@remix-ui/solidity-compiler": ["libs/remix-ui/solidity-compiler/src/index.ts"], - "@remix-project/publish-to-storage": ["libs/remix-ui/publish-to-storage/src/index.ts"] + "@remix-ui/publish-to-storage": ["libs/remix-ui/publish-to-storage/src/index.ts"] } }, "exclude": ["node_modules", "tmp"] From a35b096c5ebab6f488187b4aa97d78a4d9f8cf41 Mon Sep 17 00:00:00 2001 From: ioedeveloper Date: Tue, 22 Jun 2021 16:10:09 +0100 Subject: [PATCH 03/32] Set default value for compiler list --- .../src/lib/compiler-container.tsx | 26 ++++++++----------- .../src/lib/solidity-compiler.tsx | 3 +++ 2 files changed, 14 insertions(+), 15 deletions(-) diff --git a/libs/remix-ui/solidity-compiler/src/lib/compiler-container.tsx b/libs/remix-ui/solidity-compiler/src/lib/compiler-container.tsx index 1d508e6608..9ffbda3bc9 100644 --- a/libs/remix-ui/solidity-compiler/src/lib/compiler-container.tsx +++ b/libs/remix-ui/solidity-compiler/src/lib/compiler-container.tsx @@ -15,6 +15,7 @@ export const CompilerContainer = (props: CompilerContainerProps) => { compileTimeout: null, timeout: 300, allversions: [], + customVersions: [], selectedVersion: null, defaultVersion: 'soljson-v0.8.4+commit.c7e474f2.js', // this default version is defined: in makeMockCompiler (for browser test) selectedLanguage: '', @@ -278,9 +279,8 @@ export const CompilerContainer = (props: CompilerContainerProps) => { if (customUrl !== '') { selectedVersion = customUrl setState(prevState => { - return { ...prevState, selectedVersion } + return { ...prevState, selectedVersion, customVersions: [...state.customVersions, selectedVersion] } }) - // this._view.versionSelector.appendChild(yo``) url = customUrl queryParams.update({ version: selectedVersion }) } else if (selectedVersion === 'builtin') { @@ -319,14 +319,9 @@ export const CompilerContainer = (props: CompilerContainerProps) => { // if (this._view.version) this._view.version.innerText = text // } - const promtCompiler = () => { + const promptCompiler = () => { + // custom url https://solidity-blog.s3.eu-central-1.amazonaws.com/data/08preview/soljson.js modal('Add a custom compiler', promptMessage('URL'), 'OK', addCustomCompiler, 'Cancel', () => {}) - // modalDialogCustom.prompt( - // 'Add a custom compiler', - // 'URL', - // '', - // (url) => this.addCustomCompiler(url) - // ) } const promptMessage = (message) => { @@ -447,11 +442,12 @@ export const CompilerContainer = (props: CompilerContainerProps) => {
- handleLoadVersion(e.target.value) } className="custom-select" id="versionSelector" disabled={state.allversions.length <= 0}> { state.allversions.length <= 0 && } { state.allversions.length <= 0 && } + { state.customVersions.map((url, i) => )} { state.allversions.map((build, i) => { return _shouldBeAdded(build.longVersion) ? @@ -493,9 +489,9 @@ export const CompilerContainer = (props: CompilerContainerProps) => {
- {/* */} + - {/* { title="Estimated number of times each opcode of the deployed code will be executed across the life-time of the contract." onChange={onChangeRuns} disabled={!state.optimise} - /> */} + />
- {/* */} +
diff --git a/libs/remix-ui/solidity-compiler/src/lib/solidity-compiler.tsx b/libs/remix-ui/solidity-compiler/src/lib/solidity-compiler.tsx index b29078280d..080041e8b1 100644 --- a/libs/remix-ui/solidity-compiler/src/lib/solidity-compiler.tsx +++ b/libs/remix-ui/solidity-compiler/src/lib/solidity-compiler.tsx @@ -43,6 +43,7 @@ export const SolidityCompiler = (props: SolidityCompilerProps) => { ...prevState, modal: { ...prevState.modal, + hide: false, message, title, okLabel, @@ -74,7 +75,9 @@ export const SolidityCompiler = (props: SolidityCompilerProps) => { message={ state.modal.message } hide={ state.modal.hide } okLabel={ state.modal.okLabel } + okFn={ state.modal.okFn } cancelLabel={ state.modal.cancelLabel } + cancelFn={ state.modal.cancelFn } handleHide={ handleHideModal }> { (typeof state.modal.message !== 'string') && state.modal.message } From 593c14c44a9cc25c62b0b5c18abc6b6ac51002ab Mon Sep 17 00:00:00 2001 From: ioedeveloper Date: Tue, 22 Jun 2021 18:38:54 +0100 Subject: [PATCH 04/32] Get currentFile on compilation finished --- apps/remix-ide/src/app/tabs/analysis-tab.js | 4 ++-- apps/remix-ide/src/app/tabs/compile-tab.js | 10 +++++++--- .../solidity-compiler/src/lib/compiler-container.tsx | 8 +++++++- .../solidity-compiler/src/lib/solidity-compiler.tsx | 4 ++-- libs/remix-ui/solidity-compiler/src/lib/types/index.ts | 6 ++++-- 5 files changed, 22 insertions(+), 10 deletions(-) diff --git a/apps/remix-ide/src/app/tabs/analysis-tab.js b/apps/remix-ide/src/app/tabs/analysis-tab.js index b3bba2705c..de515eec52 100644 --- a/apps/remix-ide/src/app/tabs/analysis-tab.js +++ b/apps/remix-ide/src/app/tabs/analysis-tab.js @@ -4,7 +4,7 @@ import ReactDOM from 'react-dom' import { EventEmitter } from 'events' import {RemixUiStaticAnalyser} from '@remix-ui/static-analyser' // eslint-disable-line import * as packageJson from '../../../../../package.json' -var Renderer = require('../ui/renderer') +// var Renderer = require('../ui/renderer') var EventManager = require('../../lib/events') @@ -30,7 +30,7 @@ class AnalysisTab extends ViewPlugin { this.element = document.createElement('div') this.element.setAttribute('id', 'staticAnalyserView') this._components = { - renderer: new Renderer(this) + // renderer: new Renderer(this) } this._components.registry = this.registry this._deps = { diff --git a/apps/remix-ide/src/app/tabs/compile-tab.js b/apps/remix-ide/src/app/tabs/compile-tab.js index b9c50cc654..9652823ce9 100644 --- a/apps/remix-ide/src/app/tabs/compile-tab.js +++ b/apps/remix-ide/src/app/tabs/compile-tab.js @@ -85,10 +85,11 @@ class CompileTab extends ViewPlugin { if (this._view.errorContainer) { this._view.errorContainer.innerHTML = '' } - this.compilerContainer.currentFile = '' + this.currentFile = '' this.data.contractsDetails = {} yo.update(this._view.contractSelection, this.contractSelection()) this.emit('statusChanged', { key: 'none' }) + this.renderComponent() } /************ @@ -137,12 +138,14 @@ class CompileTab extends ViewPlugin { this.compileTabLogic.event.on('removeAnnotations', this.data.eventHandlers.onRemoveAnnotations) this.data.eventHandlers.onCurrentFileChanged = (name) => { - this.compilerContainer.currentFile = name + this.currentFile = name + this.renderComponent() } this.fileManager.events.on('currentFileChanged', this.data.eventHandlers.onCurrentFileChanged) this.data.eventHandlers.onNoFileSelected = () => { - this.compilerContainer.currentFile = '' + this.currentFile = '' + this.renderComponent() } this.fileManager.events.on('noFileSelected', this.data.eventHandlers.onNoFileSelected) @@ -499,6 +502,7 @@ class CompileTab extends ViewPlugin { queryParams={this.queryParams} plugin={this} compileTabLogic={this.compileTabLogic} + compiledFileName={this.currentFile} /> , this.el) } diff --git a/libs/remix-ui/solidity-compiler/src/lib/compiler-container.tsx b/libs/remix-ui/solidity-compiler/src/lib/compiler-container.tsx index 9ffbda3bc9..50c0d325ba 100644 --- a/libs/remix-ui/solidity-compiler/src/lib/compiler-container.tsx +++ b/libs/remix-ui/solidity-compiler/src/lib/compiler-container.tsx @@ -7,7 +7,7 @@ import { canUseWorker, baseURLBin, baseURLWasm, urlFromVersion, pathToURL, promi import './css/style.css' export const CompilerContainer = (props: CompilerContainerProps) => { - const { editor, config, queryParams, compileTabLogic, tooltip, modal } = props // eslint-disable-line + const { editor, config, queryParams, compileTabLogic, tooltip, modal, compiledFileName } = props // eslint-disable-line const [state, setState] = useState({ hideWarnings: false, autoCompile: false, @@ -60,6 +60,12 @@ export const CompilerContainer = (props: CompilerContainerProps) => { } }, [compileTabLogic]) + useEffect(() => { + setState(prevState => { + return { ...prevState, compiledFileName } + }) + }, [compiledFileName]) + const compilerLoaded = (version: string) => { setVersionText(version) } diff --git a/libs/remix-ui/solidity-compiler/src/lib/solidity-compiler.tsx b/libs/remix-ui/solidity-compiler/src/lib/solidity-compiler.tsx index 080041e8b1..362ee4f761 100644 --- a/libs/remix-ui/solidity-compiler/src/lib/solidity-compiler.tsx +++ b/libs/remix-ui/solidity-compiler/src/lib/solidity-compiler.tsx @@ -7,7 +7,7 @@ import { ModalDialog } from '@remix-ui/modal-dialog' // eslint-disable-line import './css/style.css' export const SolidityCompiler = (props: SolidityCompilerProps) => { - const { editor, config, queryParams, plugin, compileTabLogic } = props + const { editor, config, queryParams, plugin, compileTabLogic, compiledFileName } = props const [state, setState] = useState({ contractsDetails: {}, eventHandlers: {}, @@ -64,7 +64,7 @@ export const SolidityCompiler = (props: SolidityCompilerProps) => { return ( <>
- + {/* ${this._view.contractSelection} */}
diff --git a/libs/remix-ui/solidity-compiler/src/lib/types/index.ts b/libs/remix-ui/solidity-compiler/src/lib/types/index.ts index 64c8d982c1..b0d701b9e1 100644 --- a/libs/remix-ui/solidity-compiler/src/lib/types/index.ts +++ b/libs/remix-ui/solidity-compiler/src/lib/types/index.ts @@ -7,7 +7,8 @@ export interface SolidityCompilerProps { contentImport: any, plugin: any, queryParams: any, - compileTabLogic: any + compileTabLogic: any, + compiledFileName: string } export interface CompilerContainerProps { @@ -16,7 +17,8 @@ export interface CompilerContainerProps { queryParams: any, compileTabLogic: any, tooltip: (message: string) => void, - modal: (title: string, message: string | JSX.Element, okLabel: string, okFn: () => void, cancelLabel?: string, cancelFn?: () => void) => void + modal: (title: string, message: string | JSX.Element, okLabel: string, okFn: () => void, cancelLabel?: string, cancelFn?: () => void) => void, + compiledFileName: string } export interface ContractSelectionProps { contractMap: { From a25f1ef0882708307612deabc0fa4bbd3cdd61ec Mon Sep 17 00:00:00 2001 From: ioedeveloper Date: Tue, 22 Jun 2021 18:55:11 +0100 Subject: [PATCH 05/32] Made error renderer a react library --- libs/remix-ui/renderer/.babelrc | 4 ++ libs/remix-ui/renderer/.eslintrc | 19 ++++++ libs/remix-ui/renderer/README.md | 7 +++ libs/remix-ui/renderer/src/index.ts | 1 + libs/remix-ui/renderer/src/lib/renderer.css | 0 libs/remix-ui/renderer/src/lib/renderer.tsx | 63 +++++++++++++++++++ libs/remix-ui/renderer/tsconfig.json | 16 +++++ libs/remix-ui/renderer/tsconfig.lib.json | 13 ++++ .../src/lib/solidity-compiler.tsx | 1 + nx.json | 3 + tsconfig.json | 3 +- workspace.json | 16 +++++ 12 files changed, 145 insertions(+), 1 deletion(-) create mode 100644 libs/remix-ui/renderer/.babelrc create mode 100644 libs/remix-ui/renderer/.eslintrc create mode 100644 libs/remix-ui/renderer/README.md create mode 100644 libs/remix-ui/renderer/src/index.ts create mode 100644 libs/remix-ui/renderer/src/lib/renderer.css create mode 100644 libs/remix-ui/renderer/src/lib/renderer.tsx create mode 100644 libs/remix-ui/renderer/tsconfig.json create mode 100644 libs/remix-ui/renderer/tsconfig.lib.json diff --git a/libs/remix-ui/renderer/.babelrc b/libs/remix-ui/renderer/.babelrc new file mode 100644 index 0000000000..09d67939cc --- /dev/null +++ b/libs/remix-ui/renderer/.babelrc @@ -0,0 +1,4 @@ +{ + "presets": ["@nrwl/react/babel"], + "plugins": [] +} diff --git a/libs/remix-ui/renderer/.eslintrc b/libs/remix-ui/renderer/.eslintrc new file mode 100644 index 0000000000..dae5c6feeb --- /dev/null +++ b/libs/remix-ui/renderer/.eslintrc @@ -0,0 +1,19 @@ +{ + "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" + } +} diff --git a/libs/remix-ui/renderer/README.md b/libs/remix-ui/renderer/README.md new file mode 100644 index 0000000000..1fcfae088f --- /dev/null +++ b/libs/remix-ui/renderer/README.md @@ -0,0 +1,7 @@ +# remix-ui-renderer + +This library was generated with [Nx](https://nx.dev). + +## Running unit tests + +Run `nx test remix-ui-renderer` to execute the unit tests via [Jest](https://jestjs.io). diff --git a/libs/remix-ui/renderer/src/index.ts b/libs/remix-ui/renderer/src/index.ts new file mode 100644 index 0000000000..a891eab32e --- /dev/null +++ b/libs/remix-ui/renderer/src/index.ts @@ -0,0 +1 @@ +export * from './lib/renderer' diff --git a/libs/remix-ui/renderer/src/lib/renderer.css b/libs/remix-ui/renderer/src/lib/renderer.css new file mode 100644 index 0000000000..e69de29bb2 diff --git a/libs/remix-ui/renderer/src/lib/renderer.tsx b/libs/remix-ui/renderer/src/lib/renderer.tsx new file mode 100644 index 0000000000..b00a979bc5 --- /dev/null +++ b/libs/remix-ui/renderer/src/lib/renderer.tsx @@ -0,0 +1,63 @@ +import React from 'react' //eslint-disable-line + +interface RendererProps { + message: any; + opt: any, + warningErrors: any + editor: any +} + +export const Renderer = ({ message, opt, editor }: RendererProps) => { + const getPositionDetails = (msg: any) => { + const result = { } as Record + + // To handle some compiler warning without location like SPDX license warning etc + if (!msg.includes(':')) return { errLine: -1, errCol: -1, errFile: msg } + + // extract line / column + let position = msg.match(/^(.*?):([0-9]*?):([0-9]*?)?/) + result.errLine = position ? parseInt(position[2]) - 1 : -1 + result.errCol = position ? parseInt(position[3]) : -1 + + // extract file + position = msg.match(/^(https:.*?|http:.*?|.*?):/) + result.errFile = position ? position[1] : '' + return result + } + + const handlePointToErrorOnClick = (location, fileName) => { + editor.call('editor', 'discardHighlight') + editor.call('editor', 'highlight', location, fileName) + } + + if (!message) return + let position = getPositionDetails(message) + if (!position.errFile || (opt.errorType && opt.errorType === position.errFile)) { + // Updated error reported includes '-->' before file details + const errorDetails = message.split('-->') + // errorDetails[1] will have file details + if (errorDetails.length > 1) position = getPositionDetails(errorDetails[1]) + } + opt.errLine = position.errLine + opt.errCol = position.errCol + opt.errFile = position.errFile.trim() + const classList = opt.type === 'error' ? 'alert alert-danger' : 'alert alert-warning' + return ( +
+
+
+ +
+ handlePointToErrorOnClick(opt.location, opt.fileName)}> + {opt.name} + { opt.item.warning } + {opt.item.more + ? more + : + } + Pos: {opt.locationString} + +
+
+ ) +} diff --git a/libs/remix-ui/renderer/tsconfig.json b/libs/remix-ui/renderer/tsconfig.json new file mode 100644 index 0000000000..6b65264565 --- /dev/null +++ b/libs/remix-ui/renderer/tsconfig.json @@ -0,0 +1,16 @@ +{ + "extends": "../../../tsconfig.json", + "compilerOptions": { + "jsx": "react", + "allowJs": true, + "esModuleInterop": true, + "allowSyntheticDefaultImports": true + }, + "files": [], + "include": [], + "references": [ + { + "path": "./tsconfig.lib.json" + } + ] +} diff --git a/libs/remix-ui/renderer/tsconfig.lib.json b/libs/remix-ui/renderer/tsconfig.lib.json new file mode 100644 index 0000000000..b560bc4dec --- /dev/null +++ b/libs/remix-ui/renderer/tsconfig.lib.json @@ -0,0 +1,13 @@ +{ + "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"] +} diff --git a/libs/remix-ui/solidity-compiler/src/lib/solidity-compiler.tsx b/libs/remix-ui/solidity-compiler/src/lib/solidity-compiler.tsx index 362ee4f761..f0572d59f5 100644 --- a/libs/remix-ui/solidity-compiler/src/lib/solidity-compiler.tsx +++ b/libs/remix-ui/solidity-compiler/src/lib/solidity-compiler.tsx @@ -3,6 +3,7 @@ import { SolidityCompilerProps } from './types' import { CompilerContainer } from './compiler-container' // eslint-disable-line import { Toaster } from '@remix-ui/toaster' // eslint-disable-line import { ModalDialog } from '@remix-ui/modal-dialog' // eslint-disable-line +import { Renderer } from '@remix-ui/renderer' import './css/style.css' diff --git a/nx.json b/nx.json index fe85503935..16e4c56d76 100644 --- a/nx.json +++ b/nx.json @@ -113,6 +113,9 @@ }, "remix-ui-publish-to-storage": { "tags": [] + }, + "remix-ui-renderer": { + "tags": [] } } } diff --git a/tsconfig.json b/tsconfig.json index 1c54c30023..87a3bd1b40 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -40,7 +40,8 @@ "@remix-ui/settings": ["libs/remix-ui/settings/src/index.ts"], "@remix-project/core-plugin": ["libs/remix-core-plugin/src/index.ts"], "@remix-ui/solidity-compiler": ["libs/remix-ui/solidity-compiler/src/index.ts"], - "@remix-ui/publish-to-storage": ["libs/remix-ui/publish-to-storage/src/index.ts"] + "@remix-ui/publish-to-storage": ["libs/remix-ui/publish-to-storage/src/index.ts"], + "@remix-ui/renderer": ["libs/remix-ui/renderer/src/index.ts"] } }, "exclude": ["node_modules", "tmp"] diff --git a/workspace.json b/workspace.json index 256cf52172..cf80740abd 100644 --- a/workspace.json +++ b/workspace.json @@ -806,6 +806,22 @@ } } } + }, + "remix-ui-renderer": { + "root": "libs/remix-ui/renderer", + "sourceRoot": "libs/remix-ui/renderer/src", + "projectType": "library", + "schematics": {}, + "architect": { + "lint": { + "builder": "@nrwl/linter:lint", + "options": { + "linter": "eslint", + "tsConfig": ["libs/remix-ui/renderer/tsconfig.lib.json"], + "exclude": ["**/node_modules/**", "!libs/remix-ui/renderer/**/*"] + } + } + } } }, "remix-ui-solidity-compiler": { From 1b08ed87fc6f584824813eabd3290aeed07b625d Mon Sep 17 00:00:00 2001 From: ioedeveloper Date: Thu, 24 Jun 2021 17:09:50 +0100 Subject: [PATCH 06/32] Improve contract selection --- apps/remix-ide/src/app/tabs/compile-tab.js | 170 +++++++++--------- libs/remix-ui/solidity-compiler/src/index.ts | 1 + .../src/lib/compileTabLogic.ts | 2 +- .../src/lib/contract-selection.tsx | 44 ++--- .../src/lib/solidity-compiler.css | 0 .../src/lib/solidity-compiler.tsx | 6 +- .../solidity-compiler/src/lib/types/index.ts | 7 +- 7 files changed, 119 insertions(+), 111 deletions(-) delete mode 100644 libs/remix-ui/solidity-compiler/src/lib/solidity-compiler.css diff --git a/apps/remix-ide/src/app/tabs/compile-tab.js b/apps/remix-ide/src/app/tabs/compile-tab.js index 9652823ce9..d277a02057 100644 --- a/apps/remix-ide/src/app/tabs/compile-tab.js +++ b/apps/remix-ide/src/app/tabs/compile-tab.js @@ -1,8 +1,9 @@ /* global */ import React from 'react' // eslint-disable-line import ReactDOM from 'react-dom' -import { SolidityCompiler } from '@remix-ui/solidity-compiler' // eslint-disable-line +import { SolidityCompiler, CompileTab as CompileTabLogic } from '@remix-ui/solidity-compiler' // eslint-disable-line import { ViewPlugin } from '@remixproject/engine-web' +import { Renderer } from '@remix-ui/renderer' import * as packageJson from '../../../../../package.json' import publishToStorage from '../../publishToStorage' import { compile } from '@remix-project/remix-solidity' @@ -18,7 +19,7 @@ const copyToClipboard = require('../ui/copy-to-clipboard') const modalDialogCustom = require('../ui/modal-dialog-custom') const parseContracts = require('./compileTab/contractParser') const addTooltip = require('../ui/tooltip') -const Renderer = require('../ui/renderer') +// const Renderer = require('../ui/renderer') const globalRegistry = require('../../global/registry') var css = require('./styles/compile-tab-styles') @@ -58,11 +59,10 @@ class CompileTab extends ViewPlugin { // dependencies this.editor = editor this.config = config - this.renderer = new Renderer(this) + // this.renderer = new Renderer(this) this.fileManager = fileManager - + this.contractsDetails = {} this.data = { - contractsDetails: {}, eventHandlers: {}, loading: false } @@ -86,7 +86,7 @@ class CompileTab extends ViewPlugin { this._view.errorContainer.innerHTML = '' } this.currentFile = '' - this.data.contractsDetails = {} + this.contractsDetails = {} yo.update(this._view.contractSelection, this.contractSelection()) this.emit('statusChanged', { key: 'none' }) this.renderComponent() @@ -162,9 +162,9 @@ class CompileTab extends ViewPlugin { }) } else this.emit('statusChanged', { key: 'succeed', title: 'compilation successful', type: 'success' }) // Store the contracts - this.data.contractsDetails = {} + this.contractsDetails = {} this.compiler.visitContracts((contract) => { - this.data.contractsDetails[contract.name] = parseContracts( + this.contractsDetails[contract.name] = parseContracts( contract.name, contract.object, this.compiler.getSource(contract.file) @@ -181,11 +181,11 @@ class CompileTab extends ViewPlugin { yo.update(this._view.contractSelection, contractSelection) if (data.error) { - this.renderer.error( - data.error.formattedMessage || data.error, - this._view.errorContainer, - { type: data.error.severity || 'error', errorType: data.error.type } - ) + // this.renderer.error( + // data.error.formattedMessage || data.error, + // this._view.errorContainer, + // { type: data.error.severity || 'error', errorType: data.error.type } + // ) if (data.error.mode === 'panic') { return modalDialogCustom.alert(yo`
@@ -199,13 +199,14 @@ class CompileTab extends ViewPlugin { data.errors.forEach((err) => { if (this.config.get('hideWarnings')) { if (err.severity !== 'warning') { - this.renderer.error(err.formattedMessage, this._view.errorContainer, { type: err.severity, errorType: err.type }) + // this.renderer.error(err.formattedMessage, this._view.errorContainer, { type: err.severity, errorType: err.type }) } } else { - this.renderer.error(err.formattedMessage, this._view.errorContainer, { type: err.severity, errorType: err.type }) + // this.renderer.error(err.formattedMessage, this._view.errorContainer, { type: err.severity, errorType: err.type }) } }) } + this.renderComponent() } this.compiler.event.register('compilationFinished', this.data.eventHandlers.onCompilationFinished) @@ -301,73 +302,73 @@ class CompileTab extends ViewPlugin { * Section to select the compiled contract * @param {string[]} contractList Names of the compiled contracts */ - contractSelection (contractMap) { - // Return the file name of a path: ex "browser/ballot.sol" -> "ballot.sol" - const getFileName = (path) => { - const part = path.split('/') - return part[part.length - 1] - } - const contractList = contractMap ? Object.keys(contractMap).map((key) => ({ - name: key, - file: getFileName(contractMap[key].file) - })) : [] - const selectEl = yo` - - ` - // define swarm logo - - const result = contractList.length - ? yo`
- -
- - ${selectEl} -
-
- - - - -
-
-
- - -
-
-
-
- ` - : yo`
- No Contract Compiled Yet -
` - - if (contractList.length) { - this.selectedContract = selectEl.value - } else { - delete this.selectedContract - } - return result - } + // contractSelection (contractMap) { + // // Return the file name of a path: ex "browser/ballot.sol" -> "ballot.sol" + // const getFileName = (path) => { + // const part = path.split('/') + // return part[part.length - 1] + // } + // const contractList = contractMap ? Object.keys(contractMap).map((key) => ({ + // name: key, + // file: getFileName(contractMap[key].file) + // })) : [] + // const selectEl = yo` + // + // ` + // // define swarm logo + + // const result = contractList.length + // ? yo`
+ // + //
+ // + // ${selectEl} + //
+ //
+ // + // + // + // + //
+ //
+ //
+ // + // + //
+ //
+ //
+ // + //
` + // : yo`
+ // No Contract Compiled Yet + //
` + + // if (contractList.length) { + // this.selectedContract = selectEl.value + // } else { + // delete this.selectedContract + // } + // return result + // } // TODO : Add success alert when compilation succeed contractCompiledSuccess () { @@ -403,7 +404,7 @@ class CompileTab extends ViewPlugin { web3Deploy: 'Copy/paste this code to any JavaScript/Web3 console to deploy this contract' } if (!this.selectedContract) throw new Error('No contract compiled yet') - const contractProperties = this.data.contractsDetails[this.selectedContract] + const contractProperties = this.contractsDetails[this.selectedContract] const log = yo`
` Object.keys(contractProperties).map(propertyName => { const copyDetails = yo`${copyToClipboard(() => contractProperties[propertyName])}` @@ -457,7 +458,7 @@ class CompileTab extends ViewPlugin { getContractProperty (property) { if (!this.selectedContract) throw new Error('No contract compiled yet') - const contractProperties = this.data.contractsDetails[this.selectedContract] + const contractProperties = this.contractsDetails[this.selectedContract] return contractProperties[property] || null } @@ -503,6 +504,7 @@ class CompileTab extends ViewPlugin { plugin={this} compileTabLogic={this.compileTabLogic} compiledFileName={this.currentFile} + contractsDetails={this.contractsDetails} /> , this.el) } diff --git a/libs/remix-ui/solidity-compiler/src/index.ts b/libs/remix-ui/solidity-compiler/src/index.ts index 3634357b17..576801a333 100644 --- a/libs/remix-ui/solidity-compiler/src/index.ts +++ b/libs/remix-ui/solidity-compiler/src/index.ts @@ -1 +1,2 @@ export * from './lib/solidity-compiler' +export * from './lib/compileTabLogic' diff --git a/libs/remix-ui/solidity-compiler/src/lib/compileTabLogic.ts b/libs/remix-ui/solidity-compiler/src/lib/compileTabLogic.ts index 63c3c563c9..6d21951efb 100644 --- a/libs/remix-ui/solidity-compiler/src/lib/compileTabLogic.ts +++ b/libs/remix-ui/solidity-compiler/src/lib/compileTabLogic.ts @@ -9,7 +9,7 @@ const profile = { description: 'Compile solidity contracts - Logic', version: packageJson.version } -export default class CompileTab extends Plugin { +export class CompileTab extends Plugin { public compiler public optimize public runs: number diff --git a/libs/remix-ui/solidity-compiler/src/lib/contract-selection.tsx b/libs/remix-ui/solidity-compiler/src/lib/contract-selection.tsx index cae8d6bee2..c8e3c532ae 100644 --- a/libs/remix-ui/solidity-compiler/src/lib/contract-selection.tsx +++ b/libs/remix-ui/solidity-compiler/src/lib/contract-selection.tsx @@ -5,11 +5,9 @@ import { PublishToStorage } from '@remix-ui/publish-to-storage' import './css/style.css' export const ContractSelection = (props: ContractSelectionProps) => { - const { contractMap } = props - const [state, setState] = useState({ - contractList: null, - selectedContract: '' - }) + const { contractMap, fileProvider, fileManager, contractsDetails } = props + const [contractList, setContractList] = useState([]) + const [selectedContract, setSelectedContract] = useState('') useEffect(() => { const contractList = contractMap ? Object.keys(contractMap).map((key) => ({ @@ -17,9 +15,7 @@ export const ContractSelection = (props: ContractSelectionProps) => { file: getFileName(contractMap[key].file) })) : [] - setState(prevState => { - return { ...prevState, contractList } - }) + setContractList(contractList) }, []) // Return the file name of a path: ex "browser/ballot.sol" -> "ballot.sol" const getFileName = (path) => { @@ -29,9 +25,7 @@ export const ContractSelection = (props: ContractSelectionProps) => { } const selectContract = (contractName: string) => { - setState(prevState => { - return { ...prevState, selectedContract: contractName } - }) + setSelectedContract(contractName) } const handlePublishToStorage = (type) => { @@ -60,12 +54,15 @@ export const ContractSelection = (props: ContractSelectionProps) => { } const getContractProperty = (property) => { - // if (!this.selectedContract) throw new Error('No contract compiled yet') - // const contractProperties = this.data.contractsDetails[this.selectedContract] - // return contractProperties[property] || null + if (!selectedContract) throw new Error('No contract compiled yet') + const contractProperties = contractsDetails[selectedContract] + + return contractProperties[property] || null } const details = () => { + if (!selectedContract) throw new Error('No contract compiled yet') + const help = { Assembly: 'Assembly opcodes describing the contract including corresponding solidity source code', Opcodes: 'Assembly opcodes describing the contract', @@ -80,17 +77,22 @@ export const ContractSelection = (props: ContractSelectionProps) => { swarmLocation: 'Swarm url where all metadata information can be found (contract needs to be published first)', web3Deploy: 'Copy/paste this code to any JavaScript/Web3 console to deploy this contract' } - if (!this.selectedContract) throw new Error('No contract compiled yet') - const contractProperties = this.data.contractsDetails[this.selectedContract] - const log = yo`
` + const contractProperties = contractsDetails[selectedContract] + const log =
+ Object.keys(contractProperties).map(propertyName => { - const copyDetails = yo`${copyToClipboard(() => contractProperties[propertyName])}` - const questionMark = yo`` + const copyDetails = { copyToClipboard(() => contractProperties[propertyName]) } + const questionMark = + log.appendChild(yo`
${propertyName} ${copyDetails} ${questionMark}
${this.insertValue(contractProperties, propertyName)}
`) }) + + return { + + } modalDialog(this.selectedContract, log, { label: '' }, { label: 'Close' }) } @@ -101,13 +103,13 @@ export const ContractSelection = (props: ContractSelectionProps) => { return ( // define swarm logo <> - { state.contractList.length ? + { contractList.length ?
{/* Select Compiler Version */}
diff --git a/libs/remix-ui/solidity-compiler/src/lib/solidity-compiler.css b/libs/remix-ui/solidity-compiler/src/lib/solidity-compiler.css deleted file mode 100644 index e69de29bb2..0000000000 diff --git a/libs/remix-ui/solidity-compiler/src/lib/solidity-compiler.tsx b/libs/remix-ui/solidity-compiler/src/lib/solidity-compiler.tsx index f0572d59f5..ea82b23352 100644 --- a/libs/remix-ui/solidity-compiler/src/lib/solidity-compiler.tsx +++ b/libs/remix-ui/solidity-compiler/src/lib/solidity-compiler.tsx @@ -1,14 +1,14 @@ import React, { useState, useEffect } from 'react' // eslint-disable-line import { SolidityCompilerProps } from './types' import { CompilerContainer } from './compiler-container' // eslint-disable-line +import { ContractSelection } from './contract-selection' import { Toaster } from '@remix-ui/toaster' // eslint-disable-line import { ModalDialog } from '@remix-ui/modal-dialog' // eslint-disable-line -import { Renderer } from '@remix-ui/renderer' import './css/style.css' export const SolidityCompiler = (props: SolidityCompilerProps) => { - const { editor, config, queryParams, plugin, compileTabLogic, compiledFileName } = props + const { editor, config, queryParams, plugin, compileTabLogic, compiledFileName, fileProvider, fileManager, contractsDetails } = props const [state, setState] = useState({ contractsDetails: {}, eventHandlers: {}, @@ -66,7 +66,7 @@ export const SolidityCompiler = (props: SolidityCompilerProps) => { <>
- {/* ${this._view.contractSelection} */} +
diff --git a/libs/remix-ui/solidity-compiler/src/lib/types/index.ts b/libs/remix-ui/solidity-compiler/src/lib/types/index.ts index b0d701b9e1..8dba36f4bd 100644 --- a/libs/remix-ui/solidity-compiler/src/lib/types/index.ts +++ b/libs/remix-ui/solidity-compiler/src/lib/types/index.ts @@ -8,7 +8,8 @@ export interface SolidityCompilerProps { plugin: any, queryParams: any, compileTabLogic: any, - compiledFileName: string + compiledFileName: string, + contractsDetails: Record } export interface CompilerContainerProps { @@ -23,5 +24,7 @@ export interface CompilerContainerProps { export interface ContractSelectionProps { contractMap: { file: string - } + } | Record, + fileManager: any, + fileProvider: any } From 12762f3317a93c672b7fc42ece74c8abaac86861 Mon Sep 17 00:00:00 2001 From: ioedeveloper Date: Sat, 26 Jun 2021 12:01:36 +0100 Subject: [PATCH 07/32] Fixed publish to storage. --- apps/remix-ide/src/app/tabs/compile-tab.js | 154 +++++++++--------- .../src/lib/publish-to-storage.tsx | 97 ++++------- .../src/lib/publishOnSwarm.tsx | 45 ++--- .../src/lib/publishToIPFS.tsx | 35 ++-- .../publish-to-storage/src/lib/types/index.ts | 3 +- .../src/lib/compiler-container.tsx | 14 +- .../src/lib/contract-selection.tsx | 138 ++++++++++++---- .../src/lib/solidity-compiler.tsx | 6 +- .../solidity-compiler/src/lib/types/index.ts | 13 +- 9 files changed, 294 insertions(+), 211 deletions(-) diff --git a/apps/remix-ide/src/app/tabs/compile-tab.js b/apps/remix-ide/src/app/tabs/compile-tab.js index d277a02057..775b251872 100644 --- a/apps/remix-ide/src/app/tabs/compile-tab.js +++ b/apps/remix-ide/src/app/tabs/compile-tab.js @@ -13,9 +13,6 @@ const $ = require('jquery') const yo = require('yo-yo') const copy = require('copy-text-to-clipboard') var QueryParams = require('../../lib/query-params') -const TreeView = require('../ui/TreeView') -const modalDialog = require('../ui/modaldialog') -const copyToClipboard = require('../ui/copy-to-clipboard') const modalDialogCustom = require('../ui/modal-dialog-custom') const parseContracts = require('./compileTab/contractParser') const addTooltip = require('../ui/tooltip') @@ -76,6 +73,7 @@ class CompileTab extends ViewPlugin { ) this.compiler = this.compileTabLogic.compiler this.compileTabLogic.init() + this.contractMap = {} this.el = document.createElement('div') this.el.setAttribute('id', 'compileTabView') @@ -150,7 +148,7 @@ class CompileTab extends ViewPlugin { this.fileManager.events.on('noFileSelected', this.data.eventHandlers.onNoFileSelected) this.data.eventHandlers.onCompilationFinished = (success, data, source) => { - this._view.errorContainer.appendChild(yo``) + // this._view.errorContainer.appendChild(yo``) if (success) { // forwarding the event to the appManager infra this.emit('compilationFinished', source.target, source, 'soljson', data) @@ -175,10 +173,10 @@ class CompileTab extends ViewPlugin { this.emit('statusChanged', { key: count, title: `compilation failed with ${count} error${count.length > 1 ? 's' : ''}`, type: 'error' }) } // Update contract Selection - const contractMap = {} - if (success) this.compiler.visitContracts((contract) => { contractMap[contract.name] = contract }) - const contractSelection = this.contractSelection(contractMap) - yo.update(this._view.contractSelection, contractSelection) + this.contractMap = {} + if (success) this.compiler.visitContracts((contract) => { this.contractMap[contract.name] = contract }) + // const contractSelection = this.contractSelection(contractMap) + // yo.update(this._view.contractSelection, contractSelection) if (data.error) { // this.renderer.error( @@ -224,11 +222,15 @@ class CompileTab extends ViewPlugin { // ctrl+s or command+s if ((e.metaKey || e.ctrlKey) && e.keyCode === 83) { e.preventDefault() - this.compileTabLogic.runCompiler(this.compilerContainer.hhCompilation) + this.compileTabLogic.runCompiler(this.hhCompilation) } }) } + setHardHatCompilation (value) { + this.hhCompilation = value + } + getCompilationResult () { return this.compileTabLogic.compiler.state.lastCompilationResult } @@ -388,73 +390,73 @@ class CompileTab extends ViewPlugin { this.selectedContract = contractName } - details () { - const help = { - Assembly: 'Assembly opcodes describing the contract including corresponding solidity source code', - Opcodes: 'Assembly opcodes describing the contract', - 'Runtime Bytecode': 'Bytecode storing the state and being executed during normal contract call', - bytecode: 'Bytecode being executed during contract creation', - functionHashes: 'List of declared function and their corresponding hash', - gasEstimates: 'Gas estimation for each function call', - metadata: 'Contains all informations related to the compilation', - metadataHash: 'Hash representing all metadata information', - abi: 'ABI: describing all the functions (input/output params, scope, ...)', - name: 'Name of the compiled contract', - swarmLocation: 'Swarm url where all metadata information can be found (contract needs to be published first)', - web3Deploy: 'Copy/paste this code to any JavaScript/Web3 console to deploy this contract' - } - if (!this.selectedContract) throw new Error('No contract compiled yet') - const contractProperties = this.contractsDetails[this.selectedContract] - const log = yo`
` - Object.keys(contractProperties).map(propertyName => { - const copyDetails = yo`${copyToClipboard(() => contractProperties[propertyName])}` - const questionMark = yo`` - log.appendChild(yo`
-
${propertyName} ${copyDetails} ${questionMark}
- ${this.insertValue(contractProperties, propertyName)} -
`) - }) - modalDialog(this.selectedContract, log, { label: '' }, { label: 'Close' }) - } + // details () { + // const help = { + // Assembly: 'Assembly opcodes describing the contract including corresponding solidity source code', + // Opcodes: 'Assembly opcodes describing the contract', + // 'Runtime Bytecode': 'Bytecode storing the state and being executed during normal contract call', + // bytecode: 'Bytecode being executed during contract creation', + // functionHashes: 'List of declared function and their corresponding hash', + // gasEstimates: 'Gas estimation for each function call', + // metadata: 'Contains all informations related to the compilation', + // metadataHash: 'Hash representing all metadata information', + // abi: 'ABI: describing all the functions (input/output params, scope, ...)', + // name: 'Name of the compiled contract', + // swarmLocation: 'Swarm url where all metadata information can be found (contract needs to be published first)', + // web3Deploy: 'Copy/paste this code to any JavaScript/Web3 console to deploy this contract' + // } + // if (!this.selectedContract) throw new Error('No contract compiled yet') + // const contractProperties = this.contractsDetails[this.selectedContract] + // const log = yo`
` + // Object.keys(contractProperties).map(propertyName => { + // const copyDetails = yo`${copyToClipboard(() => contractProperties[propertyName])}` + // const questionMark = yo`` + // log.appendChild(yo`
+ //
${propertyName} ${copyDetails} ${questionMark}
+ // ${this.insertValue(contractProperties, propertyName)} + //
`) + // }) + // modalDialog(this.selectedContract, log, { label: '' }, { label: 'Close' }) + // } - insertValue (details, propertyName) { - var node - if (propertyName === 'web3Deploy' || propertyName === 'name' || propertyName === 'Assembly') { - node = yo`
${details[propertyName]}
` - } else if (propertyName === 'abi' || propertyName === 'metadata') { - const treeView = new TreeView({ - extractData: function (item, parent, key) { - var ret = {} - if (item instanceof Array) { - ret.children = item.map((item, index) => ({ key: index, value: item })) - ret.self = '' - } else if (item instanceof Object) { - ret.children = Object.keys(item).map((key) => ({ key: key, value: item[key] })) - ret.self = '' - } else { - ret.self = item - ret.children = [] - } - return ret - } - }) - if (details[propertyName] !== '') { - try { - node = yo` -
- ${treeView.render(typeof details[propertyName] === 'object' ? details[propertyName] : JSON.parse(details[propertyName]))} -
` // catch in case the parsing fails. - } catch (e) { - node = yo`
Unable to display "${propertyName}": ${e.message}
` - } - } else { - node = yo`
-
` - } - } else { - node = yo`
${JSON.stringify(details[propertyName], null, 4)}
` - } - return yo`
${node || ''}
` - } + // insertValue (details, propertyName) { + // var node + // if (propertyName === 'web3Deploy' || propertyName === 'name' || propertyName === 'Assembly') { + // node = yo`
${details[propertyName]}
` + // } else if (propertyName === 'abi' || propertyName === 'metadata') { + // const treeView = new TreeView({ + // extractData: function (item, parent, key) { + // var ret = {} + // if (item instanceof Array) { + // ret.children = item.map((item, index) => ({ key: index, value: item })) + // ret.self = '' + // } else if (item instanceof Object) { + // ret.children = Object.keys(item).map((key) => ({ key: key, value: item[key] })) + // ret.self = '' + // } else { + // ret.self = item + // ret.children = [] + // } + // return ret + // } + // }) + // if (details[propertyName] !== '') { + // try { + // node = yo` + //
+ // ${treeView.render(typeof details[propertyName] === 'object' ? details[propertyName] : JSON.parse(details[propertyName]))} + //
` // catch in case the parsing fails. + // } catch (e) { + // node = yo`
Unable to display "${propertyName}": ${e.message}
` + // } + // } else { + // node = yo`
-
` + // } + // } else { + // node = yo`
${JSON.stringify(details[propertyName], null, 4)}
` + // } + // return yo`
${node || ''}
` + // } getContractProperty (property) { if (!this.selectedContract) throw new Error('No contract compiled yet') @@ -505,6 +507,8 @@ class CompileTab extends ViewPlugin { compileTabLogic={this.compileTabLogic} compiledFileName={this.currentFile} contractsDetails={this.contractsDetails} + setHardHatCompilation={this.setHardHatCompilation} + contractMap={this.contractMap} /> , this.el) } diff --git a/libs/remix-ui/publish-to-storage/src/lib/publish-to-storage.tsx b/libs/remix-ui/publish-to-storage/src/lib/publish-to-storage.tsx index 04cc7f8c3b..f22aeff061 100644 --- a/libs/remix-ui/publish-to-storage/src/lib/publish-to-storage.tsx +++ b/libs/remix-ui/publish-to-storage/src/lib/publish-to-storage.tsx @@ -4,107 +4,81 @@ import { RemixUiPublishToStorageProps } from './types' import { publishToIPFS } from './publishToIPFS' import { publishToSwarm } from './publishOnSwarm' -import './css/publish-to-storage.css' - export const PublishToStorage = (props: RemixUiPublishToStorageProps) => { - const { storage, fileProvider, fileManager, contract } = props + const { storage, fileProvider, fileManager, contract, resetStorage } = props const [state, setState] = useState({ modal: { title: '', message: null, hide: true, - ok: { - label: '', - fn: null - }, - cancel: { - label: '', - fn: null - } + okLabel: '', + okFn: null, + cancelLabel: '', + cancelFn: null } }) useEffect(() => { const storageService = async () => { if ((contract.metadata === undefined || contract.metadata.length === 0)) { - modal('Publish To Storage', 'This contract may be abstract, may not implement an abstract parent\'s methods completely or not invoke an inherited contract\'s constructor correctly.', { - label: 'OK', - fn: () => {} - }, null) + modal('Publish To Storage', 'This contract may be abstract, may not implement an abstract parent\'s methods completely or not invoke an inherited contract\'s constructor correctly.') } else { if (storage === 'swarm') { try { const result = await publishToSwarm(contract, fileManager) - modal(`Published ${contract.name}'s Metadata`, publishMessage(result.uploaded), { - label: 'OK', - fn: () => {} - }, null) + modal(`Published ${contract.name}'s Metadata`, publishMessage(result.uploaded)) // triggered each time there's a new verified publish (means hash correspond) fileProvider.addExternal('swarm/' + result.item.hash, result.item.content) } catch (err) { try { err = JSON.stringify(err) } catch (e) {} - modal(`Swarm Publish Failed`, publishMessageFailed(storage, err), { - label: 'OK', - fn: () => {} - }, null) + modal(`Swarm Publish Failed`, publishMessageFailed(storage, err)) } } else { try { const result = await publishToIPFS(contract, fileManager) - modal(`Published ${contract.name}'s Metadata`, publishMessage(result.uploaded), { - label: 'OK', - fn: () => {} - }, null) + modal(`Published ${contract.name}'s Metadata`, publishMessage(result.uploaded)) // triggered each time there's a new verified publish (means hash correspond) - fileProvider.addExternal('swarm/' + result.item.hash, result.item.content) + fileProvider.addExternal('ipfs/' + result.item.hash, result.item.content) } catch (err) { - modal(`Swarm Publish Failed`, publishMessageFailed(storage, err), { - label: 'OK', - fn: () => {} - }, null) + modal(`IPFS Publish Failed`, publishMessageFailed(storage, err)) + } } } } - } - if (contract) { - storageService() - } -}, [contract]) + if (storage) { + storageService() + } + }, [storage]) - const publishMessage = (uploaded) => { - return ( - Metadata of {contract.name.toLowerCase()} was published successfully.
-
-          
- { uploaded.map((value) => { -
{ value.filename } :
{ value.output.url }
- }) } -
-
-
- ) - } + const publishMessage = (uploaded) => ( + Metadata of {contract.name.toLowerCase()} was published successfully.
+
+        
+ { uploaded.map((value, index) =>
{ value.filename } :
{ value.output.url }
) } +
+
+
+ ) - const publishMessageFailed = (storage, err) => { - return ( - Failed to publish metadata file to { storage }, please check the { storage } gateways is available.
- {err} -
- ) - } + const publishMessageFailed = (storage, err) => ( + Failed to publish metadata file to { storage }, please check the { storage } gateways is available.
+ {err} +
+ ) const handleHideModal = () => { setState(prevState => { return { ...prevState, modal: { ...prevState.modal, hide: true, message: null } } }) + resetStorage() } - const modal = async (title: string, message: string | JSX.Element, ok: { label: string, fn: () => void }, cancel: { label: string, fn: () => void }) => { + const modal = async (title: string, message: string | JSX.Element) => { await setState(prevState => { return { ...prevState, @@ -113,9 +87,6 @@ export const PublishToStorage = (props: RemixUiPublishToStorageProps) => { hide: false, message, title, - ok, - cancel, - handleHide: handleHideModal } } }) @@ -127,8 +98,8 @@ export const PublishToStorage = (props: RemixUiPublishToStorageProps) => { title={ state.modal.title } message={ state.modal.message } hide={ state.modal.hide } - ok={ state.modal.ok } - cancel={ state.modal.cancel } + okLabel='OK' + okFn={() => {}} handleHide={ handleHideModal }> { (typeof state.modal.message !== 'string') && state.modal.message } diff --git a/libs/remix-ui/publish-to-storage/src/lib/publishOnSwarm.tsx b/libs/remix-ui/publish-to-storage/src/lib/publishOnSwarm.tsx index 2521b90ea3..81be4e1662 100644 --- a/libs/remix-ui/publish-to-storage/src/lib/publishOnSwarm.tsx +++ b/libs/remix-ui/publish-to-storage/src/lib/publishOnSwarm.tsx @@ -6,7 +6,7 @@ export const publishToSwarm = async (contract, fileManager) => { // gather list of files to publish const sources = [] let metadata - let item = null + let item = { content: null, hash: null } const uploaded = [] try { @@ -52,8 +52,10 @@ export const publishToSwarm = async (contract, fileManager) => { })) // publish the list of sources in order, fail if any failed - await Promise.all(sources.map((item) => { - swarmVerifiedPublish(item.content, item.hash, (error, result) => { + await Promise.all(sources.map(async (item) => { + try { + const result = await swarmVerifiedPublish(item.content, item.hash) + try { item.hash = result.url.match('bzz-raw://(.+)')[1] } catch (e) { @@ -63,40 +65,45 @@ export const publishToSwarm = async (contract, fileManager) => { uploaded.push(item) // TODO this is a fix cause Solidity metadata does not contain the right swarm hash (poc 0.3) metadata.sources[item.filename].urls[0] = result.url - }) + } catch (error) { + throw new Error(error) + } })) const metadataContent = JSON.stringify(metadata) + try { + const result = await swarmVerifiedPublish(metadataContent, '') - swarmVerifiedPublish(metadataContent, '', (error, result) => { try { contract.metadataHash = result.url.match('bzz-raw://(.+)')[1] } catch (e) { contract.metadataHash = ' - metadata.json' } - if (!error) { - item.content = metadataContent - item.hash = contract.metadataHash - } + item.content = metadataContent + item.hash = contract.metadataHash uploaded.push({ content: contract.metadata, hash: contract.metadataHash, filename: 'metadata.json', output: result }) - }) + } catch (error) { + throw new Error(error) + } return { uploaded, item } } -const swarmVerifiedPublish = (content, expectedHash, cb) => { - swarmgw.put(content, function (err, ret) { - if (err) { - cb(err) - } else if (expectedHash && ret !== expectedHash) { - cb(null, { message: 'hash mismatch between solidity bytecode and uploaded content.', url: 'bzz-raw://' + ret, hash: ret }) - } else { - cb(null, { message: 'ok', url: 'bzz-raw://' + ret, hash: ret }) - } +const swarmVerifiedPublish = async (content, expectedHash): Promise> => { + return new Promise((resolve, reject) => { + swarmgw.put(content, function (err, ret) { + if (err) { + reject(err) + } else if (expectedHash && ret !== expectedHash) { + resolve({ message: 'hash mismatch between solidity bytecode and uploaded content.', url: 'bzz-raw://' + ret, hash: ret }) + } else { + resolve({ message: 'ok', url: 'bzz-raw://' + ret, hash: ret }) + } + }) }) } diff --git a/libs/remix-ui/publish-to-storage/src/lib/publishToIPFS.tsx b/libs/remix-ui/publish-to-storage/src/lib/publishToIPFS.tsx index 6f09279b11..4d5e53c098 100644 --- a/libs/remix-ui/publish-to-storage/src/lib/publishToIPFS.tsx +++ b/libs/remix-ui/publish-to-storage/src/lib/publishToIPFS.tsx @@ -10,7 +10,7 @@ export const publishToIPFS = async (contract, fileManager) => { // gather list of files to publish const sources = [] let metadata - let item = null + let item = { content: null, hash: null } const uploaded = [] try { @@ -55,8 +55,10 @@ export const publishToIPFS = async (contract, fileManager) => { }) })) // publish the list of sources in order, fail if any failed - await Promise.all(sources.map(item => { - ipfsVerifiedPublish(item.content, item.hash, (error, result) => { + await Promise.all(sources.map(async (item) => { + try { + const result = await ipfsVerifiedPublish(item.content, item.hash) + try { item.hash = result.url.match('dweb:/ipfs/(.+)')[1] } catch (e) { @@ -64,41 +66,46 @@ export const publishToIPFS = async (contract, fileManager) => { } item.output = result uploaded.push(item) - }) + } catch (error) { + throw new Error(error) + } })) const metadataContent = JSON.stringify(metadata) - ipfsVerifiedPublish(metadataContent, '', (error, result) => { + try { + const result = await ipfsVerifiedPublish(metadataContent, '') + try { contract.metadataHash = result.url.match('dweb:/ipfs/(.+)')[1] } catch (e) { contract.metadataHash = ' - metadata.json' } - if (!error) { - item.content = metadataContent - item.hash = contract.metadataHash - } + item.content = metadataContent + item.hash = contract.metadataHash uploaded.push({ content: contract.metadata, hash: contract.metadataHash, filename: 'metadata.json', output: result }) - }) + } catch (error) { + throw new Error(error) + } return { uploaded, item } } -const ipfsVerifiedPublish = async (content, expectedHash, cb) => { +const ipfsVerifiedPublish = async (content, expectedHash) => { try { const results = await severalGatewaysPush(content) + if (expectedHash && results !== expectedHash) { - cb(null, { message: 'hash mismatch between solidity bytecode and uploaded content.', url: 'dweb:/ipfs/' + results, hash: results }) + return { message: 'hash mismatch between solidity bytecode and uploaded content.', url: 'dweb:/ipfs/' + results, hash: results } } else { - cb(null, { message: 'ok', url: 'dweb:/ipfs/' + results, hash: results }) + return { message: 'ok', url: 'dweb:/ipfs/' + results, hash: results } } } catch (error) { - cb(error) + throw new Error(error) } } diff --git a/libs/remix-ui/publish-to-storage/src/lib/types/index.ts b/libs/remix-ui/publish-to-storage/src/lib/types/index.ts index db95172c81..928315c621 100644 --- a/libs/remix-ui/publish-to-storage/src/lib/types/index.ts +++ b/libs/remix-ui/publish-to-storage/src/lib/types/index.ts @@ -2,5 +2,6 @@ export interface RemixUiPublishToStorageProps { storage: string, fileProvider: any, fileManager: any, - contract: any + contract: any, + resetStorage: () => void } diff --git a/libs/remix-ui/solidity-compiler/src/lib/compiler-container.tsx b/libs/remix-ui/solidity-compiler/src/lib/compiler-container.tsx index 50c0d325ba..31fad99c8f 100644 --- a/libs/remix-ui/solidity-compiler/src/lib/compiler-container.tsx +++ b/libs/remix-ui/solidity-compiler/src/lib/compiler-container.tsx @@ -7,7 +7,7 @@ import { canUseWorker, baseURLBin, baseURLWasm, urlFromVersion, pathToURL, promi import './css/style.css' export const CompilerContainer = (props: CompilerContainerProps) => { - const { editor, config, queryParams, compileTabLogic, tooltip, modal, compiledFileName } = props // eslint-disable-line + const { editor, config, queryParams, compileTabLogic, tooltip, modal, compiledFileName, setHardHatCompilation } = props // eslint-disable-line const [state, setState] = useState({ hideWarnings: false, autoCompile: false, @@ -28,6 +28,7 @@ export const CompilerContainer = (props: CompilerContainerProps) => { const compileIcon = useRef(null) const warningIcon = useRef(null) const promptMessageInput = useRef(null) + const [hhCompilation, sethhCompilation] = useState(false) useEffect(() => { fetchAllVersion((allversions, selectedVersion, isURL) => { @@ -441,6 +442,13 @@ export const CompilerContainer = (props: CompilerContainerProps) => { }) } + const updatehhCompilation = (event) => { + const checked = event.target.checked + + sethhCompilation(checked) + setHardHatCompilation(checked) + } + return (
@@ -515,6 +523,10 @@ export const CompilerContainer = (props: CompilerContainerProps) => { +
+ + +
} - + ) - - // if (contractList.length) { - // this.selectedContract = selectEl.value - // } else { - // delete this.selectedContract - // } - // return result - - // return () } export default ContractSelection diff --git a/libs/remix-ui/solidity-compiler/src/lib/solidity-compiler.tsx b/libs/remix-ui/solidity-compiler/src/lib/solidity-compiler.tsx index ea82b23352..60e22f3c39 100644 --- a/libs/remix-ui/solidity-compiler/src/lib/solidity-compiler.tsx +++ b/libs/remix-ui/solidity-compiler/src/lib/solidity-compiler.tsx @@ -8,7 +8,7 @@ import { ModalDialog } from '@remix-ui/modal-dialog' // eslint-disable-line import './css/style.css' export const SolidityCompiler = (props: SolidityCompilerProps) => { - const { editor, config, queryParams, plugin, compileTabLogic, compiledFileName, fileProvider, fileManager, contractsDetails } = props + const { editor, config, queryParams, plugin, compileTabLogic, compiledFileName, fileProvider, fileManager, contractsDetails, setHardHatCompilation, contractMap } = props const [state, setState] = useState({ contractsDetails: {}, eventHandlers: {}, @@ -65,8 +65,8 @@ export const SolidityCompiler = (props: SolidityCompilerProps) => { return ( <>
- - + +
diff --git a/libs/remix-ui/solidity-compiler/src/lib/types/index.ts b/libs/remix-ui/solidity-compiler/src/lib/types/index.ts index 8dba36f4bd..fd9a30adcc 100644 --- a/libs/remix-ui/solidity-compiler/src/lib/types/index.ts +++ b/libs/remix-ui/solidity-compiler/src/lib/types/index.ts @@ -9,7 +9,11 @@ export interface SolidityCompilerProps { queryParams: any, compileTabLogic: any, compiledFileName: string, - contractsDetails: Record + contractsDetails: Record, + setHardHatCompilation: (value: boolean) => void, + contractMap: { + file: string + } | Record } export interface CompilerContainerProps { @@ -19,12 +23,15 @@ export interface CompilerContainerProps { compileTabLogic: any, tooltip: (message: string) => void, modal: (title: string, message: string | JSX.Element, okLabel: string, okFn: () => void, cancelLabel?: string, cancelFn?: () => void) => void, - compiledFileName: string + compiledFileName: string, + setHardHatCompilation: (value: boolean) => void } export interface ContractSelectionProps { contractMap: { file: string } | Record, fileManager: any, - fileProvider: any + fileProvider: any, + modal: (title: string, message: string | JSX.Element, okLabel: string, okFn: () => void, cancelLabel?: string, cancelFn?: () => void) => void, + contractsDetails: Record } From b87c141ac77f11d21f05b0e1b8831e8e186885a7 Mon Sep 17 00:00:00 2001 From: ioedeveloper Date: Sat, 26 Jun 2021 12:35:24 +0100 Subject: [PATCH 08/32] change copy to clipboard library --- apps/remix-ide/src/app/tabs/compile-tab.js | 2 +- .../remix-ide/src/app/ui/copy-to-clipboard.js | 2 +- .../copy-to-clipboard/copy-to-clipboard.tsx | 13 ++++++------- .../src/lib/contract-selection.tsx | 2 +- package-lock.json | 19 ++++++++++++++----- package.json | 2 +- 6 files changed, 24 insertions(+), 16 deletions(-) diff --git a/apps/remix-ide/src/app/tabs/compile-tab.js b/apps/remix-ide/src/app/tabs/compile-tab.js index 775b251872..0b73843de7 100644 --- a/apps/remix-ide/src/app/tabs/compile-tab.js +++ b/apps/remix-ide/src/app/tabs/compile-tab.js @@ -11,7 +11,7 @@ import { compile } from '@remix-project/remix-solidity' const EventEmitter = require('events') const $ = require('jquery') const yo = require('yo-yo') -const copy = require('copy-text-to-clipboard') +const copy = require('copy-to-clipboard') var QueryParams = require('../../lib/query-params') const modalDialogCustom = require('../ui/modal-dialog-custom') const parseContracts = require('./compileTab/contractParser') diff --git a/apps/remix-ide/src/app/ui/copy-to-clipboard.js b/apps/remix-ide/src/app/ui/copy-to-clipboard.js index 9974cc5782..26c96b0d2f 100644 --- a/apps/remix-ide/src/app/ui/copy-to-clipboard.js +++ b/apps/remix-ide/src/app/ui/copy-to-clipboard.js @@ -1,6 +1,6 @@ var yo = require('yo-yo') // -------------- copyToClipboard ---------------------- -const copy = require('copy-text-to-clipboard') +const copy = require('copy-to-clipboard') var addTooltip = require('./tooltip') // -------------- styling ---------------------- var csjs = require('csjs-inject') diff --git a/libs/remix-ui/clipboard/src/lib/copy-to-clipboard/copy-to-clipboard.tsx b/libs/remix-ui/clipboard/src/lib/copy-to-clipboard/copy-to-clipboard.tsx index fbfdc6dfba..1f1a54d946 100644 --- a/libs/remix-ui/clipboard/src/lib/copy-to-clipboard/copy-to-clipboard.tsx +++ b/libs/remix-ui/clipboard/src/lib/copy-to-clipboard/copy-to-clipboard.tsx @@ -1,27 +1,26 @@ import React, { useState } from 'react' -import copy from 'copy-text-to-clipboard' +import copy from 'copy-to-clipboard' import { OverlayTrigger, Tooltip } from 'react-bootstrap' import './copy-to-clipboard.css' -export const CopyToClipboard = ({ content, tip='Copy', icon='fa-copy', ...otherProps }) => { +export const CopyToClipboard = ({ content, tip = 'Copy', icon = 'fa-copy', direction = 'right', ...otherProps }) => { const [message, setMessage] = useState(tip) - - const handleClick = (event) => { + const handleClick = (e) => { if (content && content !== '') { // module `copy` keeps last copied thing in the memory, so don't show tooltip if nothing is copied, because nothing was added to memory try { if (typeof content !== 'string') { content = JSON.stringify(content, null, '\t') } + copy(content) + setMessage('Copied') } catch (e) { console.error(e) } - copy(content) - setMessage('Copied') } else { setMessage('Cannot copy empty content!') } - event.preventDefault() + e.preventDefault() return false } diff --git a/libs/remix-ui/solidity-compiler/src/lib/contract-selection.tsx b/libs/remix-ui/solidity-compiler/src/lib/contract-selection.tsx index 7bebc389d8..75342f0556 100644 --- a/libs/remix-ui/solidity-compiler/src/lib/contract-selection.tsx +++ b/libs/remix-ui/solidity-compiler/src/lib/contract-selection.tsx @@ -165,7 +165,7 @@ export const ContractSelection = (props: ContractSelectionProps) => { const log =
{ Object.keys(contractProperties).map((propertyName, index) => { - const copyDetails = + const copyDetails = const questionMark = return (
diff --git a/package-lock.json b/package-lock.json index d64633e8c9..d5f2e4d0ef 100644 --- a/package-lock.json +++ b/package-lock.json @@ -13241,11 +13241,14 @@ "is-plain-object": "^2.0.1" } }, - "copy-text-to-clipboard": { - "version": "1.0.4", - "resolved": "https://registry.npmjs.org/copy-text-to-clipboard/-/copy-text-to-clipboard-1.0.4.tgz", - "integrity": "sha512-4hDE+0bgqm4G/nXnt91CP3rc0vOptaePPU5WfVZuhv2AYNJogdLHR4pF1XPgXDAGY4QCzj9pD7zKATa+50sQPg==", - "dev": true + "copy-to-clipboard": { + "version": "3.3.1", + "resolved": "https://registry.npmjs.org/copy-to-clipboard/-/copy-to-clipboard-3.3.1.tgz", + "integrity": "sha512-i13qo6kIHTTpCm8/Wup+0b1mVWETvu2kIMzKoK8FpkLkFxlt0znUAHcMzox+T8sPlqtZXq3CulEjQHsYiGFJUw==", + "dev": true, + "requires": { + "toggle-selection": "^1.0.6" + } }, "copy-webpack-plugin": { "version": "5.1.1", @@ -37174,6 +37177,12 @@ "through2": "^2.0.3" } }, + "toggle-selection": { + "version": "1.0.6", + "resolved": "https://registry.npmjs.org/toggle-selection/-/toggle-selection-1.0.6.tgz", + "integrity": "sha1-bkWxJj8gF/oKzH2J14sVuL932jI=", + "dev": true + }, "toidentifier": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/toidentifier/-/toidentifier-1.0.0.tgz", diff --git a/package.json b/package.json index 25151f7882..9d0ff5be06 100644 --- a/package.json +++ b/package.json @@ -233,7 +233,7 @@ "browserify": "^16.2.3", "browserify-reload": "^1.0.3", "component-type": "^1.2.1", - "copy-text-to-clipboard": "^1.0.4", + "copy-to-clipboard": "^3.3.1", "csjs-inject": "^1.0.1", "csslint": "^1.0.2", "cypress": "^4.1.0", From d2ad317b8930af366612bd291101d25671f90314 Mon Sep 17 00:00:00 2001 From: ioedeveloper Date: Mon, 28 Jun 2021 17:48:25 +0100 Subject: [PATCH 09/32] Copy abi and bytecode. --- .../copy-to-clipboard/copy-to-clipboard.tsx | 21 ++++++-- .../src/lib/contract-selection.tsx | 48 ++++++++++--------- 2 files changed, 43 insertions(+), 26 deletions(-) diff --git a/libs/remix-ui/clipboard/src/lib/copy-to-clipboard/copy-to-clipboard.tsx b/libs/remix-ui/clipboard/src/lib/copy-to-clipboard/copy-to-clipboard.tsx index 1f1a54d946..775f68b0d9 100644 --- a/libs/remix-ui/clipboard/src/lib/copy-to-clipboard/copy-to-clipboard.tsx +++ b/libs/remix-ui/clipboard/src/lib/copy-to-clipboard/copy-to-clipboard.tsx @@ -1,10 +1,21 @@ import React, { useState } from 'react' import copy from 'copy-to-clipboard' import { OverlayTrigger, Tooltip } from 'react-bootstrap' +import { Placement } from 'react-bootstrap/esm/Overlay' import './copy-to-clipboard.css' -export const CopyToClipboard = ({ content, tip = 'Copy', icon = 'fa-copy', direction = 'right', ...otherProps }) => { +interface ICopyToClipboard { + content: any, + tip?: string, + icon?: string, + direction?: Placement, + className?: string, + title?: string, + children?: JSX.Element +} +export const CopyToClipboard = (props: ICopyToClipboard) => { + let { content, tip = 'Copy', icon = 'fa-copy', direction = 'right', children, ...otherProps } = props const [message, setMessage] = useState(tip) const handleClick = (e) => { if (content && content !== '') { // module `copy` keeps last copied thing in the memory, so don't show tooltip if nothing is copied, because nothing was added to memory @@ -35,9 +46,11 @@ export const CopyToClipboard = ({ content, tip = 'Copy', icon = 'fa-copy', direc { message } }> - + { + children || () + } ) diff --git a/libs/remix-ui/solidity-compiler/src/lib/contract-selection.tsx b/libs/remix-ui/solidity-compiler/src/lib/contract-selection.tsx index 75342f0556..eb13797beb 100644 --- a/libs/remix-ui/solidity-compiler/src/lib/contract-selection.tsx +++ b/libs/remix-ui/solidity-compiler/src/lib/contract-selection.tsx @@ -42,23 +42,23 @@ export const ContractSelection = (props: ContractSelectionProps) => { } const copyABI = () => { - copyContractProperty('abi') + return copyContractProperty('abi') } const copyContractProperty = (property) => { let content = getContractProperty(property) - // if (!content) { - // addTooltip('No content available for ' + property) - // return - // } - - // try { - // if (typeof content !== 'string') { - // content = JSON.stringify(content, null, '\t') - // } - // } catch (e) {} - - // copy(content) + if (!content) { + // addTooltip('No content available for ' + property) + return + } + + try { + if (typeof content !== 'string') { + content = JSON.stringify(content, null, '\t') + } + } catch (e) {} + + return content // addTooltip('Copied value to clipboard') } @@ -180,7 +180,7 @@ export const ContractSelection = (props: ContractSelectionProps) => { } const copyBytecode = () => { - copyContractProperty('bytecode') + return copyContractProperty('bytecode') } return ( @@ -211,14 +211,18 @@ export const ContractSelection = (props: ContractSelectionProps) => {
- - + + + + + +
From 6302aed4eaad14f54f0b5287b9e57c39887b3386 Mon Sep 17 00:00:00 2001 From: ioedeveloper Date: Mon, 28 Jun 2021 23:11:31 +0100 Subject: [PATCH 10/32] Display compilation erros --- apps/remix-ide/src/app/tabs/compile-tab.js | 227 +----------------- libs/remix-ui/renderer/src/lib/renderer.tsx | 7 +- .../src/lib/compiler-container.tsx | 5 +- .../src/lib/solidity-compiler.tsx | 38 ++- .../solidity-compiler/src/lib/types/index.ts | 4 +- 5 files changed, 48 insertions(+), 233 deletions(-) diff --git a/apps/remix-ide/src/app/tabs/compile-tab.js b/apps/remix-ide/src/app/tabs/compile-tab.js index 0b73843de7..f989ece451 100644 --- a/apps/remix-ide/src/app/tabs/compile-tab.js +++ b/apps/remix-ide/src/app/tabs/compile-tab.js @@ -3,7 +3,6 @@ import React from 'react' // eslint-disable-line import ReactDOM from 'react-dom' import { SolidityCompiler, CompileTab as CompileTabLogic } from '@remix-ui/solidity-compiler' // eslint-disable-line import { ViewPlugin } from '@remixproject/engine-web' -import { Renderer } from '@remix-ui/renderer' import * as packageJson from '../../../../../package.json' import publishToStorage from '../../publishToStorage' import { compile } from '@remix-project/remix-solidity' @@ -11,17 +10,11 @@ import { compile } from '@remix-project/remix-solidity' const EventEmitter = require('events') const $ = require('jquery') const yo = require('yo-yo') -const copy = require('copy-to-clipboard') var QueryParams = require('../../lib/query-params') -const modalDialogCustom = require('../ui/modal-dialog-custom') const parseContracts = require('./compileTab/contractParser') const addTooltip = require('../ui/tooltip') -// const Renderer = require('../ui/renderer') const globalRegistry = require('../../global/registry') -var css = require('./styles/compile-tab-styles') -// const CompilerContainer = require('./compileTab/compilerContainer.js') - const profile = { name: 'solidity', displayName: 'Solidity compiler', @@ -80,12 +73,8 @@ class CompileTab extends ViewPlugin { } resetResults () { - if (this._view.errorContainer) { - this._view.errorContainer.innerHTML = '' - } this.currentFile = '' this.contractsDetails = {} - yo.update(this._view.contractSelection, this.contractSelection()) this.emit('statusChanged', { key: 'none' }) this.renderComponent() } @@ -120,9 +109,6 @@ class CompileTab extends ViewPlugin { this.compiler.event.register('compilerLoaded', this.data.eventHandlers.onCompilerLoaded) this.data.eventHandlers.onStartingCompilation = () => { - if (this._view.errorContainer) { - this._view.errorContainer.innerHTML = '' - } this.emit('statusChanged', { key: 'loading', title: 'compiling...', type: 'info' }) } @@ -148,7 +134,7 @@ class CompileTab extends ViewPlugin { this.fileManager.events.on('noFileSelected', this.data.eventHandlers.onNoFileSelected) this.data.eventHandlers.onCompilationFinished = (success, data, source) => { - // this._view.errorContainer.appendChild(yo``) + this.compileErrors = data if (success) { // forwarding the event to the appManager infra this.emit('compilationFinished', source.target, source, 'soljson', data) @@ -175,35 +161,6 @@ class CompileTab extends ViewPlugin { // Update contract Selection this.contractMap = {} if (success) this.compiler.visitContracts((contract) => { this.contractMap[contract.name] = contract }) - // const contractSelection = this.contractSelection(contractMap) - // yo.update(this._view.contractSelection, contractSelection) - - if (data.error) { - // this.renderer.error( - // data.error.formattedMessage || data.error, - // this._view.errorContainer, - // { type: data.error.severity || 'error', errorType: data.error.type } - // ) - if (data.error.mode === 'panic') { - return modalDialogCustom.alert(yo` -
- The compiler returned with the following internal error:
${data.error.formattedMessage}.
- The compiler might be in a non-sane state, please be careful and do not use further compilation data to deploy to mainnet. - It is heavily recommended to use another browser not affected by this issue (Firefox is known to not be affected).

- Please join remix gitter channel for more information.
`) - } - } - if (data.errors && data.errors.length) { - data.errors.forEach((err) => { - if (this.config.get('hideWarnings')) { - if (err.severity !== 'warning') { - // this.renderer.error(err.formattedMessage, this._view.errorContainer, { type: err.severity, errorType: err.type }) - } - } else { - // this.renderer.error(err.formattedMessage, this._view.errorContainer, { type: err.severity, errorType: err.type }) - } - }) - } this.renderComponent() } this.compiler.event.register('compilationFinished', this.data.eventHandlers.onCompilationFinished) @@ -259,11 +216,6 @@ class CompileTab extends ViewPlugin { return res } - // This function is used for passing the compiler remix-tests - getCurrentVersion () { - return this.compilerContainer.data.selectedVersion - } - // This function is used for passing the compiler configuration to 'remix-tests' getCurrentCompilerConfig () { return { @@ -296,82 +248,6 @@ class CompileTab extends ViewPlugin { }) } - /********* - * SUB-COMPONENTS - */ - - /** - * Section to select the compiled contract - * @param {string[]} contractList Names of the compiled contracts - */ - // contractSelection (contractMap) { - // // Return the file name of a path: ex "browser/ballot.sol" -> "ballot.sol" - // const getFileName = (path) => { - // const part = path.split('/') - // return part[part.length - 1] - // } - // const contractList = contractMap ? Object.keys(contractMap).map((key) => ({ - // name: key, - // file: getFileName(contractMap[key].file) - // })) : [] - // const selectEl = yo` - // - // ` - // // define swarm logo - - // const result = contractList.length - // ? yo`
- // - //
- // - // ${selectEl} - //
- //
- // - // - // - // - //
- //
- //
- // - // - //
- //
- //
- //
- //
` - // : yo`
- // No Contract Compiled Yet - //
` - - // if (contractList.length) { - // this.selectedContract = selectEl.value - // } else { - // delete this.selectedContract - // } - // return result - // } - // TODO : Add success alert when compilation succeed contractCompiledSuccess () { return yo`
` @@ -390,105 +266,6 @@ class CompileTab extends ViewPlugin { this.selectedContract = contractName } - // details () { - // const help = { - // Assembly: 'Assembly opcodes describing the contract including corresponding solidity source code', - // Opcodes: 'Assembly opcodes describing the contract', - // 'Runtime Bytecode': 'Bytecode storing the state and being executed during normal contract call', - // bytecode: 'Bytecode being executed during contract creation', - // functionHashes: 'List of declared function and their corresponding hash', - // gasEstimates: 'Gas estimation for each function call', - // metadata: 'Contains all informations related to the compilation', - // metadataHash: 'Hash representing all metadata information', - // abi: 'ABI: describing all the functions (input/output params, scope, ...)', - // name: 'Name of the compiled contract', - // swarmLocation: 'Swarm url where all metadata information can be found (contract needs to be published first)', - // web3Deploy: 'Copy/paste this code to any JavaScript/Web3 console to deploy this contract' - // } - // if (!this.selectedContract) throw new Error('No contract compiled yet') - // const contractProperties = this.contractsDetails[this.selectedContract] - // const log = yo`
` - // Object.keys(contractProperties).map(propertyName => { - // const copyDetails = yo`${copyToClipboard(() => contractProperties[propertyName])}` - // const questionMark = yo`` - // log.appendChild(yo`
- //
${propertyName} ${copyDetails} ${questionMark}
- // ${this.insertValue(contractProperties, propertyName)} - //
`) - // }) - // modalDialog(this.selectedContract, log, { label: '' }, { label: 'Close' }) - // } - - // insertValue (details, propertyName) { - // var node - // if (propertyName === 'web3Deploy' || propertyName === 'name' || propertyName === 'Assembly') { - // node = yo`
${details[propertyName]}
` - // } else if (propertyName === 'abi' || propertyName === 'metadata') { - // const treeView = new TreeView({ - // extractData: function (item, parent, key) { - // var ret = {} - // if (item instanceof Array) { - // ret.children = item.map((item, index) => ({ key: index, value: item })) - // ret.self = '' - // } else if (item instanceof Object) { - // ret.children = Object.keys(item).map((key) => ({ key: key, value: item[key] })) - // ret.self = '' - // } else { - // ret.self = item - // ret.children = [] - // } - // return ret - // } - // }) - // if (details[propertyName] !== '') { - // try { - // node = yo` - //
- // ${treeView.render(typeof details[propertyName] === 'object' ? details[propertyName] : JSON.parse(details[propertyName]))} - //
` // catch in case the parsing fails. - // } catch (e) { - // node = yo`
Unable to display "${propertyName}": ${e.message}
` - // } - // } else { - // node = yo`
-
` - // } - // } else { - // node = yo`
${JSON.stringify(details[propertyName], null, 4)}
` - // } - // return yo`
${node || ''}
` - // } - - getContractProperty (property) { - if (!this.selectedContract) throw new Error('No contract compiled yet') - const contractProperties = this.contractsDetails[this.selectedContract] - return contractProperties[property] || null - } - - copyContractProperty (property) { - let content = this.getContractProperty(property) - if (!content) { - addTooltip('No content available for ' + property) - return - } - - try { - if (typeof content !== 'string') { - content = JSON.stringify(content, null, '\t') - } - } catch (e) {} - - copy(content) - addTooltip('Copied value to clipboard') - } - - copyABI () { - this.copyContractProperty('abi') - } - - copyBytecode () { - this.copyContractProperty('bytecode') - } - render () { this.renderComponent() return this.el @@ -509,6 +286,7 @@ class CompileTab extends ViewPlugin { contractsDetails={this.contractsDetails} setHardHatCompilation={this.setHardHatCompilation} contractMap={this.contractMap} + compileErrors={this.compileErrors || {}} /> , this.el) } @@ -534,7 +312,6 @@ class CompileTab extends ViewPlugin { } onDeactivation () { - this.compilerContainer.deactivate() this.editor.event.unregister('contentChanged', this.data.eventHandlers.onContentChanged) this.compiler.event.unregister('loadingCompiler', this.data.eventHandlers.onLoadingCompiler) this.compiler.event.unregister('compilerLoaded', this.data.eventHandlers.onCompilerLoaded) diff --git a/libs/remix-ui/renderer/src/lib/renderer.tsx b/libs/remix-ui/renderer/src/lib/renderer.tsx index b00a979bc5..4b0de1e452 100644 --- a/libs/remix-ui/renderer/src/lib/renderer.tsx +++ b/libs/remix-ui/renderer/src/lib/renderer.tsx @@ -3,11 +3,12 @@ import React from 'react' //eslint-disable-line interface RendererProps { message: any; opt: any, - warningErrors: any editor: any } export const Renderer = ({ message, opt, editor }: RendererProps) => { + console.log('message: ', message) + console.log('opt: ', opt) const getPositionDetails = (msg: any) => { const result = { } as Record @@ -50,8 +51,8 @@ export const Renderer = ({ message, opt, editor }: RendererProps) => { handlePointToErrorOnClick(opt.location, opt.fileName)}> {opt.name} - { opt.item.warning } - {opt.item.more + { opt.item && opt.item.warning } + { opt.item && opt.item.more ? more : } diff --git a/libs/remix-ui/solidity-compiler/src/lib/compiler-container.tsx b/libs/remix-ui/solidity-compiler/src/lib/compiler-container.tsx index 31fad99c8f..46b2021b14 100644 --- a/libs/remix-ui/solidity-compiler/src/lib/compiler-container.tsx +++ b/libs/remix-ui/solidity-compiler/src/lib/compiler-container.tsx @@ -7,7 +7,7 @@ import { canUseWorker, baseURLBin, baseURLWasm, urlFromVersion, pathToURL, promi import './css/style.css' export const CompilerContainer = (props: CompilerContainerProps) => { - const { editor, config, queryParams, compileTabLogic, tooltip, modal, compiledFileName, setHardHatCompilation } = props // eslint-disable-line + const { editor, config, queryParams, compileTabLogic, tooltip, modal, compiledFileName, setHardHatCompilation, updateCurrentVersion } = props // eslint-disable-line const [state, setState] = useState({ hideWarnings: false, autoCompile: false, @@ -40,6 +40,7 @@ export const CompilerContainer = (props: CompilerContainerProps) => { setState(prevState => { return { ...prevState, selectedVersion } }) + updateCurrentVersion(selectedVersion) _updateVersionSelector() } }) @@ -279,6 +280,7 @@ export const CompilerContainer = (props: CompilerContainerProps) => { setState(prevState => { return { ...prevState, selectedVersion } }) + updateCurrentVersion(selectedVersion) } queryParams.update({ version: selectedVersion }) let url @@ -288,6 +290,7 @@ export const CompilerContainer = (props: CompilerContainerProps) => { setState(prevState => { return { ...prevState, selectedVersion, customVersions: [...state.customVersions, selectedVersion] } }) + updateCurrentVersion(selectedVersion) url = customUrl queryParams.update({ version: selectedVersion }) } else if (selectedVersion === 'builtin') { diff --git a/libs/remix-ui/solidity-compiler/src/lib/solidity-compiler.tsx b/libs/remix-ui/solidity-compiler/src/lib/solidity-compiler.tsx index 60e22f3c39..583f2ca3c6 100644 --- a/libs/remix-ui/solidity-compiler/src/lib/solidity-compiler.tsx +++ b/libs/remix-ui/solidity-compiler/src/lib/solidity-compiler.tsx @@ -4,11 +4,12 @@ import { CompilerContainer } from './compiler-container' // eslint-disable-line import { ContractSelection } from './contract-selection' import { Toaster } from '@remix-ui/toaster' // eslint-disable-line import { ModalDialog } from '@remix-ui/modal-dialog' // eslint-disable-line +import { Renderer } from '@remix-ui/renderer' import './css/style.css' export const SolidityCompiler = (props: SolidityCompilerProps) => { - const { editor, config, queryParams, plugin, compileTabLogic, compiledFileName, fileProvider, fileManager, contractsDetails, setHardHatCompilation, contractMap } = props + const { editor, config, queryParams, plugin, compileTabLogic, compiledFileName, fileProvider, fileManager, contractsDetails, setHardHatCompilation, contractMap, compileErrors } = props const [state, setState] = useState({ contractsDetails: {}, eventHandlers: {}, @@ -27,6 +28,10 @@ export const SolidityCompiler = (props: SolidityCompilerProps) => { handleHide: null } }) + useEffect(() => { + console.log('compileErrors: ', compileErrors) + }, [compileErrors]) + const [currentVersion, setCurrentVersion] = useState('') const toast = (message: string) => { setState(prevState => { @@ -38,6 +43,10 @@ export const SolidityCompiler = (props: SolidityCompilerProps) => { plugin.call('editor', 'clearAnnotations') } + const updateCurrentVersion = (value) => { + setCurrentVersion(value) + } + const modal = async (title: string, message: string | JSX.Element, okLabel: string, okFn: () => void, cancelLabel?: string, cancelFn?: () => void) => { await setState(prevState => { return { @@ -62,12 +71,35 @@ export const SolidityCompiler = (props: SolidityCompilerProps) => { }) } + const panicMessage = (message: string) => ( +
+ + The compiler returned with the following internal error:
{message}.
+ The compiler might be in a non-sane state, please be careful and do not use further compilation data to deploy to mainnet. + It is heavily recommended to use another browser not affected by this issue (Firefox is known to not be affected).

+ Please join remix gitter channel for more information. +
+ ) + return ( <>
- + -
+
+ + { compileErrors.error && } + { compileErrors.error && (compileErrors.error.mode === 'panic') && modal('Error', panicMessage(compileErrors.error.formattedMessage), 'Close', null) } + { compileErrors.errors && compileErrors.errors.length && compileErrors.errors.map((err) => { + if (config.get('hideWarnings')) { + if (err.severity !== 'warning') { + return + } + } else { + return + } + }) } +
+ compileErrors: any } export interface CompilerContainerProps { @@ -24,7 +25,8 @@ export interface CompilerContainerProps { tooltip: (message: string) => void, modal: (title: string, message: string | JSX.Element, okLabel: string, okFn: () => void, cancelLabel?: string, cancelFn?: () => void) => void, compiledFileName: string, - setHardHatCompilation: (value: boolean) => void + setHardHatCompilation: (value: boolean) => void, + updateCurrentVersion: any } export interface ContractSelectionProps { contractMap: { From 9ae6ac18151c2d1e62d28345faf52ccf92a2d007 Mon Sep 17 00:00:00 2001 From: ioedeveloper Date: Tue, 29 Jun 2021 11:35:46 +0100 Subject: [PATCH 11/32] Completed error rendering --- libs/remix-ui/renderer/src/lib/renderer.css | 47 +++++++ libs/remix-ui/renderer/src/lib/renderer.tsx | 122 ++++++++++++------ .../src/lib/solidity-compiler.tsx | 9 +- 3 files changed, 131 insertions(+), 47 deletions(-) diff --git a/libs/remix-ui/renderer/src/lib/renderer.css b/libs/remix-ui/renderer/src/lib/renderer.css index e69de29bb2..67e6d5b82f 100644 --- a/libs/remix-ui/renderer/src/lib/renderer.css +++ b/libs/remix-ui/renderer/src/lib/renderer.css @@ -0,0 +1,47 @@ +.remixui_sol.success, +.remixui_sol.error, +.remixui_sol.warning { + white-space: pre-line; + word-wrap: break-word; + cursor: pointer; + position: relative; + margin: 0.5em 0 1em 0; + border-radius: 5px; + line-height: 20px; + padding: 8px 15px; +} + +.remixui_sol.success pre, +.remixui_sol.error pre, +.remixui_sol.warning pre { + white-space: pre-line; + overflow-y: hidden; + background-color: transparent; + margin: 0; + font-size: 12px; + border: 0 none; + padding: 0; + border-radius: 0; +} + +.remixui_sol.success .close, +.remixui_sol.error .close, +.remixui_sol.warning .close { + white-space: pre-line; + font-weight: bold; + position: absolute; + color: hsl(0, 0%, 0%); /* black in style-guide.js */ + top: 0; + right: 0; + padding: 0.5em; +} + +.remixui_sol.error { +} + +.remixui_sol.warning { +} + +.remixui_sol.success { + /* background-color: // styles.rightPanel.message_Success_BackgroundColor; */ +} diff --git a/libs/remix-ui/renderer/src/lib/renderer.tsx b/libs/remix-ui/renderer/src/lib/renderer.tsx index 4b0de1e452..62426e6235 100644 --- a/libs/remix-ui/renderer/src/lib/renderer.tsx +++ b/libs/remix-ui/renderer/src/lib/renderer.tsx @@ -1,14 +1,61 @@ -import React from 'react' //eslint-disable-line - +import React, { useEffect, useState } from 'react' //eslint-disable-line +import './renderer.css' interface RendererProps { message: any; - opt: any, - editor: any + opt?: any, + plugin: any, + config: any } -export const Renderer = ({ message, opt, editor }: RendererProps) => { - console.log('message: ', message) - console.log('opt: ', opt) +export const Renderer = ({ message, opt = {}, plugin, config }: RendererProps) => { + const [messageText, setMessageText] = useState(null) + const [editorOptions, setEditorOptions] = useState({ + useSpan: false, + type: '' + }) + const [classList] = useState(opt.type === 'error' ? 'alert alert-danger' : 'alert alert-warning') + const [close, setClose] = useState(false) + + useEffect(() => { + if (!message) return + let text + + if (typeof message === 'string') { + text = message + } else if (message.innerText) { + text = message.innerText + } + + // ^ e.g: + // browser/gm.sol: Warning: Source file does not specify required compiler version! Consider adding "pragma solidity ^0.6.12 + // https://github.com/OpenZeppelin/openzeppelin-contracts/blob/release-v3.2.0/contracts/introspection/IERC1820Registry.sol:3:1: ParserError: Source file requires different compiler version (current compiler is 0.7.4+commit.3f05b770.Emscripten.clang) - note that nightly builds are considered to be strictly less than the released version + let positionDetails = getPositionDetails(text) + const options = opt + + if (!positionDetails.errFile || (opt.errorType && opt.errorType === positionDetails.errFile)) { + // Updated error reported includes '-->' before file details + const errorDetails = text.split('-->') + // errorDetails[1] will have file details + if (errorDetails.length > 1) positionDetails = getPositionDetails(errorDetails[1]) + } + options.errLine = positionDetails.errLine + options.errCol = positionDetails.errCol + options.errFile = positionDetails.errFile.trim() + + if (!opt.noAnnotations && opt.errFile) { + addAnnotation(opt.errFile, { + row: opt.errLine, + column: opt.errCol, + text: text, + type: opt.type + }) + } + + setMessageText(text) + setEditorOptions(options) + setClose(false) + }, [message]) + const getPositionDetails = (msg: any) => { const result = { } as Record @@ -16,49 +63,42 @@ export const Renderer = ({ message, opt, editor }: RendererProps) => { if (!msg.includes(':')) return { errLine: -1, errCol: -1, errFile: msg } // extract line / column - let position = msg.match(/^(.*?):([0-9]*?):([0-9]*?)?/) - result.errLine = position ? parseInt(position[2]) - 1 : -1 - result.errCol = position ? parseInt(position[3]) : -1 + let pos = msg.match(/^(.*?):([0-9]*?):([0-9]*?)?/) + result.errLine = pos ? parseInt(pos[2]) - 1 : -1 + result.errCol = pos ? parseInt(pos[3]) : -1 // extract file - position = msg.match(/^(https:.*?|http:.*?|.*?):/) - result.errFile = position ? position[1] : '' + pos = msg.match(/^(https:.*?|http:.*?|.*?):/) + result.errFile = pos ? pos[1] : '' return result } + const addAnnotation = (file, error) => { + if (file === config.get('currentFile')) { + plugin.call('editor', 'addAnnotation', error, file) + } + } + const handlePointToErrorOnClick = (location, fileName) => { - editor.call('editor', 'discardHighlight') - editor.call('editor', 'highlight', location, fileName) + plugin.call('editor', 'discardHighlight') + plugin.call('editor', 'highlight', location, fileName) } - if (!message) return - let position = getPositionDetails(message) - if (!position.errFile || (opt.errorType && opt.errorType === position.errFile)) { - // Updated error reported includes '-->' before file details - const errorDetails = message.split('-->') - // errorDetails[1] will have file details - if (errorDetails.length > 1) position = getPositionDetails(errorDetails[1]) + const handleClose = () => { + setClose(true) } - opt.errLine = position.errLine - opt.errCol = position.errCol - opt.errFile = position.errFile.trim() - const classList = opt.type === 'error' ? 'alert alert-danger' : 'alert alert-warning' + return ( -
-
-
- -
- handlePointToErrorOnClick(opt.location, opt.fileName)}> - {opt.name} - { opt.item && opt.item.warning } - { opt.item && opt.item.more - ? more - : - } - Pos: {opt.locationString} - -
-
+ <> + { + messageText && !close && ( +
handlePointToErrorOnClick(opt.location, opt.fileName)}> + { editorOptions.useSpan ? { messageText } :
{ messageText }
} +
+ +
+
) + } + ) } diff --git a/libs/remix-ui/solidity-compiler/src/lib/solidity-compiler.tsx b/libs/remix-ui/solidity-compiler/src/lib/solidity-compiler.tsx index 583f2ca3c6..42732f6e83 100644 --- a/libs/remix-ui/solidity-compiler/src/lib/solidity-compiler.tsx +++ b/libs/remix-ui/solidity-compiler/src/lib/solidity-compiler.tsx @@ -28,9 +28,6 @@ export const SolidityCompiler = (props: SolidityCompilerProps) => { handleHide: null } }) - useEffect(() => { - console.log('compileErrors: ', compileErrors) - }, [compileErrors]) const [currentVersion, setCurrentVersion] = useState('') const toast = (message: string) => { @@ -88,15 +85,15 @@ export const SolidityCompiler = (props: SolidityCompilerProps) => {
- { compileErrors.error && } + { compileErrors.error && } { compileErrors.error && (compileErrors.error.mode === 'panic') && modal('Error', panicMessage(compileErrors.error.formattedMessage), 'Close', null) } { compileErrors.errors && compileErrors.errors.length && compileErrors.errors.map((err) => { if (config.get('hideWarnings')) { if (err.severity !== 'warning') { - return + return } } else { - return + return } }) }
From 39788c060c1ab56849234d3b1c6185a53dcdc744 Mon Sep 17 00:00:00 2001 From: ioedeveloper Date: Tue, 29 Jun 2021 11:57:53 +0100 Subject: [PATCH 12/32] Set copy to clipboard direction --- .../clipboard/src/lib/copy-to-clipboard/copy-to-clipboard.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/libs/remix-ui/clipboard/src/lib/copy-to-clipboard/copy-to-clipboard.tsx b/libs/remix-ui/clipboard/src/lib/copy-to-clipboard/copy-to-clipboard.tsx index 775f68b0d9..cea2b0d7a1 100644 --- a/libs/remix-ui/clipboard/src/lib/copy-to-clipboard/copy-to-clipboard.tsx +++ b/libs/remix-ui/clipboard/src/lib/copy-to-clipboard/copy-to-clipboard.tsx @@ -41,7 +41,7 @@ export const CopyToClipboard = (props: ICopyToClipboard) => { return ( - { message } From af8bc1addf91ecffdaf448883358559955e60ec2 Mon Sep 17 00:00:00 2001 From: ioedeveloper Date: Tue, 29 Jun 2021 15:08:43 +0100 Subject: [PATCH 13/32] Fixed auto compile --- apps/remix-ide/src/app/tabs/compile-tab.js | 2 + .../src/lib/compiler-container.tsx | 43 +++++++------------ 2 files changed, 17 insertions(+), 28 deletions(-) diff --git a/apps/remix-ide/src/app/tabs/compile-tab.js b/apps/remix-ide/src/app/tabs/compile-tab.js index f989ece451..a7323d03f2 100644 --- a/apps/remix-ide/src/app/tabs/compile-tab.js +++ b/apps/remix-ide/src/app/tabs/compile-tab.js @@ -312,6 +312,8 @@ class CompileTab extends ViewPlugin { } onDeactivation () { + this.editor.event.unregister('contentChanged') + this.editor.event.unregister('sessionSwitched') this.editor.event.unregister('contentChanged', this.data.eventHandlers.onContentChanged) this.compiler.event.unregister('loadingCompiler', this.data.eventHandlers.onLoadingCompiler) this.compiler.event.unregister('compilerLoaded', this.data.eventHandlers.onCompilerLoaded) diff --git a/libs/remix-ui/solidity-compiler/src/lib/compiler-container.tsx b/libs/remix-ui/solidity-compiler/src/lib/compiler-container.tsx index 46b2021b14..a87cf1b993 100644 --- a/libs/remix-ui/solidity-compiler/src/lib/compiler-container.tsx +++ b/libs/remix-ui/solidity-compiler/src/lib/compiler-container.tsx @@ -44,12 +44,17 @@ export const CompilerContainer = (props: CompilerContainerProps) => { _updateVersionSelector() } }) + const currentFileName = config.get('currentFile') + + currentFile(currentFileName) + listenToEvents() }, []) useEffect(() => { if (compileTabLogic && compileTabLogic.compiler) { compileTabLogic.compiler.event.register('compilerLoaded', compilerLoaded) + console.log(`${config.get('autoCompile') || false}`) setState(prevState => { return { ...prevState, @@ -173,19 +178,6 @@ export const CompilerContainer = (props: CompilerContainerProps) => { return extention.toLowerCase() === 'sol' || extention.toLowerCase() === 'yul' } - const deactivate = () => { - // deactivate editor listeners - editor.event.unregister('contentChanged') - editor.event.unregister('sessionSwitched') - } - - const activate = () => { - const currentFileName = config.get('currentFile') - - currentFile(currentFileName) - listenToEvents() - } - const listenToEvents = () => { editor.event.register('sessionSwitched', () => { if (!compileIcon.current) return @@ -231,7 +223,7 @@ export const CompilerContainer = (props: CompilerContainerProps) => { // _disableCompileBtn(false) compileIcon.current.setAttribute('title', '') compileIcon.current.classList.remove('remixui_spinningIcon') - if (state.autoCompile) compileIfAutoCompileOn() + if (state.autoCompile) compile() }) compileTabLogic.compiler.event.register('compilationFinished', (success, data, source) => { @@ -243,21 +235,16 @@ export const CompilerContainer = (props: CompilerContainerProps) => { } const scheduleCompilation = () => { - if (!state.autoCompile) return + const autoCompile = config.get('autoCompile') + if (!autoCompile) return if (state.compileTimeout) window.clearTimeout(state.compileTimeout) - const compileTimeout = window.setTimeout(() => compileIfAutoCompileOn(), state.timeout) + const compileTimeout = window.setTimeout(() => autoCompile && compile(), state.timeout) setState(prevState => { return { ...prevState, compileTimeout } }) } - const compileIfAutoCompileOn = () => { - if (config.get('autoCompile')) { - compile() - } - } - const compile = () => { const currentFile = config.get('currentFile') @@ -390,7 +377,7 @@ export const CompilerContainer = (props: CompilerContainerProps) => { } else { compileTabLogic.setRuns(200) } - compileIfAutoCompileOn() + state.autoCompile && compile() setState(prevState => { return { ...prevState, optimise: checked } }) @@ -400,7 +387,7 @@ export const CompilerContainer = (props: CompilerContainerProps) => { const runs = e.target.value compileTabLogic.setRuns(parseInt(runs)) - compileIfAutoCompileOn() + state.autoCompile && compile() setState(prevState => { return { ...prevState, runs } }) @@ -410,7 +397,7 @@ export const CompilerContainer = (props: CompilerContainerProps) => { const checked = e.target.checked config.set('hideWarnings', checked) - compileIfAutoCompileOn() + state.autoCompile && compile() setState(prevState => { return { ...prevState, hideWarnings: checked } }) @@ -427,7 +414,7 @@ export const CompilerContainer = (props: CompilerContainerProps) => { const handleLanguageChange = (value) => { compileTabLogic.setLanguage(value) - compileIfAutoCompileOn() + state.autoCompile && compile() setState(prevState => { return { ...prevState, language: value } }) @@ -439,7 +426,7 @@ export const CompilerContainer = (props: CompilerContainerProps) => { v = null } compileTabLogic.setEvmVersion(v) - compileIfAutoCompileOn() + state.autoCompile && compile() setState(prevState => { return { ...prevState, evmVersion: value } }) @@ -533,7 +520,7 @@ export const CompilerContainer = (props: CompilerContainerProps) => { From d6ff40dbbca483fac211bd971bb5cc179bfa7647 Mon Sep 17 00:00:00 2001 From: ioedeveloper Date: Tue, 29 Jun 2021 21:40:22 +0100 Subject: [PATCH 14/32] Enable hardhat compilation --- apps/remix-ide/src/app/tabs/compile-tab.js | 20 ++++++++++--------- .../src/lib/compiler-container.tsx | 14 ++++++------- .../src/lib/contract-selection.tsx | 3 ++- .../src/lib/solidity-compiler.tsx | 10 +++++----- .../solidity-compiler/src/lib/types/index.ts | 6 ++++-- 5 files changed, 29 insertions(+), 24 deletions(-) diff --git a/apps/remix-ide/src/app/tabs/compile-tab.js b/apps/remix-ide/src/app/tabs/compile-tab.js index a7323d03f2..c0dba990bb 100644 --- a/apps/remix-ide/src/app/tabs/compile-tab.js +++ b/apps/remix-ide/src/app/tabs/compile-tab.js @@ -67,6 +67,7 @@ class CompileTab extends ViewPlugin { this.compiler = this.compileTabLogic.compiler this.compileTabLogic.init() this.contractMap = {} + this.isHardHatProject = false this.el = document.createElement('div') this.el.setAttribute('id', 'compileTabView') @@ -84,13 +85,6 @@ class CompileTab extends ViewPlugin { */ listenToEvents () { - this.on('filePanel', 'setWorkspace', (workspace) => { - this.compileTabLogic.isHardhatProject().then((result) => { - if (result && workspace.isLocalhost) this.compilerContainer.hardhatCompilation.style.display = 'flex' - else this.compilerContainer.hardhatCompilation.style.display = 'none' - }) - }) - this.data.eventHandlers.onContentChanged = () => { this.emit('statusChanged', { key: 'edited', title: 'the content has changed, needs recompilation', type: 'info' }) } @@ -116,7 +110,14 @@ class CompileTab extends ViewPlugin { this.call('editor', 'clearAnnotations') } - this.on('filePanel', 'setWorkspace', () => this.resetResults()) + this.on('filePanel', 'setWorkspace', (workspace) => { + this.compileTabLogic.isHardhatProject().then((result) => { + if (result && workspace.isLocalhost) this.isHardHatProject = true + else this.isHardHatProject = false + this.renderComponent() + }) + this.resetResults() + }) this.compileTabLogic.event.on('startingCompilation', this.data.eventHandlers.onStartingCompilation) this.compileTabLogic.event.on('removeAnnotations', this.data.eventHandlers.onRemoveAnnotations) @@ -284,9 +285,10 @@ class CompileTab extends ViewPlugin { compileTabLogic={this.compileTabLogic} compiledFileName={this.currentFile} contractsDetails={this.contractsDetails} - setHardHatCompilation={this.setHardHatCompilation} + setHardHatCompilation={this.setHardHatCompilation.bind(this)} contractMap={this.contractMap} compileErrors={this.compileErrors || {}} + isHardHatProject={this.isHardHatProject} /> , this.el) } diff --git a/libs/remix-ui/solidity-compiler/src/lib/compiler-container.tsx b/libs/remix-ui/solidity-compiler/src/lib/compiler-container.tsx index a87cf1b993..5792dd2bec 100644 --- a/libs/remix-ui/solidity-compiler/src/lib/compiler-container.tsx +++ b/libs/remix-ui/solidity-compiler/src/lib/compiler-container.tsx @@ -7,7 +7,7 @@ import { canUseWorker, baseURLBin, baseURLWasm, urlFromVersion, pathToURL, promi import './css/style.css' export const CompilerContainer = (props: CompilerContainerProps) => { - const { editor, config, queryParams, compileTabLogic, tooltip, modal, compiledFileName, setHardHatCompilation, updateCurrentVersion } = props // eslint-disable-line + const { editor, config, queryParams, compileTabLogic, tooltip, modal, compiledFileName, setHardHatCompilation, updateCurrentVersion, isHardHatProject } = props // eslint-disable-line const [state, setState] = useState({ hideWarnings: false, autoCompile: false, @@ -53,8 +53,6 @@ export const CompilerContainer = (props: CompilerContainerProps) => { useEffect(() => { if (compileTabLogic && compileTabLogic.compiler) { compileTabLogic.compiler.event.register('compilerLoaded', compilerLoaded) - - console.log(`${config.get('autoCompile') || false}`) setState(prevState => { return { ...prevState, @@ -513,10 +511,12 @@ export const CompilerContainer = (props: CompilerContainerProps) => { -
- - -
+ { + isHardHatProject &&
+ + +
+ } handleEvmVersionChange(e.target.value)} className="custom-select" id="evmVersionSelector"> - - - - - - - - - +
@@ -556,7 +563,7 @@ export const CompilerContainer = (props: CompilerContainerProps) => { className="custom-select ml-2 remixui_runs" id="runs" placeholder="200" - defaultValue="200" + value={state.runs} type="number" title="Estimated number of times each opcode of the deployed code will be executed across the life-time of the contract." onChange={(e) => onChangeRuns(e.target.value)} From 241b334c4f8a26984d7751817c15cb6365d88abb Mon Sep 17 00:00:00 2001 From: ioedeveloper Date: Thu, 1 Jul 2021 13:20:53 +0100 Subject: [PATCH 26/32] Fix linting errors --- libs/remix-ui/publish-to-storage/.eslintrc | 30 ++++++----- .../src/lib/publish-to-storage.tsx | 33 ++++++------ .../src/lib/publishOnSwarm.tsx | 2 +- .../src/lib/publishToIPFS.tsx | 2 +- libs/remix-ui/solidity-compiler/.eslintrc | 31 ++++++----- .../src/lib/compiler-container.tsx | 20 +++---- .../src/lib/contract-selection.tsx | 52 +++++++++---------- .../src/lib/logic/compiler-helpers.ts | 4 +- .../src/lib/logic/compiler-utils.ts | 2 +- .../solidity-compiler/src/lib/logic/index.ts | 2 +- .../src/lib/reducers/compiler.ts | 4 +- .../src/lib/solidity-compiler.tsx | 12 ++--- package.json | 4 +- 13 files changed, 100 insertions(+), 98 deletions(-) diff --git a/libs/remix-ui/publish-to-storage/.eslintrc b/libs/remix-ui/publish-to-storage/.eslintrc index 6b65264565..b8666066e9 100644 --- a/libs/remix-ui/publish-to-storage/.eslintrc +++ b/libs/remix-ui/publish-to-storage/.eslintrc @@ -1,16 +1,18 @@ { - "extends": "../../../tsconfig.json", - "compilerOptions": { - "jsx": "react", - "allowJs": true, - "esModuleInterop": true, - "allowSyntheticDefaultImports": true + "env": { + "browser": true, + "es6": true }, - "files": [], - "include": [], - "references": [ - { - "path": "./tsconfig.lib.json" - } - ] -} + "extends": "../../../.eslintrc", + "globals": { + "Atomics": "readonly", + "SharedArrayBuffer": "readonly" + }, + "parserOptions": { + "ecmaVersion": 11, + "sourceType": "module" + }, + "rules": { + "standard/no-callback-literal": "off" + } +} diff --git a/libs/remix-ui/publish-to-storage/src/lib/publish-to-storage.tsx b/libs/remix-ui/publish-to-storage/src/lib/publish-to-storage.tsx index c07e43ab70..de14a65a2f 100644 --- a/libs/remix-ui/publish-to-storage/src/lib/publish-to-storage.tsx +++ b/libs/remix-ui/publish-to-storage/src/lib/publish-to-storage.tsx @@ -1,6 +1,6 @@ import React, { useEffect, useState } from 'react' // eslint-disable-line import { ModalDialog } from '@remix-ui/modal-dialog' // eslint-disable-line -import { RemixUiPublishToStorageProps } from './types' +import { RemixUiPublishToStorageProps } from './types' // eslint-disable-line import { publishToIPFS } from './publishToIPFS' import { publishToSwarm } from './publishOnSwarm' @@ -31,10 +31,11 @@ export const PublishToStorage = (props: RemixUiPublishToStorageProps) => { // triggered each time there's a new verified publish (means hash correspond) fileProvider.addExternal('swarm/' + result.item.hash, result.item.content) } catch (err) { + let parseError = err try { - err = JSON.stringify(err) + parseError = JSON.stringify(err) } catch (e) {} - modal(`Swarm Publish Failed`, publishMessageFailed(storage, err)) + modal('Swarm Publish Failed', publishMessageFailed(storage, parseError)) } } else { try { @@ -44,7 +45,7 @@ export const PublishToStorage = (props: RemixUiPublishToStorageProps) => { // triggered each time there's a new verified publish (means hash correspond) fileProvider.addExternal('ipfs/' + result.item.hash, result.item.content) } catch (err) { - modal(`IPFS Publish Failed`, publishMessageFailed(storage, err)) + modal('IPFS Publish Failed', publishMessageFailed(storage, err)) } } } @@ -67,7 +68,7 @@ export const PublishToStorage = (props: RemixUiPublishToStorageProps) => { const publishMessageFailed = (storage, err) => ( Failed to publish metadata file to { storage }, please check the { storage } gateways is available.
- {err} + {err}
) @@ -86,23 +87,23 @@ export const PublishToStorage = (props: RemixUiPublishToStorageProps) => { ...prevState.modal, hide: false, message, - title, + title } } }) } return ( - {}} - handleHide={ handleHideModal }> - { (typeof state.modal.message !== 'string') && state.modal.message } - + {}} + handleHide={ handleHideModal }> + { (typeof state.modal.message !== 'string') && state.modal.message } + ) } diff --git a/libs/remix-ui/publish-to-storage/src/lib/publishOnSwarm.tsx b/libs/remix-ui/publish-to-storage/src/lib/publishOnSwarm.tsx index 81be4e1662..785d00b895 100644 --- a/libs/remix-ui/publish-to-storage/src/lib/publishOnSwarm.tsx +++ b/libs/remix-ui/publish-to-storage/src/lib/publishOnSwarm.tsx @@ -6,7 +6,7 @@ export const publishToSwarm = async (contract, fileManager) => { // gather list of files to publish const sources = [] let metadata - let item = { content: null, hash: null } + const item = { content: null, hash: null } const uploaded = [] try { diff --git a/libs/remix-ui/publish-to-storage/src/lib/publishToIPFS.tsx b/libs/remix-ui/publish-to-storage/src/lib/publishToIPFS.tsx index 4d5e53c098..60fbb830b5 100644 --- a/libs/remix-ui/publish-to-storage/src/lib/publishToIPFS.tsx +++ b/libs/remix-ui/publish-to-storage/src/lib/publishToIPFS.tsx @@ -10,7 +10,7 @@ export const publishToIPFS = async (contract, fileManager) => { // gather list of files to publish const sources = [] let metadata - let item = { content: null, hash: null } + const item = { content: null, hash: null } const uploaded = [] try { diff --git a/libs/remix-ui/solidity-compiler/.eslintrc b/libs/remix-ui/solidity-compiler/.eslintrc index 6b65264565..dae5c6feeb 100644 --- a/libs/remix-ui/solidity-compiler/.eslintrc +++ b/libs/remix-ui/solidity-compiler/.eslintrc @@ -1,16 +1,19 @@ { - "extends": "../../../tsconfig.json", - "compilerOptions": { - "jsx": "react", - "allowJs": true, - "esModuleInterop": true, - "allowSyntheticDefaultImports": true + "env": { + "browser": true, + "es6": true }, - "files": [], - "include": [], - "references": [ - { - "path": "./tsconfig.lib.json" - } - ] -} + "extends": "../../../.eslintrc", + "globals": { + "Atomics": "readonly", + "SharedArrayBuffer": "readonly" + }, + "parserOptions": { + "ecmaVersion": 11, + "sourceType": "module" + }, + "rules": { + "no-unused-vars": "off", + "@typescript-eslint/no-unused-vars": "error" + } +} diff --git a/libs/remix-ui/solidity-compiler/src/lib/compiler-container.tsx b/libs/remix-ui/solidity-compiler/src/lib/compiler-container.tsx index 37444dce22..9bd0fcb4e4 100644 --- a/libs/remix-ui/solidity-compiler/src/lib/compiler-container.tsx +++ b/libs/remix-ui/solidity-compiler/src/lib/compiler-container.tsx @@ -60,13 +60,13 @@ export const CompilerContainer = (props: CompilerContainerProps) => { const optimize = params.optimize === 'false' ? false : params.optimize === 'true' ? true : null const runs = params.runs const evmVersion = params.evmVersion - + return { ...prevState, hideWarnings: config.get('hideWarnings') || false, autoCompile: config.get('autoCompile') || false, includeNightlies: config.get('includeNightlies') || false, - optimise: (optimize !== null) && (optimize !== undefined) ? optimize : config.get('optimise') || false, + optimise: (optimize !== null) && (optimize !== undefined) ? optimize : config.get('optimise') || false, runs: (runs !== null) && (runs !== 'null') && (runs !== undefined) && (runs !== 'undefined') ? runs : 200, evmVersion: (evmVersion !== null) && (evmVersion !== 'null') && (evmVersion !== undefined) && (evmVersion !== 'undefined') ? evmVersion : 'default' } @@ -100,7 +100,7 @@ export const CompilerContainer = (props: CompilerContainerProps) => { resetCompilerMode()(dispatch) break case 'compilationFinished': - compilationFinished(compilerContainer.compiler.args) + compilationFinished() resetCompilerMode()(dispatch) break } @@ -274,11 +274,11 @@ export const CompilerContainer = (props: CompilerContainerProps) => { if (state.autoCompile) compile() } - const compilationFinished = ({ success, data, source }) => { - if (!compileIcon.current) return - compileIcon.current.setAttribute('title', 'idle') - compileIcon.current.classList.remove('remixui_spinningIcon') - compileIcon.current.classList.remove('remixui_bouncingIcon') + const compilationFinished = () => { + if (!compileIcon.current) return + compileIcon.current.setAttribute('title', 'idle') + compileIcon.current.classList.remove('remixui_spinningIcon') + compileIcon.current.classList.remove('remixui_bouncingIcon') } const scheduleCompilation = () => { @@ -490,7 +490,7 @@ export const CompilerContainer = (props: CompilerContainerProps) => { setHardHatCompilation(checked) } - /* + /* The following functions map with the above event handlers. They are an external API for modifying the compiler configuration. */ @@ -514,7 +514,7 @@ export const CompilerContainer = (props: CompilerContainerProps) => {
- diff --git a/libs/remix-ui/solidity-compiler/src/lib/logic/compiler-helpers.ts b/libs/remix-ui/solidity-compiler/src/lib/logic/compiler-helpers.ts index c052f19cbe..64c56bd7a5 100644 --- a/libs/remix-ui/solidity-compiler/src/lib/logic/compiler-helpers.ts +++ b/libs/remix-ui/solidity-compiler/src/lib/logic/compiler-helpers.ts @@ -4,7 +4,7 @@ import { Compiler } from '@remix-project/remix-solidity' import { CompilerAbstract } from './compiler-abstract' export const compile = async (compilationTargets, settings, contentResolverCallback) => { - return new Promise((resolve, reject) => { + return new Promise((resolve) => { const compiler = new Compiler(contentResolverCallback) compiler.set('evmVersion', settings.evmVersion) compiler.set('optimize', settings.optimize) @@ -14,6 +14,6 @@ export const compile = async (compilationTargets, settings, contentResolverCallb compiler.event.register('compilationFinished', (success, compilationData, source) => { resolve(new CompilerAbstract(settings.version, compilationData, source)) }) - compiler.event.register('compilerLoaded', _ => compiler.compile(compilationTargets, '')) + compiler.event.register('compilerLoaded', () => compiler.compile(compilationTargets, '')) }) } diff --git a/libs/remix-ui/solidity-compiler/src/lib/logic/compiler-utils.ts b/libs/remix-ui/solidity-compiler/src/lib/logic/compiler-utils.ts index bd3fc3a016..fe26765ac1 100644 --- a/libs/remix-ui/solidity-compiler/src/lib/logic/compiler-utils.ts +++ b/libs/remix-ui/solidity-compiler/src/lib/logic/compiler-utils.ts @@ -38,7 +38,7 @@ function browserSupportWorker () { // returns a promise for minixhr export function promisedMiniXhr (url) { - return new Promise((resolve, reject) => { + return new Promise((resolve) => { minixhr(url, (json, event) => { resolve({ json, event }) }) diff --git a/libs/remix-ui/solidity-compiler/src/lib/logic/index.ts b/libs/remix-ui/solidity-compiler/src/lib/logic/index.ts index 8e8fb31572..b67d648896 100644 --- a/libs/remix-ui/solidity-compiler/src/lib/logic/index.ts +++ b/libs/remix-ui/solidity-compiler/src/lib/logic/index.ts @@ -2,4 +2,4 @@ export * from './compileTabLogic' export * from './compiler-abstract' export * from './compiler-helpers' export * from './compiler-utils' -export * from './contract-parser' \ No newline at end of file +export * from './contract-parser' diff --git a/libs/remix-ui/solidity-compiler/src/lib/reducers/compiler.ts b/libs/remix-ui/solidity-compiler/src/lib/reducers/compiler.ts index 6507d84b7b..f705c0f3cc 100644 --- a/libs/remix-ui/solidity-compiler/src/lib/reducers/compiler.ts +++ b/libs/remix-ui/solidity-compiler/src/lib/reducers/compiler.ts @@ -56,8 +56,8 @@ export const compilerReducer = (state = compilerInitialState, action: Action) => } } } - + default: throw new Error() } -} \ No newline at end of file +} diff --git a/libs/remix-ui/solidity-compiler/src/lib/solidity-compiler.tsx b/libs/remix-ui/solidity-compiler/src/lib/solidity-compiler.tsx index 3d62ffdf3b..3fd3f800fb 100644 --- a/libs/remix-ui/solidity-compiler/src/lib/solidity-compiler.tsx +++ b/libs/remix-ui/solidity-compiler/src/lib/solidity-compiler.tsx @@ -1,15 +1,15 @@ import React, { useState } from 'react' // eslint-disable-line import { SolidityCompilerProps } from './types' import { CompilerContainer } from './compiler-container' // eslint-disable-line -import { ContractSelection } from './contract-selection' +import { ContractSelection } from './contract-selection' // eslint-disable-line import { Toaster } from '@remix-ui/toaster' // eslint-disable-line import { ModalDialog } from '@remix-ui/modal-dialog' // eslint-disable-line -import { Renderer } from '@remix-ui/renderer' +import { Renderer } from '@remix-ui/renderer' // eslint-disable-line import './css/style.css' export const SolidityCompiler = (props: SolidityCompilerProps) => { - const { plugin, plugin : { editor, config, queryParams, compileTabLogic, currentFile, fileProvider, fileManager, contractsDetails, contractMap, compileErrors, isHardHatProject, setHardHatCompilation, configurationSettings } } = props + const { plugin, plugin: { editor, config, queryParams, compileTabLogic, currentFile, fileProvider, fileManager, contractsDetails, contractMap, compileErrors, isHardHatProject, setHardHatCompilation, configurationSettings } } = props const [state, setState] = useState({ contractsDetails: {}, eventHandlers: {}, @@ -28,7 +28,7 @@ export const SolidityCompiler = (props: SolidityCompilerProps) => { handleHide: null } }) - const [currentVersion, setCurrentVersion] = useState('') + const [currentVersion, setCurrentVersion] = useState('') const toast = (message: string) => { setState(prevState => { @@ -36,10 +36,6 @@ export const SolidityCompiler = (props: SolidityCompilerProps) => { }) } - const clearAnnotations = () => { - plugin.call('editor', 'clearAnnotations') - } - const updateCurrentVersion = (value) => { setCurrentVersion(value) plugin.setSelectedVersion(value) diff --git a/package.json b/package.json index 9d0ff5be06..781ee00078 100644 --- a/package.json +++ b/package.json @@ -41,8 +41,8 @@ "workspace-schematic": "nx workspace-schematic", "dep-graph": "nx dep-graph", "help": "nx help", - "lint:libs": "nx run-many --target=lint --projects=remix-analyzer,remix-astwalker,remix-debug,remix-lib,remix-simulator,remix-solidity,remix-tests,remix-url-resolver,remixd,remix-ui-tree-view,remix-ui-modal-dialog,remix-ui-toaster,remix-ui-file-explorer,remix-ui-debugger-ui,remix-ui-workspace,remix-ui-static-analyser,remix-ui-checkbox,remix-ui-settings,remix-core-plugin", - "build:libs": "nx run-many --target=build --parallel=false --with-deps=true --projects=remix-analyzer,remix-astwalker,remix-debug,remix-lib,remix-simulator,remix-solidity,remix-tests,remix-url-resolver,remixd,remix-core-plugin", + "lint:libs": "nx run-many --target=lint --projects=remix-analyzer,remix-astwalker,remix-debug,remix-lib,remix-simulator,remix-solidity,remix-tests,remix-url-resolver,remixd,remix-ui-tree-view,remix-ui-modal-dialog,remix-ui-toaster,remix-ui-file-explorer,remix-ui-debugger-ui,remix-ui-workspace,remix-ui-static-analyser,remix-ui-checkbox,remix-ui-settings,remix-core-plugin,remix-ui-renderer,remix-ui-publish-to-storage,remix-ui-solidity-compiler", + "build:libs": "nx run-many --target=build --parallel=false --with-deps=true --projects=remix-analyzer,remix-astwalker,remix-debug,remix-lib,remix-simulator,remix-solidity,remix-tests,remix-url-resolver,remixd", "test:libs": "nx run-many --target=test --projects=remix-analyzer,remix-astwalker,remix-debug,remix-lib,remix-simulator,remix-solidity,remix-tests,remix-url-resolver,remixd", "publish:libs": "npm run build:libs && lerna publish --skip-git && npm run bumpVersion:libs", "build:e2e": "tsc -p apps/remix-ide-e2e/tsconfig.e2e.json", From 926dd2fecd89e5c34c42712d884f4a6dfdf0a6b0 Mon Sep 17 00:00:00 2001 From: ioedeveloper Date: Thu, 1 Jul 2021 15:31:24 +0100 Subject: [PATCH 27/32] Remove comments --- .../src/tests/publishContract.test.ts | 1 - apps/remix-ide/src/app/tabs/analysis-tab.js | 4 +- apps/remix-ide/src/app/tabs/compile-tab.js | 1 - .../src/app/tabs/compileTab/compileTab.js | 234 +++++++++--------- .../src/lib/compiler-container.tsx | 15 +- .../src/lib/contract-selection.tsx | 2 - 6 files changed, 121 insertions(+), 136 deletions(-) diff --git a/apps/remix-ide-e2e/src/tests/publishContract.test.ts b/apps/remix-ide-e2e/src/tests/publishContract.test.ts index 821abd7f7c..fb931a1c35 100644 --- a/apps/remix-ide-e2e/src/tests/publishContract.test.ts +++ b/apps/remix-ide-e2e/src/tests/publishContract.test.ts @@ -26,7 +26,6 @@ module.exports = { browser.perform((done) => { if (value.indexOf('Metadata of "ballot" was published successfully.') === -1) browser.assert.fail('ipfs deploy failed') - // if (value.indexOf('ipfs://') === -1) browser.assert.fail('ipfs deploy failed') done() }) }) diff --git a/apps/remix-ide/src/app/tabs/analysis-tab.js b/apps/remix-ide/src/app/tabs/analysis-tab.js index de515eec52..b3bba2705c 100644 --- a/apps/remix-ide/src/app/tabs/analysis-tab.js +++ b/apps/remix-ide/src/app/tabs/analysis-tab.js @@ -4,7 +4,7 @@ import ReactDOM from 'react-dom' import { EventEmitter } from 'events' import {RemixUiStaticAnalyser} from '@remix-ui/static-analyser' // eslint-disable-line import * as packageJson from '../../../../../package.json' -// var Renderer = require('../ui/renderer') +var Renderer = require('../ui/renderer') var EventManager = require('../../lib/events') @@ -30,7 +30,7 @@ class AnalysisTab extends ViewPlugin { this.element = document.createElement('div') this.element.setAttribute('id', 'staticAnalyserView') this._components = { - // renderer: new Renderer(this) + renderer: new Renderer(this) } this._components.registry = this.registry this._deps = { diff --git a/apps/remix-ide/src/app/tabs/compile-tab.js b/apps/remix-ide/src/app/tabs/compile-tab.js index 2c26fa9235..376f0c8d63 100644 --- a/apps/remix-ide/src/app/tabs/compile-tab.js +++ b/apps/remix-ide/src/app/tabs/compile-tab.js @@ -46,7 +46,6 @@ class CompileTab extends ViewPlugin { // dependencies this.editor = editor this.config = config - // this.renderer = new Renderer(this) this.fileManager = fileManager this.contractsDetails = {} this.data = { diff --git a/apps/remix-ide/src/app/tabs/compileTab/compileTab.js b/apps/remix-ide/src/app/tabs/compileTab/compileTab.js index 427b625f25..b357f8a8aa 100644 --- a/apps/remix-ide/src/app/tabs/compileTab/compileTab.js +++ b/apps/remix-ide/src/app/tabs/compileTab/compileTab.js @@ -1,130 +1,130 @@ -// import * as packageJson from '../../../../../../package.json' -// import { Plugin } from '@remixproject/engine' -// const EventEmitter = require('events') -// var Compiler = require('@remix-project/remix-solidity').Compiler +import * as packageJson from '../../../../../../package.json' +import { Plugin } from '@remixproject/engine' +const EventEmitter = require('events') +var Compiler = require('@remix-project/remix-solidity').Compiler -// const profile = { -// name: 'solidity-logic', -// displayName: 'Solidity compiler logic', -// description: 'Compile solidity contracts - Logic', -// version: packageJson.version -// } +const profile = { + name: 'solidity-logic', + displayName: 'Solidity compiler logic', + description: 'Compile solidity contracts - Logic', + version: packageJson.version +} -// class CompileTab extends Plugin { -// constructor (queryParams, fileManager, editor, config, fileProvider, contentImport) { -// super(profile) -// this.event = new EventEmitter() -// this.queryParams = queryParams -// this.compilerImport = contentImport -// this.compiler = new Compiler((url, cb) => this.compilerImport.resolveAndSave(url).then((result) => cb(null, result)).catch((error) => cb(error.message))) -// this.fileManager = fileManager -// this.editor = editor -// this.config = config -// this.fileProvider = fileProvider -// } +class CompileTab extends Plugin { + constructor (queryParams, fileManager, editor, config, fileProvider, contentImport) { + super(profile) + this.event = new EventEmitter() + this.queryParams = queryParams + this.compilerImport = contentImport + this.compiler = new Compiler((url, cb) => this.compilerImport.resolveAndSave(url).then((result) => cb(null, result)).catch((error) => cb(error.message))) + this.fileManager = fileManager + this.editor = editor + this.config = config + this.fileProvider = fileProvider + } -// init () { -// this.optimize = this.queryParams.get().optimize -// this.optimize = this.optimize === 'true' -// this.queryParams.update({ optimize: this.optimize }) -// this.compiler.set('optimize', this.optimize) + init () { + this.optimize = this.queryParams.get().optimize + this.optimize = this.optimize === 'true' + this.queryParams.update({ optimize: this.optimize }) + this.compiler.set('optimize', this.optimize) -// this.runs = this.queryParams.get().runs -// this.runs = this.runs || 200 -// this.queryParams.update({ runs: this.runs }) -// this.compiler.set('runs', this.runs) + this.runs = this.queryParams.get().runs + this.runs = this.runs || 200 + this.queryParams.update({ runs: this.runs }) + this.compiler.set('runs', this.runs) -// this.evmVersion = this.queryParams.get().evmVersion -// if (this.evmVersion === 'undefined' || this.evmVersion === 'null' || !this.evmVersion) { -// this.evmVersion = null -// } -// this.queryParams.update({ evmVersion: this.evmVersion }) -// this.compiler.set('evmVersion', this.evmVersion) -// } + this.evmVersion = this.queryParams.get().evmVersion + if (this.evmVersion === 'undefined' || this.evmVersion === 'null' || !this.evmVersion) { + this.evmVersion = null + } + this.queryParams.update({ evmVersion: this.evmVersion }) + this.compiler.set('evmVersion', this.evmVersion) + } -// setOptimize (newOptimizeValue) { -// this.optimize = newOptimizeValue -// this.queryParams.update({ optimize: this.optimize }) -// this.compiler.set('optimize', this.optimize) -// } + setOptimize (newOptimizeValue) { + this.optimize = newOptimizeValue + this.queryParams.update({ optimize: this.optimize }) + this.compiler.set('optimize', this.optimize) + } -// setRuns (runs) { -// this.runs = runs -// this.queryParams.update({ runs: this.runs }) -// this.compiler.set('runs', this.runs) -// } + setRuns (runs) { + this.runs = runs + this.queryParams.update({ runs: this.runs }) + this.compiler.set('runs', this.runs) + } -// setEvmVersion (newEvmVersion) { -// this.evmVersion = newEvmVersion -// this.queryParams.update({ evmVersion: this.evmVersion }) -// this.compiler.set('evmVersion', this.evmVersion) -// } + setEvmVersion (newEvmVersion) { + this.evmVersion = newEvmVersion + this.queryParams.update({ evmVersion: this.evmVersion }) + this.compiler.set('evmVersion', this.evmVersion) + } -// /** -// * Set the compiler to using Solidity or Yul (default to Solidity) -// * @params lang {'Solidity' | 'Yul'} ... -// */ -// setLanguage (lang) { -// this.compiler.set('language', lang) -// } + /** + * Set the compiler to using Solidity or Yul (default to Solidity) + * @params lang {'Solidity' | 'Yul'} ... + */ + setLanguage (lang) { + this.compiler.set('language', lang) + } -// /** -// * Compile a specific file of the file manager -// * @param {string} target the path to the file to compile -// */ -// compileFile (target) { -// if (!target) throw new Error('No target provided for compiliation') -// const provider = this.fileManager.fileProviderOf(target) -// if (!provider) throw new Error(`cannot compile ${target}. Does not belong to any explorer`) -// return new Promise((resolve, reject) => { -// provider.get(target, (error, content) => { -// if (error) return reject(error) -// const sources = { [target]: { content } } -// this.event.emit('startingCompilation') -// // setTimeout fix the animation on chrome... (animation triggered by 'staringCompilation') -// setTimeout(() => { this.compiler.compile(sources, target); resolve() }, 100) -// }) -// }) -// } + /** + * Compile a specific file of the file manager + * @param {string} target the path to the file to compile + */ + compileFile (target) { + if (!target) throw new Error('No target provided for compiliation') + const provider = this.fileManager.fileProviderOf(target) + if (!provider) throw new Error(`cannot compile ${target}. Does not belong to any explorer`) + return new Promise((resolve, reject) => { + provider.get(target, (error, content) => { + if (error) return reject(error) + const sources = { [target]: { content } } + this.event.emit('startingCompilation') + // setTimeout fix the animation on chrome... (animation triggered by 'staringCompilation') + setTimeout(() => { this.compiler.compile(sources, target); resolve() }, 100) + }) + }) + } -// async isHardhatProject () { -// if (this.fileManager.mode === 'localhost') { -// return await this.fileManager.exists('hardhat.config.js') -// } else return false -// } + async isHardhatProject () { + if (this.fileManager.mode === 'localhost') { + return await this.fileManager.exists('hardhat.config.js') + } else return false + } -// runCompiler (hhCompilation) { -// try { -// if (this.fileManager.mode === 'localhost' && hhCompilation) { -// const { currentVersion, optimize, runs } = this.compiler.state -// if (currentVersion) { -// const fileContent = `module.exports = { -// solidity: '${currentVersion.substring(0, currentVersion.indexOf('+commit'))}', -// settings: { -// optimizer: { -// enabled: ${optimize}, -// runs: ${runs} -// } -// } -// } -// ` -// const configFilePath = 'remix-compiler.config.js' -// this.fileManager.setFileContent(configFilePath, fileContent) -// this.call('hardhat', 'compile', configFilePath).then((result) => { -// this.call('terminal', 'log', { type: 'info', value: result }) -// }).catch((error) => { -// this.call('terminal', 'log', { type: 'error', value: error }) -// }) -// } -// } -// this.fileManager.saveCurrentFile() -// this.event.emit('removeAnnotations') -// var currentFile = this.config.get('currentFile') -// return this.compileFile(currentFile) -// } catch (err) { -// console.error(err) -// } -// } -// } + runCompiler (hhCompilation) { + try { + if (this.fileManager.mode === 'localhost' && hhCompilation) { + const { currentVersion, optimize, runs } = this.compiler.state + if (currentVersion) { + const fileContent = `module.exports = { + solidity: '${currentVersion.substring(0, currentVersion.indexOf('+commit'))}', + settings: { + optimizer: { + enabled: ${optimize}, + runs: ${runs} + } + } + } + ` + const configFilePath = 'remix-compiler.config.js' + this.fileManager.setFileContent(configFilePath, fileContent) + this.call('hardhat', 'compile', configFilePath).then((result) => { + this.call('terminal', 'log', { type: 'info', value: result }) + }).catch((error) => { + this.call('terminal', 'log', { type: 'error', value: error }) + }) + } + } + this.fileManager.saveCurrentFile() + this.event.emit('removeAnnotations') + var currentFile = this.config.get('currentFile') + return this.compileFile(currentFile) + } catch (err) { + console.error(err) + } + } +} -// module.exports = CompileTab +module.exports = CompileTab diff --git a/libs/remix-ui/solidity-compiler/src/lib/compiler-container.tsx b/libs/remix-ui/solidity-compiler/src/lib/compiler-container.tsx index 9bd0fcb4e4..4d189fee05 100644 --- a/libs/remix-ui/solidity-compiler/src/lib/compiler-container.tsx +++ b/libs/remix-ui/solidity-compiler/src/lib/compiler-container.tsx @@ -259,7 +259,6 @@ export const CompilerContainer = (props: CompilerContainerProps) => { const loadingCompiler = () => { if (!compileIcon.current) return - // _disableCompileBtn(true) compileIcon.current.setAttribute('title', 'compiler is loading, please wait a few moments.') compileIcon.current.classList.add('remixui_spinningIcon') warningIcon.current.style.visibility = 'hidden' @@ -268,7 +267,6 @@ export const CompilerContainer = (props: CompilerContainerProps) => { const compilerLoaded = () => { if (!compileIcon.current) return - // _disableCompileBtn(false) compileIcon.current.setAttribute('title', '') compileIcon.current.classList.remove('remixui_spinningIcon') if (state.autoCompile) compile() @@ -349,10 +347,8 @@ export const CompilerContainer = (props: CompilerContainerProps) => { // resort to non-worker version in that case. if (selectedVersion !== 'builtin' && canUseWorker(selectedVersion)) { compileTabLogic.compiler.loadVersion(true, url) - // setVersionText('(loading using worker)') } else { compileTabLogic.compiler.loadVersion(false, url) - // setVersionText('(loading)') } } @@ -361,10 +357,6 @@ export const CompilerContainer = (props: CompilerContainerProps) => { (version.includes('nightly') && state.includeNightlies) } - // const setVersionText = (text) => { - // if (this._view.version) this._view.version.innerText = text - // } - const promptCompiler = () => { // custom url https://solidity-blog.s3.eu-central-1.amazonaws.com/data/08preview/soljson.js modal('Add a custom compiler', promptMessage('URL'), 'OK', addCustomCompiler, 'Cancel', () => {}) @@ -400,11 +392,8 @@ export const CompilerContainer = (props: CompilerContainerProps) => { const _updateLanguageSelector = () => { // This is the first version when Yul is available if (!semver.valid(_retrieveVersion()) || semver.lt(_retrieveVersion(), 'v0.5.7+commit.6da8b019.js')) { - // this._view.languageSelector.setAttribute('disabled', '') - // this._view.languageSelector.value = 'Solidity' - // this.compileTabLogic.setLanguage('Solidity') - } else { - // this._view.languageSelector.removeAttribute('disabled') + handleLanguageChange('Solidity') + compileTabLogic.setLanguage('Solidity') } } diff --git a/libs/remix-ui/solidity-compiler/src/lib/contract-selection.tsx b/libs/remix-ui/solidity-compiler/src/lib/contract-selection.tsx index deb3629a9f..d8e3f6bcba 100644 --- a/libs/remix-ui/solidity-compiler/src/lib/contract-selection.tsx +++ b/libs/remix-ui/solidity-compiler/src/lib/contract-selection.tsx @@ -48,7 +48,6 @@ export const ContractSelection = (props: ContractSelectionProps) => { const copyContractProperty = (property) => { let content = getContractProperty(property) if (!content) { - // addTooltip('No content available for ' + property) return } @@ -59,7 +58,6 @@ export const ContractSelection = (props: ContractSelectionProps) => { } catch (e) {} return content - // addTooltip('Copied value to clipboard') } const getContractProperty = (property) => { From b120386748e517579aeb28d25350cbfc4db23098 Mon Sep 17 00:00:00 2001 From: ioedeveloper Date: Thu, 1 Jul 2021 21:54:33 +0100 Subject: [PATCH 28/32] Fixed display of boolean value in compilation details and increased with of info container --- .../solidity-compiler/src/lib/contract-selection.tsx | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/libs/remix-ui/solidity-compiler/src/lib/contract-selection.tsx b/libs/remix-ui/solidity-compiler/src/lib/contract-selection.tsx index d8e3f6bcba..0d2d6bf486 100644 --- a/libs/remix-ui/solidity-compiler/src/lib/contract-selection.tsx +++ b/libs/remix-ui/solidity-compiler/src/lib/contract-selection.tsx @@ -20,7 +20,7 @@ export const ContractSelection = (props: ContractSelectionProps) => { setContractList(contractList) if (contractList.length) setSelectedContract(contractList[0].name) - }, [contractMap]) + }, [contractMap, contractsDetails]) const resetStorage = () => { setStorage('') @@ -77,7 +77,7 @@ export const ContractSelection = (props: ContractSelectionProps) => { - + }> @@ -89,7 +89,7 @@ export const ContractSelection = (props: ContractSelectionProps) => { return - + } /> } @@ -226,7 +226,7 @@ export const ContractSelection = (props: ContractSelectionProps) => {
- :
+
:
No Contract Compiled Yet
} From a7bf653b417bfdfc396946dc41fd0c10c158d428 Mon Sep 17 00:00:00 2001 From: ioedeveloper Date: Tue, 13 Jul 2021 12:04:04 +0100 Subject: [PATCH 29/32] Fixed infinte spinner icon --- .../solidity-compiler/src/lib/compiler-container.tsx | 11 +++-------- 1 file changed, 3 insertions(+), 8 deletions(-) diff --git a/libs/remix-ui/solidity-compiler/src/lib/compiler-container.tsx b/libs/remix-ui/solidity-compiler/src/lib/compiler-container.tsx index 4d189fee05..17c498522a 100644 --- a/libs/remix-ui/solidity-compiler/src/lib/compiler-container.tsx +++ b/libs/remix-ui/solidity-compiler/src/lib/compiler-container.tsx @@ -4,7 +4,7 @@ import { CompilerContainerProps, ConfigurationSettings } from './types' import * as helper from '../../../../../apps/remix-ide/src/lib/helper' import { canUseWorker, baseURLBin, baseURLWasm, urlFromVersion, pathToURL, promisedMiniXhr } from './logic/compiler-utils' // eslint-disable-line import { compilerReducer, compilerInitialState } from './reducers/compiler' -import { resetCompilerMode, resetEditorMode, listenToEvents } from './actions/compiler' +import { resetEditorMode, listenToEvents } from './actions/compiler' import './css/style.css' @@ -85,23 +85,18 @@ export const CompilerContainer = (props: CompilerContainerProps) => { switch (compilerContainer.compiler.mode) { case 'startingCompilation': startingCompilation() - resetCompilerMode()(dispatch) break case 'compilationDuration': - compilationDuration(compilerContainer.compiler.args) - resetCompilerMode()(dispatch) + compilationDuration(compilerContainer.compiler.args[0]) break case 'loadingCompiler': loadingCompiler() - resetCompilerMode()(dispatch) break case 'compilerLoaded': compilerLoaded() - resetCompilerMode()(dispatch) break case 'compilationFinished': compilationFinished() - resetCompilerMode()(dispatch) break } } @@ -239,7 +234,7 @@ export const CompilerContainer = (props: CompilerContainerProps) => { compileIcon.current.classList.add('remixui_spinningIcon') } - const compilationDuration = ({ speed }) => { + const compilationDuration = (speed: number) => { if (!warningIcon.current) return if (speed > 1000) { const msg = `Last compilation took ${speed}ms. We suggest to turn off autocompilation.` From d1c6c28b929717d07e2d0f23ff8553f6dc053ddd Mon Sep 17 00:00:00 2001 From: ioedeveloper Date: Wed, 14 Jul 2021 21:50:55 +0100 Subject: [PATCH 30/32] Sync workspace config with nx.json --- workspace.json | 76 +++++++++++++++++++++++++------------------------- 1 file changed, 38 insertions(+), 38 deletions(-) diff --git a/workspace.json b/workspace.json index cf80740abd..0790909a05 100644 --- a/workspace.json +++ b/workspace.json @@ -807,6 +807,44 @@ } } }, + "remix-ui-solidity-compiler": { + "root": "libs/remix-ui/solidity-compiler", + "sourceRoot": "libs/remix-ui/solidity-compiler/src", + "projectType": "library", + "schematics": {}, + "architect": { + "lint": { + "builder": "@nrwl/linter:lint", + "options": { + "linter": "eslint", + "tsConfig": ["libs/remix-ui/solidity-compiler/tsconfig.lib.json"], + "exclude": [ + "**/node_modules/**", + "!libs/remix-ui/solidity-compiler/**/*" + ] + } + } + } + }, + "remix-ui-publish-to-storage": { + "root": "libs/remix-ui/publish-to-storage", + "sourceRoot": "libs/remix-ui/publish-to-storage/src", + "projectType": "library", + "schematics": {}, + "architect": { + "lint": { + "builder": "@nrwl/linter:lint", + "options": { + "linter": "eslint", + "tsConfig": ["libs/remix-ui/publish-to-storage/tsconfig.lib.json"], + "exclude": [ + "**/node_modules/**", + "!libs/remix-ui/publish-to-storage/**/*" + ] + } + } + } + }, "remix-ui-renderer": { "root": "libs/remix-ui/renderer", "sourceRoot": "libs/remix-ui/renderer/src", @@ -824,44 +862,6 @@ } } }, - "remix-ui-solidity-compiler": { - "root": "libs/remix-ui/solidity-compiler", - "sourceRoot": "libs/remix-ui/solidity-compiler/src", - "projectType": "library", - "schematics": {}, - "architect": { - "lint": { - "builder": "@nrwl/linter:lint", - "options": { - "linter": "eslint", - "tsConfig": ["libs/remix-ui/solidity-compiler/tsconfig.lib.json"], - "exclude": [ - "**/node_modules/**", - "!libs/remix-ui/solidity-compiler/**/*" - ] - } - } - } - }, - "remix-ui-publish-to-storage": { - "root": "libs/remix-ui/publish-to-storage", - "sourceRoot": "libs/remix-ui/publish-to-storage/src", - "projectType": "library", - "schematics": {}, - "architect": { - "lint": { - "builder": "@nrwl/linter:lint", - "options": { - "linter": "eslint", - "tsConfig": ["libs/remix-ui/publish-to-storage/tsconfig.lib.json"], - "exclude": [ - "**/node_modules/**", - "!libs/remix-ui/publish-to-storage/**/*" - ] - } - } - } - }, "cli": { "defaultCollection": "@nrwl/react" }, From 66d995e93b2a52e705e05ef240dc4d2d7da7a6f1 Mon Sep 17 00:00:00 2001 From: ioedeveloper Date: Thu, 15 Jul 2021 12:47:17 +0100 Subject: [PATCH 31/32] Fix ts compiler error --- apps/remix-ide/src/app/tabs/compile-tab.js | 3 ++- libs/remix-ui/solidity-compiler/src/lib/compiler-container.tsx | 2 +- libs/remix-ui/solidity-compiler/src/lib/types/index.ts | 1 - 3 files changed, 3 insertions(+), 3 deletions(-) diff --git a/apps/remix-ide/src/app/tabs/compile-tab.js b/apps/remix-ide/src/app/tabs/compile-tab.js index 376f0c8d63..285ecb5363 100644 --- a/apps/remix-ide/src/app/tabs/compile-tab.js +++ b/apps/remix-ide/src/app/tabs/compile-tab.js @@ -1,7 +1,8 @@ /* global */ import React from 'react' // eslint-disable-line import ReactDOM from 'react-dom' -import { SolidityCompiler, CompileTab as CompileTabLogic, compile, parseContracts } from '@remix-ui/solidity-compiler' // eslint-disable-line +import { SolidityCompiler, CompileTab as CompileTabLogic, parseContracts } from '@remix-ui/solidity-compiler' // eslint-disable-line +import { compile } from '@remix-project/remix-solidity' import { ViewPlugin } from '@remixproject/engine-web' import * as packageJson from '../../../../../package.json' diff --git a/libs/remix-ui/solidity-compiler/src/lib/compiler-container.tsx b/libs/remix-ui/solidity-compiler/src/lib/compiler-container.tsx index 17c498522a..1271702a51 100644 --- a/libs/remix-ui/solidity-compiler/src/lib/compiler-container.tsx +++ b/libs/remix-ui/solidity-compiler/src/lib/compiler-container.tsx @@ -2,7 +2,7 @@ import React, { useEffect, useState, useRef, useReducer } from 'react' // eslint import semver from 'semver' import { CompilerContainerProps, ConfigurationSettings } from './types' import * as helper from '../../../../../apps/remix-ide/src/lib/helper' -import { canUseWorker, baseURLBin, baseURLWasm, urlFromVersion, pathToURL, promisedMiniXhr } from './logic/compiler-utils' // eslint-disable-line +import { canUseWorker, baseURLBin, baseURLWasm, urlFromVersion, pathToURL, promisedMiniXhr } from '../../../../remix-solidity/src/index' import { compilerReducer, compilerInitialState } from './reducers/compiler' import { resetEditorMode, listenToEvents } from './actions/compiler' diff --git a/libs/remix-ui/solidity-compiler/src/lib/types/index.ts b/libs/remix-ui/solidity-compiler/src/lib/types/index.ts index 7dbd9165a5..31c95e9e1f 100644 --- a/libs/remix-ui/solidity-compiler/src/lib/types/index.ts +++ b/libs/remix-ui/solidity-compiler/src/lib/types/index.ts @@ -1,4 +1,3 @@ - export interface SolidityCompilerProps { plugin: { contractMap: { From 1efc195a4b81d4a635f029c31704f2162a4a6a50 Mon Sep 17 00:00:00 2001 From: ioedeveloper Date: Thu, 15 Jul 2021 13:36:07 +0100 Subject: [PATCH 32/32] ts-ignore --- libs/remix-ui/solidity-compiler/src/lib/compiler-container.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/libs/remix-ui/solidity-compiler/src/lib/compiler-container.tsx b/libs/remix-ui/solidity-compiler/src/lib/compiler-container.tsx index 1271702a51..88dba176a0 100644 --- a/libs/remix-ui/solidity-compiler/src/lib/compiler-container.tsx +++ b/libs/remix-ui/solidity-compiler/src/lib/compiler-container.tsx @@ -2,7 +2,7 @@ import React, { useEffect, useState, useRef, useReducer } from 'react' // eslint import semver from 'semver' import { CompilerContainerProps, ConfigurationSettings } from './types' import * as helper from '../../../../../apps/remix-ide/src/lib/helper' -import { canUseWorker, baseURLBin, baseURLWasm, urlFromVersion, pathToURL, promisedMiniXhr } from '../../../../remix-solidity/src/index' +import { canUseWorker, baseURLBin, baseURLWasm, urlFromVersion, pathToURL, promisedMiniXhr } from '@remix-project/remix-solidity' // @ts-ignore import { compilerReducer, compilerInitialState } from './reducers/compiler' import { resetEditorMode, listenToEvents } from './actions/compiler'