yann300
3 years ago
parent
e3324c9ddf
commit
f7e97c88fd
@ -0,0 +1,4 @@ |
||||
{ |
||||
"presets": ["@nrwl/react/babel"], |
||||
"plugins": [] |
||||
} |
||||
@ -0,0 +1,16 @@ |
||||
# This file is used by: |
||||
# 1. autoprefixer to adjust CSS to support the below specified browsers |
||||
# 2. babel preset-env to adjust included polyfills |
||||
# |
||||
# For additional information regarding the format and rule options, please see: |
||||
# https://github.com/browserslist/browserslist#queries |
||||
# |
||||
# If you need to support different browsers in production, you may tweak the list below. |
||||
|
||||
last 1 Chrome version |
||||
last 1 Firefox version |
||||
last 2 Edge major versions |
||||
last 2 Safari major version |
||||
last 2 iOS major versions |
||||
Firefox ESR |
||||
not IE 9-11 # For IE 9-11 support, remove 'not'. |
||||
@ -0,0 +1,17 @@ |
||||
import React, { useState, useEffect } from 'react'; |
||||
|
||||
import { SolidityCompiler } from '@remix-ui/solidity-compiler' // eslint-disable-line
|
||||
|
||||
import { CompilerClientApi } from './compiler' |
||||
|
||||
const remix = new CompilerClientApi() |
||||
|
||||
export const App = () => {
|
||||
return ( |
||||
<div className="debugger"> |
||||
<SolidityCompiler plugin={remix} /> |
||||
</div> |
||||
); |
||||
}; |
||||
|
||||
export default App; |
||||
@ -0,0 +1,248 @@ |
||||
import { compile } from '@remix-project/remix-solidity' |
||||
import { CompileTab as CompileTabLogic, parseContracts } from '@remix-ui/solidity-compiler' // eslint-disable-line
|
||||
|
||||
export const CompilerApiMixin = (Base) => class extends Base { |
||||
initCompilerApi () { |
||||
this.configurationSettings = null |
||||
|
||||
this._view = { |
||||
warnCompilationSlow: null, |
||||
errorContainer: null, |
||||
contractEl: null |
||||
} |
||||
|
||||
this.contractsDetails = {} |
||||
this.data = { |
||||
eventHandlers: {}, |
||||
loading: false |
||||
} |
||||
this.compileTabLogic = new CompileTabLogic(this, this.contentImport) |
||||
this.compiler = this.compileTabLogic.compiler |
||||
this.compileTabLogic.init() |
||||
|
||||
this.contractMap = {} |
||||
this.contractsDetails = {} |
||||
|
||||
this.compileErrors = {} |
||||
this.compiledFileName = '' |
||||
this.selectedVersion = '' |
||||
this.currentFile = '' |
||||
} |
||||
|
||||
onActivation () { |
||||
this.call('manager', 'activatePlugin', 'solidity-logic') |
||||
this.listenToEvents()
|
||||
} |
||||
|
||||
onDeactivation () { |
||||
this.call('manager', 'deactivatePlugin', 'solidity-logic') |
||||
} |
||||
|
||||
setHardHatCompilation (value) { |
||||
this.hhCompilation = value |
||||
} |
||||
|
||||
setSelectedVersion (version) { |
||||
this.selectedVersion = version |
||||
} |
||||
|
||||
getCompilationResult () { |
||||
return this.compileTabLogic.compiler.state.lastCompilationResult |
||||
} |
||||
|
||||
addExternalFile (fileName, content) { |
||||
this.fileProvider.addExternal(fileName, content) |
||||
} |
||||
|
||||
/** |
||||
* compile using @arg fileName. |
||||
* The module UI will be updated accordingly to the new compilation result. |
||||
* This function is used by remix-plugin compiler API. |
||||
* @param {string} fileName to compile |
||||
*/ |
||||
compile (fileName) { |
||||
return this.compileTabLogic.compileFile(fileName) |
||||
} |
||||
|
||||
compileFile (event) { |
||||
if (event.path.length > 0) { |
||||
this.compileTabLogic.compileFile(event.path[0]) |
||||
} |
||||
} |
||||
|
||||
/** |
||||
* compile using @arg compilationTargets and @arg settings |
||||
* The module UI will *not* be updated, the compilation result is returned |
||||
* This function is used by remix-plugin compiler API. |
||||
* @param {object} map of source files. |
||||
* @param {object} settings {evmVersion, optimize, runs, version, language} |
||||
*/ |
||||
async compileWithParameters (compilationTargets, settings) { |
||||
settings.version = settings.version || this.selectedVersion |
||||
const res = await compile(compilationTargets, settings, (url, cb) => this.call('contentImport', 'resolveAndSave', url).then((result) => cb(null, result)).catch((error) => cb(error.message))) |
||||
return res |
||||
} |
||||
|
||||
// This function is used for passing the compiler configuration to 'remix-tests'
|
||||
getCurrentCompilerConfig () { |
||||
return { |
||||
currentVersion: this.selectedVersion, |
||||
evmVersion: this.compileTabLogic.evmVersion, |
||||
optimize: this.compileTabLogic.optimize, |
||||
runs: this.compileTabLogic.runs |
||||
} |
||||
} |
||||
|
||||
|
||||
/** |
||||
* set the compiler configuration |
||||
* This function is used by remix-plugin compiler API. |
||||
* @param {object} settings {evmVersion, optimize, runs, version, language} |
||||
*/ |
||||
setCompilerConfig (settings) { |
||||
this.configurationSettings = settings
|
||||
} |
||||
|
||||
getParameters () { |
||||
return {} |
||||
} |
||||
|
||||
setParameters (params) {} |
||||
|
||||
getConfiguration (name) { |
||||
const conf = { |
||||
'currentFile': () => this.currentFile, |
||||
'hideWarnings': () => false, |
||||
'autoCompile': () => false, |
||||
'includeNightlies': () => false, |
||||
'optimise': () => false |
||||
} |
||||
return conf[name]() |
||||
} |
||||
|
||||
setConfiguration (name, value) {} |
||||
|
||||
getFileManagerMode () { |
||||
return 'browser' |
||||
} |
||||
|
||||
fileExists (fileName) { |
||||
return this.call('fileManager', 'exists', fileName) |
||||
} |
||||
|
||||
writeFile (fileName, content) { |
||||
return this.call('fileManager', 'writeFile', fileName, content) |
||||
} |
||||
|
||||
readFile (fileName) { |
||||
return this.call('fileManager', 'readFile', fileName) |
||||
} |
||||
|
||||
open (fileName) { |
||||
return this.call('fileManager', 'open', fileName) |
||||
} |
||||
|
||||
resetResults () { |
||||
this.currentFile = '' |
||||
this.contractsDetails = {} |
||||
this.emit('statusChanged', { key: 'none' }) |
||||
if (this.onResetResults()) this.onResetResults() |
||||
} |
||||
|
||||
listenToEvents () { |
||||
this.data.eventHandlers.onContentChanged = () => { |
||||
this.emit('statusChanged', { key: 'edited', title: 'the content has changed, needs recompilation', type: 'info' }) |
||||
} |
||||
this.on('editor', 'contentChanged', this.data.eventHandlers.onContentChanged) |
||||
|
||||
this.data.eventHandlers.onLoadingCompiler = () => { |
||||
this.data.loading = true |
||||
this.emit('statusChanged', { key: 'loading', title: 'loading compiler...', type: 'info' }) |
||||
} |
||||
this.compiler.event.register('loadingCompiler', this.data.eventHandlers.onLoadingCompiler) |
||||
|
||||
this.data.eventHandlers.onCompilerLoaded = () => { |
||||
this.data.loading = false |
||||
this.emit('statusChanged', { key: 'none' }) |
||||
} |
||||
this.compiler.event.register('compilerLoaded', this.data.eventHandlers.onCompilerLoaded) |
||||
|
||||
this.data.eventHandlers.onStartingCompilation = () => { |
||||
this.emit('statusChanged', { key: 'loading', title: 'compiling...', type: 'info' }) |
||||
} |
||||
|
||||
this.data.eventHandlers.onRemoveAnnotations = () => { |
||||
this.call('editor', 'clearAnnotations') |
||||
} |
||||
|
||||
this.on('filePanel', 'setWorkspace', (workspace) => { |
||||
this.resetResults() |
||||
if (this.onSetWorkspace) this.onSetWorkspace(workspace) |
||||
}) |
||||
|
||||
this.compileTabLogic.event.on('startingCompilation', this.data.eventHandlers.onStartingCompilation) |
||||
this.compileTabLogic.event.on('removeAnnotations', this.data.eventHandlers.onRemoveAnnotations) |
||||
|
||||
this.data.eventHandlers.onCurrentFileChanged = (name) => { |
||||
this.currentFile = name |
||||
if (this.onCurrentFileChanged) this.onCurrentFileChanged(name) |
||||
} |
||||
this.on('fileManager', 'currentFileChanged', this.data.eventHandlers.onCurrentFileChanged) |
||||
|
||||
this.data.eventHandlers.onNoFileSelected = () => { |
||||
this.currentFile = '' |
||||
if (this.onNoFileSelected) this.onNoFileSelected() |
||||
} |
||||
this.on('fileManager', 'noFileSelected', this.data.eventHandlers.onNoFileSelected) |
||||
|
||||
this.data.eventHandlers.onCompilationFinished = (success, data, source) => { |
||||
this.compileErrors = data |
||||
if (success) { |
||||
// forwarding the event to the appManager infra
|
||||
this.emit('compilationFinished', source.target, source, 'soljson', data) |
||||
if (data.errors && data.errors.length > 0) { |
||||
this.emit('statusChanged', { |
||||
key: data.errors.length, |
||||
title: `compilation finished successful with warning${data.errors.length > 1 ? 's' : ''}`, |
||||
type: 'warning' |
||||
}) |
||||
} else this.emit('statusChanged', { key: 'succeed', title: 'compilation successful', type: 'success' }) |
||||
// Store the contracts
|
||||
this.contractsDetails = {} |
||||
this.compiler.visitContracts((contract) => { |
||||
this.contractsDetails[contract.name] = parseContracts( |
||||
contract.name, |
||||
contract.object, |
||||
this.compiler.getSource(contract.file) |
||||
) |
||||
}) |
||||
} else { |
||||
const count = (data.errors ? data.errors.filter(error => error.severity === 'error').length : 0 + data.error ? 1 : 0) |
||||
this.emit('statusChanged', { key: count, title: `compilation failed with ${count} error${count.length > 1 ? 's' : ''}`, type: 'error' }) |
||||
} |
||||
// Update contract Selection
|
||||
this.contractMap = {} |
||||
if (success) this.compiler.visitContracts((contract) => { this.contractMap[contract.name] = contract }) |
||||
if (this.onCompilationFinished) this.onCompilationFinished(this.contractsDetails, this.contractMap) |
||||
} |
||||
this.compiler.event.register('compilationFinished', this.data.eventHandlers.onCompilationFinished) |
||||
|
||||
this.data.eventHandlers.onThemeChanged = (theme) => { |
||||
const invert = theme.quality === 'dark' ? 1 : 0 |
||||
const img = document.getElementById('swarmLogo') |
||||
if (img) { |
||||
img.style.filter = `invert(${invert})` |
||||
} |
||||
} |
||||
this.on('themeModule', 'themeChanged', this.data.eventHandlers.onThemeChanged) |
||||
|
||||
// Run the compiler instead of trying to save the website
|
||||
window.document.addEventListener('keydown', (e) => { |
||||
// ctrl+s or command+s
|
||||
if ((e.metaKey || e.ctrlKey) && e.keyCode === 83) { |
||||
e.preventDefault() |
||||
this.compileTabLogic.runCompiler(this.hhCompilation) |
||||
} |
||||
}) |
||||
} |
||||
} |
||||
@ -0,0 +1,40 @@ |
||||
import { PluginClient } from "@remixproject/plugin"; |
||||
import { createClient } from "@remixproject/plugin-webview"; |
||||
import { CompilerApiMixin } from './compiler-api' |
||||
|
||||
export interface ConfigurationSettings { |
||||
version: string, |
||||
evmVersion: string, |
||||
language: string, |
||||
optimize: boolean, |
||||
runs: string |
||||
} |
||||
|
||||
export class CompilerClientApi extends CompilerApiMixin(PluginClient) { |
||||
contractMap: { |
||||
file: string |
||||
} | Record<string, any> |
||||
compileErrors: any |
||||
compileTabLogic: any |
||||
contractsDetails: Record<string, any> |
||||
contentImport: any |
||||
call: (...args) => void |
||||
on: (...args) => void |
||||
setSelectedVersion: (value: string) => void |
||||
configurationSettings: ConfigurationSettings |
||||
getConfiguration: (value: string) => string |
||||
setConfiguration: (name: string, value: string) => void |
||||
currentFile: string |
||||
|
||||
onCurrentFileChanged: (fileName: string) => void |
||||
onResetResults: () => void |
||||
onSetWorkspace: (workspace: any) => void |
||||
onNoFileSelected: () => void |
||||
onCompilationFinished: (contractsDetails: any, contractMap: any) => void |
||||
|
||||
constructor () { |
||||
super() |
||||
createClient(this as any) |
||||
this.initCompilerApi() |
||||
}
|
||||
} |
||||
@ -0,0 +1,3 @@ |
||||
export const environment = { |
||||
production: true |
||||
}; |
||||
@ -0,0 +1,6 @@ |
||||
// This file can be replaced during build by using the `fileReplacements` array.
|
||||
// When building for production, this file is replaced with `environment.prod.ts`.
|
||||
|
||||
export const environment = { |
||||
production: false |
||||
}; |
||||
|
After Width: | Height: | Size: 15 KiB |
@ -0,0 +1,14 @@ |
||||
<!DOCTYPE html> |
||||
<html lang="en"> |
||||
<head> |
||||
<meta charset="utf-8" /> |
||||
<title>SolidityCompiler</title> |
||||
<base href="/" /> |
||||
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" /> |
||||
<link rel="icon" type="image/x-icon" href="favicon.ico" /> |
||||
</head> |
||||
<body> |
||||
<div id="root"></div> |
||||
</body> |
||||
</html> |
||||
@ -0,0 +1 @@ |
||||
export * from './app/compiler-api'; |
||||
@ -0,0 +1,11 @@ |
||||
import React from 'react'; |
||||
import ReactDOM from 'react-dom'; |
||||
|
||||
import App from './app/app'; |
||||
|
||||
ReactDOM.render( |
||||
<React.StrictMode> |
||||
<App /> |
||||
</React.StrictMode>, |
||||
document.getElementById('root') |
||||
); |
||||
@ -0,0 +1,7 @@ |
||||
/** |
||||
* Polyfill stable language features. These imports will be optimized by `@babel/preset-env`. |
||||
* |
||||
* See: https://github.com/zloirock/core-js#babel
|
||||
*/ |
||||
import 'core-js/stable'; |
||||
import 'regenerator-runtime/runtime'; |
||||
@ -0,0 +1 @@ |
||||
/* You can add global styles to this file, and also import other style files */ |
||||
@ -0,0 +1,9 @@ |
||||
{ |
||||
"extends": "./tsconfig.json", |
||||
"compilerOptions": { |
||||
"outDir": "../../dist/out-tsc", |
||||
"types": ["node"] |
||||
}, |
||||
"exclude": ["**/*.spec.ts", "**/*.spec.tsx"], |
||||
"include": ["**/*.js", "**/*.jsx", "**/*.ts", "**/*.tsx"] |
||||
} |
||||
@ -0,0 +1,16 @@ |
||||
{ |
||||
"extends": "../../tsconfig.json", |
||||
"compilerOptions": { |
||||
"jsx": "react", |
||||
"allowJs": true, |
||||
"esModuleInterop": true, |
||||
"allowSyntheticDefaultImports": true, |
||||
"types": ["node", "jest"], |
||||
"resolveJsonModule": true |
||||
}, |
||||
"files": [ |
||||
"../../node_modules/@nrwl/react/typings/cssmodule.d.ts", |
||||
"../../node_modules/@nrwl/react/typings/image.d.ts" |
||||
], |
||||
"include": ["**/*.js", "**/*.jsx", "**/*.ts", "**/*.tsx"] |
||||
} |
||||
@ -0,0 +1,15 @@ |
||||
{ |
||||
"extends": "./tsconfig.json", |
||||
"compilerOptions": { |
||||
"outDir": "../../dist/out-tsc", |
||||
"module": "commonjs", |
||||
"types": ["jest", "node"] |
||||
}, |
||||
"include": [ |
||||
"**/*.spec.ts", |
||||
"**/*.spec.tsx", |
||||
"**/*.spec.js", |
||||
"**/*.spec.jsx", |
||||
"**/*.d.ts" |
||||
] |
||||
} |
||||
@ -0,0 +1,17 @@ |
||||
const nxWebpack = require('@nrwl/react/plugins/webpack') |
||||
|
||||
module.exports = config => { |
||||
const nxWebpackConfig = nxWebpack(config) |
||||
|
||||
return { |
||||
...nxWebpackConfig, |
||||
node: { |
||||
fs: 'empty', |
||||
tls: 'empty', |
||||
readline: 'empty', |
||||
net: 'empty', |
||||
module: 'empty', |
||||
child_process: 'empty' |
||||
} |
||||
} |
||||
} |
||||
@ -1,2 +1,3 @@ |
||||
export * from './lib/solidity-compiler' |
||||
export * from './lib/logic' |
||||
export * from './lib/icompiler-api' |
||||
|
||||
@ -0,0 +1,28 @@ |
||||
export type onCurrentFileChanged = (fileName: string) => void |
||||
|
||||
export interface ICompilerApi { |
||||
contractMap: { |
||||
file: string |
||||
} | Record<string, any> |
||||
|
||||
compileErrors:any |
||||
|
||||
currentFile: string |
||||
configurationSettings: any |
||||
setHardHatCompilation(value: boolean): void |
||||
setSelectedVersion(version: string): void |
||||
getCompilationResult(): any |
||||
setCompilerConfig: (settings: any) => void |
||||
getParameters: () => any |
||||
setParameters: (params) => void |
||||
getConfiguration: (name: string) => string |
||||
setConfiguration: (name: string, value: string) => void |
||||
fileProviderOf: (file: string) => string |
||||
getFileManagerMode: () => string |
||||
fileExists: (file: string) => Promise<boolean> |
||||
writeFile: (file: string, content: string) => Promise<void> |
||||
readFile: (file: string) => Promise<string> |
||||
open: (file: string) => void |
||||
addExternalFile: (file: string, content: string) => void |
||||
onCurrentFileChanged: (listener: onCurrentFileChanged) => void |
||||
} |
||||
Loading…
Reference in new issue