David Zagi
3 years ago
committed by
GitHub
commit
77209336e3
@ -0,0 +1,4 @@ |
||||
{ |
||||
"presets": ["@nrwl/react/babel"], |
||||
"plugins": [] |
||||
} |
||||
@ -0,0 +1,18 @@ |
||||
{ |
||||
"env": { |
||||
"browser": true, |
||||
"es6": true |
||||
}, |
||||
"extends": "../../../.eslintrc", |
||||
"globals": { |
||||
"Atomics": "readonly", |
||||
"SharedArrayBuffer": "readonly" |
||||
}, |
||||
"parserOptions": { |
||||
"ecmaVersion": 11, |
||||
"sourceType": "module" |
||||
}, |
||||
"rules": { |
||||
"standard/no-callback-literal": "off" |
||||
} |
||||
} |
||||
@ -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). |
||||
@ -0,0 +1 @@ |
||||
export * from './lib/publish-to-storage' |
||||
@ -0,0 +1,110 @@ |
||||
import React, { useEffect, useState } from 'react' // eslint-disable-line
|
||||
import { ModalDialog } from '@remix-ui/modal-dialog' // eslint-disable-line
|
||||
import { RemixUiPublishToStorageProps } from './types' // eslint-disable-line
|
||||
import { publishToIPFS } from './publishToIPFS' |
||||
import { publishToSwarm } from './publishOnSwarm' |
||||
|
||||
export const PublishToStorage = (props: RemixUiPublishToStorageProps) => { |
||||
const { storage, fileProvider, fileManager, contract, resetStorage } = props |
||||
const [state, setState] = useState({ |
||||
modal: { |
||||
title: '', |
||||
message: null, |
||||
hide: true, |
||||
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.') |
||||
} else { |
||||
if (storage === 'swarm') { |
||||
try { |
||||
const result = await publishToSwarm(contract, fileManager) |
||||
|
||||
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) { |
||||
let parseError = err |
||||
try { |
||||
parseError = JSON.stringify(err) |
||||
} catch (e) {} |
||||
modal('Swarm Publish Failed', publishMessageFailed(storage, parseError)) |
||||
} |
||||
} else { |
||||
try { |
||||
const result = await publishToIPFS(contract, fileManager) |
||||
|
||||
modal(`Published ${contract.name}'s Metadata`, publishMessage(result.uploaded)) |
||||
// 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)) |
||||
} |
||||
} |
||||
} |
||||
} |
||||
|
||||
if (storage) { |
||||
storageService() |
||||
} |
||||
}, [storage]) |
||||
|
||||
const publishMessage = (uploaded) => ( |
||||
<span> Metadata of "{contract.name.toLowerCase()}" was published successfully. <br /> |
||||
<pre> |
||||
<div> |
||||
{ uploaded.map((value, index) => <div key={index}><b>{ value.filename }</b> : <pre>{ value.output.url }</pre></div>) } |
||||
</div> |
||||
</pre> |
||||
</span> |
||||
) |
||||
|
||||
const publishMessageFailed = (storage, err) => ( |
||||
<span>Failed to publish metadata file to { storage }, please check the { storage } gateways is available. <br /> |
||||
{err} |
||||
</span> |
||||
) |
||||
|
||||
const handleHideModal = () => { |
||||
setState(prevState => { |
||||
return { ...prevState, modal: { ...prevState.modal, hide: true, message: null } } |
||||
}) |
||||
resetStorage() |
||||
} |
||||
|
||||
const modal = async (title: string, message: string | JSX.Element) => { |
||||
await setState(prevState => { |
||||
return { |
||||
...prevState, |
||||
modal: { |
||||
...prevState.modal, |
||||
hide: false, |
||||
message, |
||||
title |
||||
} |
||||
} |
||||
}) |
||||
} |
||||
|
||||
return ( |
||||
<ModalDialog |
||||
id='publishToStorage' |
||||
title={ state.modal.title } |
||||
message={ state.modal.message } |
||||
hide={ state.modal.hide } |
||||
okLabel='OK' |
||||
okFn={() => {}} |
||||
handleHide={ handleHideModal }> |
||||
{ (typeof state.modal.message !== 'string') && state.modal.message } |
||||
</ModalDialog> |
||||
) |
||||
} |
||||
|
||||
export default PublishToStorage |
||||
@ -0,0 +1,109 @@ |
||||
import swarm from 'swarmgw' |
||||
|
||||
const swarmgw = swarm() |
||||
|
||||
export const publishToSwarm = async (contract, fileManager) => { |
||||
// gather list of files to publish
|
||||
const sources = [] |
||||
let metadata |
||||
const item = { content: null, hash: 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(async (item) => { |
||||
try { |
||||
const result = await swarmVerifiedPublish(item.content, item.hash) |
||||
|
||||
try { |
||||
item.hash = result.url.match('bzz-raw://(.+)')[1] |
||||
} catch (e) { |
||||
item.hash = '<Metadata inconsistency> - ' + 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 |
||||
} catch (error) { |
||||
throw new Error(error) |
||||
} |
||||
})) |
||||
|
||||
const metadataContent = JSON.stringify(metadata) |
||||
try { |
||||
const result = await swarmVerifiedPublish(metadataContent, '') |
||||
|
||||
try { |
||||
contract.metadataHash = result.url.match('bzz-raw://(.+)')[1] |
||||
} catch (e) { |
||||
contract.metadataHash = '<Metadata inconsistency> - metadata.json' |
||||
} |
||||
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 = async (content, expectedHash): Promise<Record<string, any>> => { |
||||
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 }) |
||||
} |
||||
}) |
||||
}) |
||||
} |
||||
@ -0,0 +1,117 @@ |
||||
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 |
||||
const item = { content: null, hash: 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(async (item) => { |
||||
try { |
||||
const result = await ipfsVerifiedPublish(item.content, item.hash) |
||||
|
||||
try { |
||||
item.hash = result.url.match('dweb:/ipfs/(.+)')[1] |
||||
} catch (e) { |
||||
item.hash = '<Metadata inconsistency> - ' + item.fileName |
||||
} |
||||
item.output = result |
||||
uploaded.push(item) |
||||
} catch (error) { |
||||
throw new Error(error) |
||||
} |
||||
})) |
||||
const metadataContent = JSON.stringify(metadata) |
||||
|
||||
try { |
||||
const result = await ipfsVerifiedPublish(metadataContent, '') |
||||
|
||||
try { |
||||
contract.metadataHash = result.url.match('dweb:/ipfs/(.+)')[1] |
||||
} catch (e) { |
||||
contract.metadataHash = '<Metadata inconsistency> - metadata.json' |
||||
} |
||||
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) => { |
||||
try { |
||||
const results = await severalGatewaysPush(content) |
||||
|
||||
if (expectedHash && results !== expectedHash) { |
||||
return { message: 'hash mismatch between solidity bytecode and uploaded content.', url: 'dweb:/ipfs/' + results, hash: results } |
||||
} else { |
||||
return { message: 'ok', url: 'dweb:/ipfs/' + results, hash: results } |
||||
} |
||||
} catch (error) { |
||||
throw new Error(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)) |
||||
} |
||||
@ -0,0 +1,7 @@ |
||||
export interface RemixUiPublishToStorageProps { |
||||
storage: string, |
||||
fileProvider: any, |
||||
fileManager: any, |
||||
contract: any, |
||||
resetStorage: () => void |
||||
} |
||||
@ -0,0 +1,16 @@ |
||||
{ |
||||
"extends": "../../../tsconfig.json", |
||||
"compilerOptions": { |
||||
"jsx": "react", |
||||
"allowJs": true, |
||||
"esModuleInterop": true, |
||||
"allowSyntheticDefaultImports": true |
||||
}, |
||||
"files": [], |
||||
"include": [], |
||||
"references": [ |
||||
{ |
||||
"path": "./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"] |
||||
} |
||||
@ -0,0 +1,4 @@ |
||||
{ |
||||
"presets": ["@nrwl/react/babel"], |
||||
"plugins": [] |
||||
} |
||||
@ -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" |
||||
} |
||||
} |
||||
@ -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). |
||||
@ -0,0 +1 @@ |
||||
export * from './lib/renderer' |
||||
@ -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; */ |
||||
} |
||||
@ -0,0 +1,127 @@ |
||||
import React, { useEffect, useState } from 'react' //eslint-disable-line
|
||||
import './renderer.css' |
||||
interface RendererProps { |
||||
message: any; |
||||
opt?: any, |
||||
plugin: any, |
||||
editor: any, |
||||
config: any, |
||||
fileManager: any |
||||
} |
||||
|
||||
export const Renderer = ({ message, opt = {}, editor, config, fileManager, plugin }: RendererProps) => { |
||||
const [messageText, setMessageText] = useState(null) |
||||
const [editorOptions, setEditorOptions] = useState({ |
||||
useSpan: false, |
||||
type: '', |
||||
errFile: '' |
||||
}) |
||||
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<string, number | string> |
||||
|
||||
// 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 pos = msg.match(/^(.*?):([0-9]*?):([0-9]*?)?/) |
||||
result.errLine = pos ? parseInt(pos[2]) - 1 : -1 |
||||
result.errCol = pos ? parseInt(pos[3]) : -1 |
||||
|
||||
// extract file
|
||||
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 handleErrorClick = (opt) => { |
||||
if (opt.click) { |
||||
opt.click(message) |
||||
} else if (opt.errFile !== undefined && opt.errLine !== undefined && opt.errCol !== undefined) { |
||||
_errorClick(opt.errFile, opt.errLine, opt.errCol) |
||||
} |
||||
} |
||||
|
||||
const handleClose = () => { |
||||
setClose(true) |
||||
} |
||||
|
||||
const _errorClick = (errFile, errLine, errCol) => { |
||||
if (errFile !== config.get('currentFile')) { |
||||
// TODO: refactor with this._components.contextView.jumpTo
|
||||
const provider = fileManager.fileProviderOf(errFile) |
||||
if (provider) { |
||||
provider.exists(errFile).then(() => { |
||||
fileManager.open(errFile) |
||||
editor.gotoLine(errLine, errCol) |
||||
}).catch(error => { |
||||
if (error) return console.log(error) |
||||
}) |
||||
} |
||||
} else { |
||||
editor.gotoLine(errLine, errCol) |
||||
} |
||||
} |
||||
|
||||
return ( |
||||
<> |
||||
{ |
||||
messageText && !close && ( |
||||
<div className={`sol ${editorOptions.type} ${classList}`} data-id={editorOptions.errFile} onClick={() => handleErrorClick(editorOptions)}> |
||||
{ editorOptions.useSpan ? <span> { messageText } </span> : <pre><span>{ messageText }</span></pre> } |
||||
<div className="close" data-id="renderer" onClick={handleClose}> |
||||
<i className="fas fa-times"></i> |
||||
</div> |
||||
</div>) |
||||
} |
||||
</> |
||||
) |
||||
} |
||||
@ -0,0 +1,16 @@ |
||||
{ |
||||
"extends": "../../../tsconfig.json", |
||||
"compilerOptions": { |
||||
"jsx": "react", |
||||
"allowJs": true, |
||||
"esModuleInterop": true, |
||||
"allowSyntheticDefaultImports": true |
||||
}, |
||||
"files": [], |
||||
"include": [], |
||||
"references": [ |
||||
{ |
||||
"path": "./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"] |
||||
} |
||||
@ -0,0 +1,4 @@ |
||||
{ |
||||
"presets": ["@nrwl/react/babel"], |
||||
"plugins": [] |
||||
} |
||||
@ -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" |
||||
} |
||||
} |
||||
@ -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). |
||||
@ -0,0 +1,2 @@ |
||||
export * from './lib/solidity-compiler' |
||||
export * from './lib/logic' |
||||
@ -0,0 +1,57 @@ |
||||
import React from 'react' |
||||
|
||||
export const setEditorMode = (mode: string) => { |
||||
return { |
||||
type: 'SET_EDITOR_MODE', |
||||
payload: mode |
||||
} |
||||
} |
||||
|
||||
export const resetEditorMode = () => (dispatch: React.Dispatch<any>) => { |
||||
dispatch({ |
||||
type: 'RESET_EDITOR_MODE' |
||||
}) |
||||
} |
||||
|
||||
export const setCompilerMode = (mode: string, ...args) => { |
||||
return { |
||||
type: 'SET_COMPILER_MODE', |
||||
payload: { mode, args } |
||||
} |
||||
} |
||||
|
||||
export const resetCompilerMode = () => (dispatch: React.Dispatch<any>) => { |
||||
dispatch({ |
||||
type: 'RESET_COMPILER_MODE' |
||||
}) |
||||
} |
||||
|
||||
export const listenToEvents = (editor, compileTabLogic) => (dispatch: React.Dispatch<any>) => { |
||||
editor.event.register('sessionSwitched', () => { |
||||
dispatch(setEditorMode('sessionSwitched')) |
||||
}) |
||||
|
||||
compileTabLogic.event.on('startingCompilation', () => { |
||||
dispatch(setCompilerMode('startingCompilation')) |
||||
}) |
||||
|
||||
compileTabLogic.compiler.event.register('compilationDuration', (speed) => { |
||||
dispatch(setCompilerMode('compilationDuration', speed)) |
||||
}) |
||||
|
||||
editor.event.register('contentChanged', () => { |
||||
dispatch(setEditorMode('contentChanged')) |
||||
}) |
||||
|
||||
compileTabLogic.compiler.event.register('loadingCompiler', () => { |
||||
dispatch(setCompilerMode('compilationDuration')) |
||||
}) |
||||
|
||||
compileTabLogic.compiler.event.register('compilerLoaded', () => { |
||||
dispatch(setCompilerMode('compilerLoaded')) |
||||
}) |
||||
|
||||
compileTabLogic.compiler.event.register('compilationFinished', (success, data, source) => { |
||||
dispatch(setCompilerMode('compilationFinished', success, data, source)) |
||||
}) |
||||
} |
||||
@ -0,0 +1,582 @@ |
||||
import React, { useEffect, useState, useRef, useReducer } from 'react' // eslint-disable-line
|
||||
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-project/remix-solidity' // @ts-ignore
|
||||
import { compilerReducer, compilerInitialState } from './reducers/compiler' |
||||
import { resetEditorMode, listenToEvents } from './actions/compiler' |
||||
|
||||
import './css/style.css' |
||||
|
||||
export const CompilerContainer = (props: CompilerContainerProps) => { |
||||
const { editor, config, queryParams, compileTabLogic, tooltip, modal, compiledFileName, setHardHatCompilation, updateCurrentVersion, isHardHatProject, configurationSettings } = props // eslint-disable-line
|
||||
const [state, setState] = useState({ |
||||
hideWarnings: false, |
||||
autoCompile: false, |
||||
optimise: false, |
||||
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: '', |
||||
runs: '', |
||||
compiledFileName: '', |
||||
includeNightlies: false, |
||||
language: '', |
||||
evmVersion: '' |
||||
}) |
||||
const compileIcon = useRef(null) |
||||
const warningIcon = useRef(null) |
||||
const promptMessageInput = useRef(null) |
||||
const [hhCompilation, sethhCompilation] = useState(false) |
||||
const [compilerContainer, dispatch] = useReducer(compilerReducer, compilerInitialState) |
||||
|
||||
useEffect(() => { |
||||
fetchAllVersion((allversions, selectedVersion, isURL) => { |
||||
setState(prevState => { |
||||
return { ...prevState, allversions } |
||||
}) |
||||
if (isURL) _updateVersionSelector(state.defaultVersion, selectedVersion) |
||||
else { |
||||
setState(prevState => { |
||||
return { ...prevState, selectedVersion } |
||||
}) |
||||
updateCurrentVersion(selectedVersion) |
||||
_updateVersionSelector(selectedVersion) |
||||
} |
||||
}) |
||||
const currentFileName = config.get('currentFile') |
||||
|
||||
currentFile(currentFileName) |
||||
listenToEvents(editor, compileTabLogic)(dispatch) |
||||
}, []) |
||||
|
||||
useEffect(() => { |
||||
if (compileTabLogic && compileTabLogic.compiler) { |
||||
setState(prevState => { |
||||
const params = queryParams.get() |
||||
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, |
||||
runs: (runs !== null) && (runs !== 'null') && (runs !== undefined) && (runs !== 'undefined') ? runs : 200, |
||||
evmVersion: (evmVersion !== null) && (evmVersion !== 'null') && (evmVersion !== undefined) && (evmVersion !== 'undefined') ? evmVersion : 'default' |
||||
} |
||||
}) |
||||
} |
||||
}, [compileTabLogic]) |
||||
|
||||
useEffect(() => { |
||||
setState(prevState => { |
||||
return { ...prevState, compiledFileName } |
||||
}) |
||||
}, [compiledFileName]) |
||||
|
||||
useEffect(() => { |
||||
if (compilerContainer.compiler.mode) { |
||||
switch (compilerContainer.compiler.mode) { |
||||
case 'startingCompilation': |
||||
startingCompilation() |
||||
break |
||||
case 'compilationDuration': |
||||
compilationDuration(compilerContainer.compiler.args[0]) |
||||
break |
||||
case 'loadingCompiler': |
||||
loadingCompiler() |
||||
break |
||||
case 'compilerLoaded': |
||||
compilerLoaded() |
||||
break |
||||
case 'compilationFinished': |
||||
compilationFinished() |
||||
break |
||||
} |
||||
} |
||||
}, [compilerContainer.compiler.mode]) |
||||
|
||||
useEffect(() => { |
||||
if (compilerContainer.editor.mode) { |
||||
switch (compilerContainer.editor.mode) { |
||||
case 'sessionSwitched': |
||||
sessionSwitched() |
||||
resetEditorMode()(dispatch) |
||||
break |
||||
case 'contentChanged': |
||||
contentChanged() |
||||
resetEditorMode()(dispatch) |
||||
break |
||||
} |
||||
} |
||||
}, [compilerContainer.editor.mode]) |
||||
|
||||
useEffect(() => { |
||||
if (configurationSettings) { |
||||
setConfiguration(configurationSettings) |
||||
} |
||||
}, [configurationSettings]) |
||||
|
||||
// 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: any = await promisedMiniXhr(`${baseURLBin}/list.json`) |
||||
// fetch wasm builds
|
||||
const wasmRes: any = 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(state.selectedVersion) |
||||
// 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) { |
||||
setState((prevState) => { |
||||
return { ...prevState, selectedVersion: compilerPath } |
||||
}) |
||||
_updateVersionSelector(compilerPath) |
||||
} |
||||
} |
||||
} |
||||
}) |
||||
} |
||||
|
||||
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 sessionSwitched = () => { |
||||
if (!compileIcon.current) return |
||||
scheduleCompilation() |
||||
} |
||||
|
||||
const startingCompilation = () => { |
||||
if (!compileIcon.current) return |
||||
compileIcon.current.setAttribute('title', 'compiling...') |
||||
compileIcon.current.classList.remove('remixui_bouncingIcon') |
||||
compileIcon.current.classList.add('remixui_spinningIcon') |
||||
} |
||||
|
||||
const compilationDuration = (speed: number) => { |
||||
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' |
||||
} |
||||
} |
||||
|
||||
const contentChanged = () => { |
||||
if (!compileIcon.current) return |
||||
scheduleCompilation() |
||||
compileIcon.current.classList.add('remixui_bouncingIcon') // @TODO: compileView tab
|
||||
} |
||||
|
||||
const loadingCompiler = () => { |
||||
if (!compileIcon.current) return |
||||
compileIcon.current.setAttribute('title', 'compiler is loading, please wait a few moments.') |
||||
compileIcon.current.classList.add('remixui_spinningIcon') |
||||
warningIcon.current.style.visibility = 'hidden' |
||||
_updateLanguageSelector() |
||||
} |
||||
|
||||
const compilerLoaded = () => { |
||||
if (!compileIcon.current) return |
||||
compileIcon.current.setAttribute('title', '') |
||||
compileIcon.current.classList.remove('remixui_spinningIcon') |
||||
if (state.autoCompile) compile() |
||||
} |
||||
|
||||
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 = () => { |
||||
if (!state.autoCompile) return |
||||
if (state.compileTimeout) window.clearTimeout(state.compileTimeout) |
||||
const compileTimeout = window.setTimeout(() => { |
||||
state.autoCompile && compile() |
||||
}, state.timeout) |
||||
|
||||
setState(prevState => { |
||||
return { ...prevState, compileTimeout } |
||||
}) |
||||
} |
||||
|
||||
const compile = () => { |
||||
const currentFile = config.get('currentFile') |
||||
|
||||
if (!isSolFileSelected()) return |
||||
|
||||
_setCompilerVersionFromPragma(currentFile) |
||||
compileTabLogic.runCompiler() |
||||
} |
||||
|
||||
const _retrieveVersion = (version?) => { |
||||
if (!version) version = state.selectedVersion |
||||
if (version === 'builtin') version = state.defaultVersion |
||||
return semver.coerce(version) ? semver.coerce(version).version : '' |
||||
} |
||||
|
||||
const _updateVersionSelector = (version, customUrl = '') => { |
||||
// update selectedversion of previous one got filtered out
|
||||
let selectedVersion = version |
||||
if (!selectedVersion || !_shouldBeAdded(selectedVersion)) { |
||||
selectedVersion = state.defaultVersion |
||||
setState(prevState => { |
||||
return { ...prevState, selectedVersion } |
||||
}) |
||||
} |
||||
updateCurrentVersion(selectedVersion) |
||||
queryParams.update({ version: selectedVersion }) |
||||
let url |
||||
|
||||
if (customUrl !== '') { |
||||
selectedVersion = customUrl |
||||
setState(prevState => { |
||||
return { ...prevState, selectedVersion, customVersions: [...state.customVersions, selectedVersion] } |
||||
}) |
||||
updateCurrentVersion(selectedVersion) |
||||
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 { |
||||
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) |
||||
} else { |
||||
compileTabLogic.compiler.loadVersion(false, url) |
||||
} |
||||
} |
||||
|
||||
const _shouldBeAdded = (version) => { |
||||
return !version.includes('nightly') || |
||||
(version.includes('nightly') && state.includeNightlies) |
||||
} |
||||
|
||||
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', () => {}) |
||||
} |
||||
|
||||
const promptMessage = (message) => { |
||||
return ( |
||||
<> |
||||
<span>{ message }</span> |
||||
<input type="text" data-id="modalDialogCustomPromptCompiler" className="form-control" ref={promptMessageInput} /> |
||||
</> |
||||
) |
||||
} |
||||
|
||||
const addCustomCompiler = () => { |
||||
const url = promptMessageInput.current.value |
||||
|
||||
setState(prevState => { |
||||
return { ...prevState, selectedVersion: url } |
||||
}) |
||||
_updateVersionSelector(state.defaultVersion, url) |
||||
} |
||||
|
||||
const handleLoadVersion = (value) => { |
||||
setState(prevState => { |
||||
return { ...prevState, selectedVersion: value } |
||||
}) |
||||
updateCurrentVersion(value) |
||||
_updateVersionSelector(value) |
||||
_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')) { |
||||
handleLanguageChange('Solidity') |
||||
compileTabLogic.setLanguage('Solidity') |
||||
} |
||||
} |
||||
|
||||
const handleAutoCompile = (e) => { |
||||
const checked = e.target.checked |
||||
|
||||
config.set('autoCompile', checked) |
||||
setState(prevState => { |
||||
return { ...prevState, autoCompile: checked } |
||||
}) |
||||
} |
||||
|
||||
const handleOptimizeChange = (value) => { |
||||
const checked = !!value |
||||
|
||||
config.set('optimise', checked) |
||||
compileTabLogic.setOptimize(checked) |
||||
if (compileTabLogic.optimize) { |
||||
compileTabLogic.setRuns(parseInt(state.runs)) |
||||
} else { |
||||
compileTabLogic.setRuns(200) |
||||
} |
||||
state.autoCompile && compile() |
||||
setState(prevState => { |
||||
return { ...prevState, optimise: checked } |
||||
}) |
||||
} |
||||
|
||||
const onChangeRuns = (value) => { |
||||
const runs = value |
||||
|
||||
compileTabLogic.setRuns(parseInt(runs)) |
||||
state.autoCompile && compile() |
||||
setState(prevState => { |
||||
return { ...prevState, runs } |
||||
}) |
||||
} |
||||
|
||||
const handleHideWarningsChange = (e) => { |
||||
const checked = e.target.checked |
||||
|
||||
config.set('hideWarnings', checked) |
||||
state.autoCompile && compile() |
||||
setState(prevState => { |
||||
return { ...prevState, hideWarnings: checked } |
||||
}) |
||||
} |
||||
|
||||
const handleNightliesChange = (e) => { |
||||
const checked = e.target.checked |
||||
|
||||
config.set('includeNightlies', checked) |
||||
setState(prevState => { |
||||
return { ...prevState, includeNightlies: checked } |
||||
}) |
||||
} |
||||
|
||||
const handleLanguageChange = (value) => { |
||||
compileTabLogic.setLanguage(value) |
||||
state.autoCompile && compile() |
||||
setState(prevState => { |
||||
return { ...prevState, language: value } |
||||
}) |
||||
} |
||||
|
||||
const handleEvmVersionChange = (value) => { |
||||
if (!value) return |
||||
let v = value |
||||
if (v === 'default') { |
||||
v = null |
||||
} |
||||
compileTabLogic.setEvmVersion(v) |
||||
state.autoCompile && compile() |
||||
setState(prevState => { |
||||
return { ...prevState, evmVersion: value } |
||||
}) |
||||
} |
||||
|
||||
const updatehhCompilation = (event) => { |
||||
const checked = event.target.checked |
||||
|
||||
sethhCompilation(checked) |
||||
setHardHatCompilation(checked) |
||||
} |
||||
|
||||
/* |
||||
The following functions map with the above event handlers. |
||||
They are an external API for modifying the compiler configuration. |
||||
*/ |
||||
const setConfiguration = (settings: ConfigurationSettings) => { |
||||
handleLoadVersion(`soljson-v${settings.version}.js`) |
||||
handleEvmVersionChange(settings.evmVersion) |
||||
handleLanguageChange(settings.language) |
||||
handleOptimizeChange(settings.optimize) |
||||
onChangeRuns(settings.runs) |
||||
} |
||||
|
||||
return ( |
||||
<section> |
||||
<article> |
||||
<header className='remixui_compilerSection border-bottom'> |
||||
<div className="mb-2"> |
||||
<label className="remixui_compilerLabel form-check-label" htmlFor="versionSelector"> |
||||
Compiler |
||||
<button className="far fa-plus-square border-0 p-0 mx-2 btn-sm" onClick={promptCompiler} title="Add a custom compiler with URL"></button> |
||||
</label> |
||||
<select value={ state.selectedVersion || state.defaultVersion } onChange={(e) => handleLoadVersion(e.target.value) } className="custom-select" id="versionSelector" disabled={state.allversions.length <= 0}> |
||||
{ state.allversions.length <= 0 && <option disabled data-id={state.selectedVersion === state.defaultVersion ? 'selected' : ''}>{ state.defaultVersion }</option> } |
||||
{ state.allversions.length <= 0 && <option disabled data-id={state.selectedVersion === 'builtin' ? 'selected' : ''}>builtin</option> } |
||||
{ state.customVersions.map((url, i) => <option key={i} data-id={state.selectedVersion === url ? 'selected' : ''} value={url}>custom</option>)} |
||||
{ state.allversions.map((build, i) => { |
||||
return _shouldBeAdded(build.longVersion) |
||||
? <option key={i} value={build.path} data-id={state.selectedVersion === build.path ? 'selected' : ''}>{build.longVersion}</option> |
||||
: null |
||||
}) |
||||
} |
||||
</select> |
||||
</div> |
||||
<div className="mb-2 remixui_nightlyBuilds custom-control custom-checkbox"> |
||||
<input className="mr-2 custom-control-input" id="nightlies" type="checkbox" onChange={handleNightliesChange} checked={state.includeNightlies} /> |
||||
<label htmlFor="nightlies" data-id="compilerNightliesBuild" className="form-check-label custom-control-label">Include nightly builds</label> |
||||
</div> |
||||
<div className="mb-2"> |
||||
<label className="remixui_compilerLabel form-check-label" htmlFor="compilierLanguageSelector">Language</label> |
||||
<select onChange={(e) => handleLanguageChange(e.target.value)} value={state.language} className="custom-select" id="compilierLanguageSelector" title="Available since v0.5.7"> |
||||
<option value='Solidity'>Solidity</option> |
||||
<option value='Yul'>Yul</option> |
||||
</select> |
||||
</div> |
||||
<div className="mb-2"> |
||||
<label className="remixui_compilerLabel form-check-label" htmlFor="evmVersionSelector">EVM Version</label> |
||||
<select value={state.evmVersion} onChange={(e) => handleEvmVersionChange(e.target.value)} className="custom-select" id="evmVersionSelector"> |
||||
<option data-id={state.evmVersion === 'default' ? 'selected' : ''} value="default">compiler default</option> |
||||
<option data-id={state.evmVersion === 'muirGlacier' ? 'selected' : ''} value="muirGlacier">muirGlacier</option> |
||||
<option data-id={state.evmVersion === 'istanbul' ? 'selected' : ''} value="istanbul">istanbul</option> |
||||
<option data-id={state.evmVersion === 'petersburg' ? 'selected' : ''} value="petersburg">petersburg</option> |
||||
<option data-id={state.evmVersion === 'constantinople' ? 'selected' : ''} value="constantinople">constantinople</option> |
||||
<option data-id={state.evmVersion === 'byzantium' ? 'selected' : ''} value="byzantium">byzantium</option> |
||||
<option data-id={state.evmVersion === 'spuriousDragon' ? 'selected' : ''} value="spuriousDragon">spuriousDragon</option> |
||||
<option data-id={state.evmVersion === 'tangerineWhistle' ? 'selected' : ''} value="tangerineWhistle">tangerineWhistle</option> |
||||
<option data-id={state.evmVersion === 'homestead' ? 'selected' : ''} value="homestead">homestead</option> |
||||
</select> |
||||
</div> |
||||
<div className="mt-3"> |
||||
<p className="mt-2 remixui_compilerLabel">Compiler Configuration</p> |
||||
<div className="mt-2 remixui_compilerConfig custom-control custom-checkbox"> |
||||
<input className="remixui_autocompile custom-control-input" type="checkbox" onChange={handleAutoCompile} data-id="compilerContainerAutoCompile" id="autoCompile" title="Auto compile" checked={state.autoCompile} /> |
||||
<label className="form-check-label custom-control-label" htmlFor="autoCompile">Auto compile</label> |
||||
</div> |
||||
<div className="mt-2 remixui_compilerConfig custom-control custom-checkbox"> |
||||
<div className="justify-content-between align-items-center d-flex"> |
||||
<input onChange={(e) => { handleOptimizeChange(e.target.checked) }} className="custom-control-input" id="optimize" type="checkbox" checked={state.optimise} /> |
||||
<label className="form-check-label custom-control-label" htmlFor="optimize">Enable optimization</label> |
||||
<input |
||||
min="1" |
||||
className="custom-select ml-2 remixui_runs" |
||||
id="runs" |
||||
placeholder="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)} |
||||
disabled={!state.optimise} |
||||
/> |
||||
</div> |
||||
</div> |
||||
<div className="mt-2 remixui_compilerConfig custom-control custom-checkbox"> |
||||
<input className="remixui_autocompile custom-control-input" onChange={handleHideWarningsChange} id="hideWarningsBox" type="checkbox" title="Hide warnings" checked={state.hideWarnings} /> |
||||
<label className="form-check-label custom-control-label" htmlFor="hideWarningsBox">Hide warnings</label> |
||||
</div> |
||||
</div> |
||||
{ |
||||
isHardHatProject && <div className="mt-2 remixui_compilerConfig custom-control custom-checkbox"> |
||||
<input className="remixui_autocompile custom-control-input" onChange={updatehhCompilation} id="enableHardhat" type="checkbox" title="Enable Hardhat Compilation" checked={hhCompilation} /> |
||||
<label className="form-check-label custom-control-label" htmlFor="enableHardhat">Enable Hardhat Compilation</label> |
||||
</div> |
||||
} |
||||
<button id="compileBtn" data-id="compilerContainerCompileBtn" className="btn btn-primary btn-block remixui_disabled mt-3" title="Compile" onClick={compile} disabled={!state.compiledFileName || (state.compiledFileName && !isSolFileSelected(state.compiledFileName))}> |
||||
<span> |
||||
<i ref={warningIcon} title="Compilation Slow" style={{ visibility: 'hidden' }} className="remixui_warnCompilationSlow fas fa-exclamation-triangle" aria-hidden="true"></i> |
||||
{ warningIcon.current && warningIcon.current.style.visibility === 'hidden' && <i ref={compileIcon} className="fas fa-sync remixui_icon" aria-hidden="true"></i> } |
||||
Compile { state.compiledFileName || '<no file selected>' } |
||||
</span> |
||||
</button> |
||||
</header> |
||||
</article> |
||||
</section> |
||||
) |
||||
} |
||||
|
||||
export default CompilerContainer |
||||
@ -0,0 +1,238 @@ |
||||
import React, { useState, useEffect } from 'react' // eslint-disable-line
|
||||
import { ContractSelectionProps } from './types' |
||||
import { PublishToStorage } from '@remix-ui/publish-to-storage' // eslint-disable-line
|
||||
import { TreeView, TreeViewItem } from '@remix-ui/tree-view' // eslint-disable-line
|
||||
import { CopyToClipboard } from '@remix-ui/clipboard' // eslint-disable-line
|
||||
|
||||
import './css/style.css' |
||||
|
||||
export const ContractSelection = (props: ContractSelectionProps) => { |
||||
const { contractMap, fileProvider, fileManager, contractsDetails, modal } = props |
||||
const [contractList, setContractList] = useState([]) |
||||
const [selectedContract, setSelectedContract] = useState('') |
||||
const [storage, setStorage] = useState(null) |
||||
|
||||
useEffect(() => { |
||||
const contractList = contractMap ? Object.keys(contractMap).map((key) => ({ |
||||
name: key, |
||||
file: getFileName(contractMap[key].file) |
||||
})) : [] |
||||
|
||||
setContractList(contractList) |
||||
if (contractList.length) setSelectedContract(contractList[0].name) |
||||
}, [contractMap, contractsDetails]) |
||||
|
||||
const resetStorage = () => { |
||||
setStorage('') |
||||
} |
||||
|
||||
// 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 handleContractChange = (contractName: string) => { |
||||
setSelectedContract(contractName) |
||||
} |
||||
|
||||
const handlePublishToStorage = (type) => { |
||||
setStorage(type) |
||||
} |
||||
|
||||
const copyABI = () => { |
||||
return copyContractProperty('abi') |
||||
} |
||||
|
||||
const copyContractProperty = (property) => { |
||||
let content = getContractProperty(property) |
||||
if (!content) { |
||||
return |
||||
} |
||||
|
||||
try { |
||||
if (typeof content !== 'string') { |
||||
content = JSON.stringify(content, null, '\t') |
||||
} |
||||
} catch (e) {} |
||||
|
||||
return content |
||||
} |
||||
|
||||
const getContractProperty = (property) => { |
||||
if (!selectedContract) throw new Error('No contract compiled yet') |
||||
const contractProperties = contractsDetails[selectedContract] |
||||
|
||||
if (contractProperties && contractProperties[property]) return contractProperties[property] |
||||
return null |
||||
} |
||||
|
||||
const renderData = (item, key: string | number, keyPath: string) => { |
||||
const data = extractData(item) |
||||
const children = (data.children || []).map((child) => renderData(child.value, child.key, keyPath + '/' + child.key)) |
||||
|
||||
if (children && children.length > 0) { |
||||
return ( |
||||
<TreeViewItem id={`treeViewItem${key}`} key={keyPath} label={ |
||||
<div className="d-flex mt-2 flex-row remixui_label_item"> |
||||
<label className="small font-weight-bold pr-1 remixui_label_key">{ key }:</label> |
||||
<label className="m-0 remixui_label_value">{ typeof data.self === 'boolean' ? `${data.self}` : data.self }</label> |
||||
</div> |
||||
}> |
||||
<TreeView id={`treeView${key}`} key={keyPath}> |
||||
{children} |
||||
</TreeView> |
||||
</TreeViewItem> |
||||
) |
||||
} else { |
||||
return <TreeViewItem id={key.toString()} key={keyPath} label={ |
||||
<div className="d-flex mt-2 flex-row remixui_label_item"> |
||||
<label className="small font-weight-bold pr-1 remixui_label_key">{ key }:</label> |
||||
<label className="m-0 remixui_label_value">{ typeof data.self === 'boolean' ? `${data.self}` : data.self }</label> |
||||
</div> |
||||
} /> |
||||
} |
||||
} |
||||
|
||||
const extractData = (item) => { |
||||
const ret = { children: null, self: null } |
||||
|
||||
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 |
||||
} |
||||
|
||||
const insertValue = (details, propertyName) => { |
||||
let node |
||||
if (propertyName === 'web3Deploy' || propertyName === 'name' || propertyName === 'Assembly') { |
||||
node = <pre>{ details[propertyName] }</pre> |
||||
} else if (propertyName === 'abi' || propertyName === 'metadata') { |
||||
if (details[propertyName] !== '') { |
||||
try { |
||||
node = <div> |
||||
{ (typeof details[propertyName] === 'object') |
||||
? <TreeView id="treeView"> |
||||
{ |
||||
Object.keys(details[propertyName]).map((innerkey) => renderData(details[propertyName][innerkey], innerkey, innerkey)) |
||||
} |
||||
</TreeView> : <TreeView id="treeView"> |
||||
{ |
||||
Object.keys(JSON.parse(details[propertyName])).map((innerkey) => renderData(JSON.parse(details[propertyName])[innerkey], innerkey, innerkey)) |
||||
} |
||||
</TreeView> |
||||
} |
||||
</div> // catch in case the parsing fails.
|
||||
} catch (e) { |
||||
node = <div>Unable to display "${propertyName}": ${e.message}</div> |
||||
} |
||||
} else { |
||||
node = <div> - </div> |
||||
} |
||||
} else { |
||||
node = <div>{JSON.stringify(details[propertyName], null, 4)}</div> |
||||
} |
||||
return <pre className="remixui_value">{node || ''}</pre> |
||||
} |
||||
|
||||
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', |
||||
'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' |
||||
} |
||||
const contractProperties = contractsDetails[selectedContract] || {} |
||||
const log = <div className="remixui_detailsJSON"> |
||||
{ |
||||
Object.keys(contractProperties).map((propertyName, index) => { |
||||
const copyDetails = <span className="remixui_copyDetails"><CopyToClipboard content={contractProperties[propertyName]} direction='top' /></span> |
||||
const questionMark = <span className="remixui_questionMark"><i title={ help[propertyName] } className="fas fa-question-circle" aria-hidden="true"></i></span> |
||||
|
||||
return (<div className="remixui_log" key={index}> |
||||
<div className="remixui_key">{ propertyName } { copyDetails } { questionMark }</div> |
||||
{ insertValue(contractProperties, propertyName) } |
||||
</div>) |
||||
}) |
||||
} |
||||
</div> |
||||
|
||||
modal(selectedContract, log, 'Close', null) |
||||
} |
||||
|
||||
const copyBytecode = () => { |
||||
return copyContractProperty('bytecode') |
||||
} |
||||
|
||||
return ( |
||||
// define swarm logo
|
||||
<> |
||||
{ contractList.length |
||||
? <section className="remixui_compilerSection pt-3"> |
||||
{/* Select Compiler Version */} |
||||
<div className="mb-3"> |
||||
<label className="remixui_compilerLabel form-check-label" htmlFor="compiledContracts">Contract</label> |
||||
<select onChange={(e) => handleContractChange(e.target.value)} value={selectedContract} data-id="compiledContracts" id="compiledContracts" className="custom-select"> |
||||
{ contractList.map(({ name, file }, index) => <option value={name} key={index}>{name} ({file})</option>)} |
||||
</select> |
||||
</div> |
||||
<article className="mt-2 pb-0"> |
||||
<button id="publishOnSwarm" className="btn btn-secondary btn-block" title="Publish on Swarm" onClick={() => { handlePublishToStorage('swarm') }}> |
||||
<span>Publish on Swarm</span> |
||||
<img id="swarmLogo" className="remixui_storageLogo ml-2" src="assets/img/swarm.webp" /> |
||||
</button> |
||||
<button id="publishOnIpfs" className="btn btn-secondary btn-block" title="Publish on Ipfs" onClick={() => { handlePublishToStorage('ipfs') }}> |
||||
<span>Publish on Ipfs</span> |
||||
<img id="ipfsLogo" className="remixui_storageLogo ml-2" src="assets/img/ipfs.webp" /> |
||||
</button> |
||||
<button data-id="compilation-details" className="btn btn-secondary btn-block" title="Display Contract Details" onClick={() => { details() }}> |
||||
Compilation Details |
||||
</button> |
||||
{/* Copy to Clipboard */} |
||||
<div className="remixui_contractHelperButtons"> |
||||
<div className="input-group"> |
||||
<div className="btn-group" role="group" aria-label="Copy to Clipboard"> |
||||
<CopyToClipboard title="Copy ABI to clipboard" content={copyABI()} direction='top'> |
||||
<button className="btn remixui_copyButton" title="Copy ABI to clipboard"> |
||||
<i className="remixui_copyIcon far fa-copy" aria-hidden="true"></i> |
||||
<span>ABI</span> |
||||
</button> |
||||
</CopyToClipboard> |
||||
<CopyToClipboard title="Copy ABI to clipboard" content={copyBytecode()} direction='top'> |
||||
<button className="btn remixui_copyButton" title="Copy Bytecode to clipboard"> |
||||
<i className="remixui_copyIcon far fa-copy" aria-hidden="true"></i> |
||||
<span>Bytecode</span> |
||||
</button> |
||||
</CopyToClipboard> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</article> |
||||
</section> : <section className="remixui_container clearfix"><article className="px-2 mt-2 pb-0 d-flex w-100"> |
||||
<span className="mt-2 mx-3 w-100 alert alert-warning" role="alert">No Contract Compiled Yet</span> |
||||
</article></section> |
||||
} |
||||
<PublishToStorage storage={storage} fileManager={fileManager} fileProvider={fileProvider} contract={contractsDetails[selectedContract]} resetStorage={resetStorage} /> |
||||
</> |
||||
) |
||||
} |
||||
|
||||
export default ContractSelection |
||||
@ -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; } |
||||
} |
||||
@ -0,0 +1,128 @@ |
||||
import { Plugin } from '@remixproject/engine' |
||||
|
||||
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 class CompileTab extends Plugin { |
||||
public compiler |
||||
public optimize |
||||
public runs |
||||
public evmVersion: string |
||||
public compilerImport |
||||
public event |
||||
|
||||
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.call('contentImport', '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 && this.runs !== 'undefined' ? 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) |
||||
}) |
||||
}) |
||||
} |
||||
|
||||
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) |
||||
} |
||||
} |
||||
} |
||||
@ -0,0 +1,51 @@ |
||||
'use strict' |
||||
import * as remixLib from '@remix-project/remix-lib' |
||||
|
||||
const txHelper = remixLib.execution.txHelper |
||||
|
||||
export class CompilerAbstract { |
||||
public languageversion: string |
||||
public data: Record<string, any> |
||||
public source: Record<string, any> |
||||
|
||||
constructor (languageversion, data, source) { |
||||
this.languageversion = languageversion |
||||
this.data = data |
||||
this.source = source // source code
|
||||
} |
||||
|
||||
getContracts () { |
||||
return this.data.contracts |
||||
} |
||||
|
||||
getContract (name) { |
||||
return txHelper.getContract(name, this.data.contracts) |
||||
} |
||||
|
||||
visitContracts (calllback) { |
||||
return txHelper.visitContracts(this.data.contracts, calllback) |
||||
} |
||||
|
||||
getData () { |
||||
return this.data |
||||
} |
||||
|
||||
getAsts () { |
||||
return this.data.sources // ast
|
||||
} |
||||
|
||||
getSourceName (fileIndex) { |
||||
if (this.data && this.data.sources) { |
||||
return Object.keys(this.data.sources)[fileIndex] |
||||
} else if (Object.keys(this.source.sources).length === 1) { |
||||
// if we don't have ast, we return the only one filename present.
|
||||
const sourcesArray = Object.keys(this.source.sources) |
||||
return sourcesArray[0] |
||||
} |
||||
return null |
||||
} |
||||
|
||||
getSourceCode () { |
||||
return this.source |
||||
} |
||||
} |
||||
@ -0,0 +1,19 @@ |
||||
'use strict' |
||||
import { canUseWorker, urlFromVersion } from './compiler-utils' |
||||
import { Compiler } from '@remix-project/remix-solidity' |
||||
import { CompilerAbstract } from './compiler-abstract' |
||||
|
||||
export const compile = async (compilationTargets, settings, contentResolverCallback) => { |
||||
return new Promise((resolve) => { |
||||
const compiler = new Compiler(contentResolverCallback) |
||||
compiler.set('evmVersion', settings.evmVersion) |
||||
compiler.set('optimize', settings.optimize) |
||||
compiler.set('language', settings.language) |
||||
compiler.set('runs', settings.runs) |
||||
compiler.loadVersion(canUseWorker(settings.version), urlFromVersion(settings.version)) |
||||
compiler.event.register('compilationFinished', (success, compilationData, source) => { |
||||
resolve(new CompilerAbstract(settings.version, compilationData, source)) |
||||
}) |
||||
compiler.event.register('compilerLoaded', () => compiler.compile(compilationTargets, '')) |
||||
}) |
||||
} |
||||
@ -0,0 +1,46 @@ |
||||
const semver = require('semver') |
||||
const minixhr = require('minixhr') |
||||
/* global Worker */ |
||||
|
||||
export const baseURLBin = 'https://binaries.soliditylang.org/bin' |
||||
export const baseURLWasm = 'https://binaries.soliditylang.org/wasm' |
||||
|
||||
export const pathToURL = {} |
||||
|
||||
/** |
||||
* Retrieves the URL of the given compiler version |
||||
* @param version is the version of compiler with or without 'soljson-v' prefix and .js postfix |
||||
*/ |
||||
export function urlFromVersion (version) { |
||||
if (!version.startsWith('soljson-v')) version = 'soljson-v' + version |
||||
if (!version.endsWith('.js')) version = version + '.js' |
||||
return `${pathToURL[version]}/${version}` |
||||
} |
||||
|
||||
/** |
||||
* Checks if the worker can be used to load a compiler. |
||||
* checks a compiler whitelist, browser support and OS. |
||||
*/ |
||||
export function canUseWorker (selectedVersion) { |
||||
const version = semver.coerce(selectedVersion) |
||||
const isNightly = selectedVersion.includes('nightly') |
||||
return browserSupportWorker() && ( |
||||
// All compiler versions (including nightlies) after 0.6.3 are wasm compiled
|
||||
semver.gt(version, '0.6.3') || |
||||
// Only releases are wasm compiled starting with 0.3.6
|
||||
(semver.gte(version, '0.3.6') && !isNightly) |
||||
) |
||||
} |
||||
|
||||
function browserSupportWorker () { |
||||
return document.location.protocol !== 'file:' && Worker !== undefined |
||||
} |
||||
|
||||
// returns a promise for minixhr
|
||||
export function promisedMiniXhr (url) { |
||||
return new Promise((resolve) => { |
||||
minixhr(url, (json, event) => { |
||||
resolve({ json, event }) |
||||
}) |
||||
}) |
||||
} |
||||
@ -0,0 +1,119 @@ |
||||
'use strict' |
||||
import * as solcTranslate from 'solc/translate' |
||||
import * as remixLib from '@remix-project/remix-lib' |
||||
|
||||
const txHelper = remixLib.execution.txHelper |
||||
|
||||
export function parseContracts (contractName, contract, source) { |
||||
const detail: Record<string, any> = {} |
||||
|
||||
detail.name = contractName |
||||
detail.metadata = contract.metadata |
||||
if (contract.evm.bytecode.object) { |
||||
detail.bytecode = contract.evm.bytecode.object |
||||
} |
||||
|
||||
detail.abi = contract.abi |
||||
|
||||
if (contract.evm.bytecode.object) { |
||||
detail.bytecode = contract.evm.bytecode |
||||
detail.web3Deploy = gethDeploy(contractName.toLowerCase(), contract.abi, contract.evm.bytecode.object) |
||||
|
||||
detail.metadataHash = retrieveMetadataHash(contract.evm.bytecode.object) |
||||
if (detail.metadataHash) { |
||||
detail.swarmLocation = 'bzzr://' + detail.metadataHash |
||||
} |
||||
} |
||||
|
||||
detail.functionHashes = {} |
||||
for (const fun in contract.evm.methodIdentifiers) { |
||||
detail.functionHashes[contract.evm.methodIdentifiers[fun]] = fun |
||||
} |
||||
|
||||
detail.gasEstimates = formatGasEstimates(contract.evm.gasEstimates) |
||||
|
||||
detail.devdoc = contract.devdoc |
||||
detail.userdoc = contract.userdoc |
||||
|
||||
if (contract.evm.deployedBytecode && contract.evm.deployedBytecode.object.length > 0) { |
||||
detail['Runtime Bytecode'] = contract.evm.deployedBytecode |
||||
} |
||||
|
||||
if (source && contract.assembly !== null) { |
||||
detail.Assembly = solcTranslate.prettyPrintLegacyAssemblyJSON(contract.evm.legacyAssembly, source.content) |
||||
} |
||||
|
||||
return detail |
||||
} |
||||
|
||||
const retrieveMetadataHash = function (bytecode) { |
||||
var match = /a165627a7a72305820([0-9a-f]{64})0029$/.exec(bytecode) |
||||
if (!match) { |
||||
match = /a265627a7a72305820([0-9a-f]{64})6c6578706572696d656e74616cf50037$/.exec(bytecode) |
||||
} |
||||
if (match) { |
||||
return match[1] |
||||
} |
||||
} |
||||
|
||||
const gethDeploy = function (contractName, jsonInterface, bytecode) { |
||||
let code = '' |
||||
const funABI = txHelper.getConstructorInterface(jsonInterface) |
||||
|
||||
funABI.inputs.forEach(function (inp) { |
||||
code += 'var ' + inp.name + ' = /* var of type ' + inp.type + ' here */ ;\n' |
||||
}) |
||||
|
||||
contractName = contractName.replace(/[:./]/g, '_') |
||||
code += 'var ' + contractName + 'Contract = new web3.eth.Contract(' + JSON.stringify(jsonInterface).replace('\n', '') + ');' + |
||||
'\nvar ' + contractName + ' = ' + contractName + 'Contract.deploy({' + |
||||
"\n data: '0x" + bytecode + "', " + |
||||
'\n arguments: [' |
||||
|
||||
funABI.inputs.forEach(function (inp) { |
||||
code += '\n ' + inp.name + ',' |
||||
}) |
||||
|
||||
code += '\n ]' + |
||||
'\n}).send({' + |
||||
'\n from: web3.eth.accounts[0], ' + |
||||
"\n gas: '4700000'" + |
||||
'\n }, function (e, contract){' + |
||||
'\n console.log(e, contract);' + |
||||
"\n if (typeof contract.address !== 'undefined') {" + |
||||
"\n console.log('Contract mined! address: ' + contract.address + ' transactionHash: ' + contract.transactionHash);" + |
||||
'\n }' + |
||||
'\n })' |
||||
|
||||
return code |
||||
} |
||||
|
||||
const formatGasEstimates = function (data) { |
||||
if (!data) return {} |
||||
if (data.creation === undefined && data.external === undefined && data.internal === undefined) return {} |
||||
|
||||
const gasToText = function (g) { |
||||
return g === null ? 'unknown' : g |
||||
} |
||||
|
||||
const ret: Record<string, any> = {} |
||||
let fun |
||||
if ('creation' in data) { |
||||
ret.Creation = data.creation |
||||
} |
||||
|
||||
if ('external' in data) { |
||||
ret.External = {} |
||||
for (fun in data.external) { |
||||
ret.External[fun] = gasToText(data.external[fun]) |
||||
} |
||||
} |
||||
|
||||
if ('internal' in data) { |
||||
ret.Internal = {} |
||||
for (fun in data.internal) { |
||||
ret.Internal[fun] = gasToText(data.internal[fun]) |
||||
} |
||||
} |
||||
return ret |
||||
} |
||||
@ -0,0 +1,5 @@ |
||||
export * from './compileTabLogic' |
||||
export * from './compiler-abstract' |
||||
export * from './compiler-helpers' |
||||
export * from './compiler-utils' |
||||
export * from './contract-parser' |
||||
@ -0,0 +1,63 @@ |
||||
interface Action { |
||||
type: string; |
||||
payload: Record<string, any>; |
||||
} |
||||
|
||||
export const compilerInitialState = { |
||||
compiler: { |
||||
mode: '', |
||||
args: null |
||||
}, |
||||
editor: { |
||||
mode: '' |
||||
} |
||||
} |
||||
|
||||
export const compilerReducer = (state = compilerInitialState, action: Action) => { |
||||
switch (action.type) { |
||||
case 'SET_COMPILER_MODE': { |
||||
return { |
||||
...state, |
||||
compiler: { |
||||
...state.compiler, |
||||
mode: action.payload.mode, |
||||
args: action.payload.args || null |
||||
} |
||||
} |
||||
} |
||||
|
||||
case 'RESET_COMPILER_MODE': { |
||||
return { |
||||
...state, |
||||
compiler: { |
||||
...state.compiler, |
||||
mode: '', |
||||
args: null |
||||
} |
||||
} |
||||
} |
||||
|
||||
case 'SET_EDITOR_MODE': { |
||||
return { |
||||
...state, |
||||
editor: { |
||||
...state.editor, |
||||
mode: action.payload |
||||
} |
||||
} |
||||
} |
||||
|
||||
case 'RESET_EDITOR_MODE': { |
||||
return { |
||||
...state, |
||||
editor: { |
||||
...state.editor, |
||||
mode: '' |
||||
} |
||||
} |
||||
} |
||||
|
||||
default: |
||||
throw new Error() |
||||
} |
||||
} |
||||
@ -0,0 +1,115 @@ |
||||
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' // 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' // 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 [state, setState] = useState({ |
||||
contractsDetails: {}, |
||||
eventHandlers: {}, |
||||
loading: false, |
||||
compileTabLogic: null, |
||||
compiler: null, |
||||
toasterMsg: '', |
||||
modal: { |
||||
hide: true, |
||||
title: '', |
||||
message: null, |
||||
okLabel: '', |
||||
okFn: () => {}, |
||||
cancelLabel: '', |
||||
cancelFn: () => {}, |
||||
handleHide: null |
||||
} |
||||
}) |
||||
const [currentVersion, setCurrentVersion] = useState('') |
||||
|
||||
const toast = (message: string) => { |
||||
setState(prevState => { |
||||
return { ...prevState, toasterMsg: message } |
||||
}) |
||||
} |
||||
|
||||
const updateCurrentVersion = (value) => { |
||||
setCurrentVersion(value) |
||||
plugin.setSelectedVersion(value) |
||||
} |
||||
|
||||
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, |
||||
hide: false, |
||||
message, |
||||
title, |
||||
okLabel, |
||||
okFn, |
||||
cancelLabel, |
||||
cancelFn |
||||
} |
||||
} |
||||
}) |
||||
} |
||||
|
||||
const handleHideModal = () => { |
||||
setState(prevState => { |
||||
return { ...prevState, modal: { ...state.modal, hide: true, message: null } } |
||||
}) |
||||
} |
||||
|
||||
const panicMessage = (message: string) => ( |
||||
<div> |
||||
<i className="fas fa-exclamation-circle remixui_panicError" aria-hidden="true"></i> |
||||
The compiler returned with the following internal error: <br /> <b>{message}.<br /> |
||||
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).</b><br /> |
||||
Please join <a href="https://gitter.im/ethereum/remix" target="blank" >remix gitter channel</a> for more information. |
||||
</div> |
||||
) |
||||
|
||||
return ( |
||||
<> |
||||
<div id="compileTabView"> |
||||
<CompilerContainer editor={editor} config={config} queryParams={queryParams} compileTabLogic={compileTabLogic} tooltip={toast} modal={modal} compiledFileName={currentFile} setHardHatCompilation={setHardHatCompilation.bind(plugin)} updateCurrentVersion={updateCurrentVersion} isHardHatProject={isHardHatProject} configurationSettings={configurationSettings} /> |
||||
<ContractSelection contractMap={contractMap} fileProvider={fileProvider} fileManager={fileManager} contractsDetails={contractsDetails} modal={modal} /> |
||||
<div className="remixui_errorBlobs p-4" data-id="compiledErrors"> |
||||
<span data-id={`compilationFinishedWith_${currentVersion}`}></span> |
||||
{ compileErrors.error && <Renderer message={compileErrors.error.formattedMessage || compileErrors.error} plugin={plugin} opt={{ type: compileErrors.error.severity || 'error', errorType: compileErrors.error.type }} config={config} editor={editor} fileManager={fileManager} /> } |
||||
{ compileErrors.error && (compileErrors.error.mode === 'panic') && modal('Error', panicMessage(compileErrors.error.formattedMessage), 'Close', null) } |
||||
{ compileErrors.errors && compileErrors.errors.length && compileErrors.errors.map((err, index) => { |
||||
if (config.get('hideWarnings')) { |
||||
if (err.severity !== 'warning') { |
||||
return <Renderer key={index} message={err.formattedMessage} plugin={plugin} opt={{ type: err.severity, errorType: err.type }} config={config} editor={editor} fileManager={fileManager} /> |
||||
} |
||||
} else { |
||||
return <Renderer key={index} message={err.formattedMessage} plugin={plugin} opt={{ type: err.severity, errorType: err.type }} config={config} editor={editor} fileManager={fileManager} /> |
||||
} |
||||
}) } |
||||
</div> |
||||
</div> |
||||
<Toaster message={state.toasterMsg} /> |
||||
<ModalDialog |
||||
id='workspacesModalDialog' |
||||
title={ state.modal.title } |
||||
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 } |
||||
</ModalDialog> |
||||
</> |
||||
) |
||||
} |
||||
|
||||
export default SolidityCompiler |
||||
@ -0,0 +1,54 @@ |
||||
export interface SolidityCompilerProps { |
||||
plugin: { |
||||
contractMap: { |
||||
file: string |
||||
} | Record<string, any> |
||||
compileErrors: any, |
||||
isHardHatProject: boolean, |
||||
queryParams: any, |
||||
compileTabLogic: any, |
||||
currentFile: string, |
||||
contractsDetails: Record<string, any>, |
||||
editor: any, |
||||
config: any, |
||||
fileProvider: any, |
||||
fileManager: any, |
||||
contentImport: any, |
||||
call: (...args) => void |
||||
on: (...args) => void, |
||||
setHardHatCompilation: (value: boolean) => void, |
||||
setSelectedVersion: (value: string) => void, |
||||
configurationSettings: ConfigurationSettings |
||||
}, |
||||
} |
||||
|
||||
export interface CompilerContainerProps { |
||||
editor: any, |
||||
config: any, |
||||
queryParams: any, |
||||
compileTabLogic: any, |
||||
tooltip: (message: string | JSX.Element) => void, |
||||
modal: (title: string, message: string | JSX.Element, okLabel: string, okFn: () => void, cancelLabel?: string, cancelFn?: () => void) => void, |
||||
compiledFileName: string, |
||||
setHardHatCompilation: (value: boolean) => void, |
||||
updateCurrentVersion: any, |
||||
isHardHatProject: boolean, |
||||
configurationSettings: ConfigurationSettings |
||||
} |
||||
export interface ContractSelectionProps { |
||||
contractMap: { |
||||
file: string |
||||
} | Record<string, any>, |
||||
fileManager: any, |
||||
fileProvider: any, |
||||
modal: (title: string, message: string | JSX.Element, okLabel: string, okFn: () => void, cancelLabel?: string, cancelFn?: () => void) => void, |
||||
contractsDetails: Record<string, any> |
||||
} |
||||
|
||||
export interface ConfigurationSettings { |
||||
version: string, |
||||
evmVersion: string, |
||||
language: string, |
||||
optimize: boolean, |
||||
runs: string |
||||
} |
||||
@ -0,0 +1,16 @@ |
||||
{ |
||||
"extends": "../../../tsconfig.json", |
||||
"compilerOptions": { |
||||
"jsx": "react", |
||||
"allowJs": true, |
||||
"esModuleInterop": true, |
||||
"allowSyntheticDefaultImports": true |
||||
}, |
||||
"files": [], |
||||
"include": [], |
||||
"references": [ |
||||
{ |
||||
"path": "./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"] |
||||
} |
||||
Loading…
Reference in new issue