|
|
|
@ -8,6 +8,14 @@ import { resetEditorMode, listenToEvents } from './actions/compiler' |
|
|
|
|
|
|
|
|
|
|
|
import './css/style.css' |
|
|
|
import './css/style.css' |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
declare global { |
|
|
|
|
|
|
|
interface Window { |
|
|
|
|
|
|
|
_paq: any |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
const _paq = window._paq = window._paq || [] //eslint-disable-line
|
|
|
|
|
|
|
|
|
|
|
|
export const CompilerContainer = (props: CompilerContainerProps) => { |
|
|
|
export const CompilerContainer = (props: CompilerContainerProps) => { |
|
|
|
const { editor, config, queryParams, compileTabLogic, tooltip, modal, compiledFileName, setHardHatCompilation, updateCurrentVersion, isHardHatProject, configurationSettings } = props // eslint-disable-line
|
|
|
|
const { editor, config, queryParams, compileTabLogic, tooltip, modal, compiledFileName, setHardHatCompilation, updateCurrentVersion, isHardHatProject, configurationSettings } = props // eslint-disable-line
|
|
|
|
const [state, setState] = useState({ |
|
|
|
const [state, setState] = useState({ |
|
|
|
@ -27,8 +35,8 @@ export const CompilerContainer = (props: CompilerContainerProps) => { |
|
|
|
language: '', |
|
|
|
language: '', |
|
|
|
evmVersion: '' |
|
|
|
evmVersion: '' |
|
|
|
}) |
|
|
|
}) |
|
|
|
|
|
|
|
const [disableCompileButton, setDisableCompileButton] = useState<boolean>(false) |
|
|
|
const compileIcon = useRef(null) |
|
|
|
const compileIcon = useRef(null) |
|
|
|
const warningIcon = useRef(null) |
|
|
|
|
|
|
|
const promptMessageInput = useRef(null) |
|
|
|
const promptMessageInput = useRef(null) |
|
|
|
const [hhCompilation, sethhCompilation] = useState(false) |
|
|
|
const [hhCompilation, sethhCompilation] = useState(false) |
|
|
|
const [compilerContainer, dispatch] = useReducer(compilerReducer, compilerInitialState) |
|
|
|
const [compilerContainer, dispatch] = useReducer(compilerReducer, compilerInitialState) |
|
|
|
@ -75,6 +83,9 @@ export const CompilerContainer = (props: CompilerContainerProps) => { |
|
|
|
}, [compileTabLogic]) |
|
|
|
}, [compileTabLogic]) |
|
|
|
|
|
|
|
|
|
|
|
useEffect(() => { |
|
|
|
useEffect(() => { |
|
|
|
|
|
|
|
const isDisabled = !compiledFileName || (compiledFileName && !isSolFileSelected(compiledFileName)) |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
setDisableCompileButton(isDisabled) |
|
|
|
setState(prevState => { |
|
|
|
setState(prevState => { |
|
|
|
return { ...prevState, compiledFileName } |
|
|
|
return { ...prevState, compiledFileName } |
|
|
|
}) |
|
|
|
}) |
|
|
|
@ -235,14 +246,8 @@ export const CompilerContainer = (props: CompilerContainerProps) => { |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
const compilationDuration = (speed: number) => { |
|
|
|
const compilationDuration = (speed: number) => { |
|
|
|
if (!warningIcon.current) return |
|
|
|
|
|
|
|
if (speed > 1000) { |
|
|
|
if (speed > 1000) { |
|
|
|
const msg = `Last compilation took ${speed}ms. We suggest to turn off autocompilation.` |
|
|
|
console.log(`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' |
|
|
|
|
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
@ -256,8 +261,8 @@ export const CompilerContainer = (props: CompilerContainerProps) => { |
|
|
|
if (!compileIcon.current) return |
|
|
|
if (!compileIcon.current) return |
|
|
|
compileIcon.current.setAttribute('title', 'compiler is loading, please wait a few moments.') |
|
|
|
compileIcon.current.setAttribute('title', 'compiler is loading, please wait a few moments.') |
|
|
|
compileIcon.current.classList.add('remixui_spinningIcon') |
|
|
|
compileIcon.current.classList.add('remixui_spinningIcon') |
|
|
|
warningIcon.current.style.visibility = 'hidden' |
|
|
|
|
|
|
|
_updateLanguageSelector() |
|
|
|
_updateLanguageSelector() |
|
|
|
|
|
|
|
setDisableCompileButton(true) |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
const compilerLoaded = () => { |
|
|
|
const compilerLoaded = () => { |
|
|
|
@ -265,6 +270,9 @@ export const CompilerContainer = (props: CompilerContainerProps) => { |
|
|
|
compileIcon.current.setAttribute('title', '') |
|
|
|
compileIcon.current.setAttribute('title', '') |
|
|
|
compileIcon.current.classList.remove('remixui_spinningIcon') |
|
|
|
compileIcon.current.classList.remove('remixui_spinningIcon') |
|
|
|
if (state.autoCompile) compile() |
|
|
|
if (state.autoCompile) compile() |
|
|
|
|
|
|
|
const isDisabled = !compiledFileName || (compiledFileName && !isSolFileSelected(compiledFileName)) |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
setDisableCompileButton(isDisabled) |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
const compilationFinished = () => { |
|
|
|
const compilationFinished = () => { |
|
|
|
@ -272,6 +280,7 @@ export const CompilerContainer = (props: CompilerContainerProps) => { |
|
|
|
compileIcon.current.setAttribute('title', 'idle') |
|
|
|
compileIcon.current.setAttribute('title', 'idle') |
|
|
|
compileIcon.current.classList.remove('remixui_spinningIcon') |
|
|
|
compileIcon.current.classList.remove('remixui_spinningIcon') |
|
|
|
compileIcon.current.classList.remove('remixui_bouncingIcon') |
|
|
|
compileIcon.current.classList.remove('remixui_bouncingIcon') |
|
|
|
|
|
|
|
_paq.push(['trackEvent', 'compiler', 'compiled_with_version', _retrieveVersion()]) |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
const scheduleCompilation = () => { |
|
|
|
const scheduleCompilation = () => { |
|
|
|
@ -292,7 +301,7 @@ export const CompilerContainer = (props: CompilerContainerProps) => { |
|
|
|
if (!isSolFileSelected()) return |
|
|
|
if (!isSolFileSelected()) return |
|
|
|
|
|
|
|
|
|
|
|
_setCompilerVersionFromPragma(currentFile) |
|
|
|
_setCompilerVersionFromPragma(currentFile) |
|
|
|
compileTabLogic.runCompiler() |
|
|
|
compileTabLogic.runCompiler(hhCompilation) |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
const _retrieveVersion = (version?) => { |
|
|
|
const _retrieveVersion = (version?) => { |
|
|
|
@ -440,6 +449,7 @@ export const CompilerContainer = (props: CompilerContainerProps) => { |
|
|
|
const handleNightliesChange = (e) => { |
|
|
|
const handleNightliesChange = (e) => { |
|
|
|
const checked = e.target.checked |
|
|
|
const checked = e.target.checked |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
if (!checked) handleLoadVersion(state.defaultVersion) |
|
|
|
config.set('includeNightlies', checked) |
|
|
|
config.set('includeNightlies', checked) |
|
|
|
setState(prevState => { |
|
|
|
setState(prevState => { |
|
|
|
return { ...prevState, includeNightlies: checked } |
|
|
|
return { ...prevState, includeNightlies: checked } |
|
|
|
@ -522,6 +532,7 @@ export const CompilerContainer = (props: CompilerContainerProps) => { |
|
|
|
<label className="remixui_compilerLabel form-check-label" htmlFor="evmVersionSelector">EVM Version</label> |
|
|
|
<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"> |
|
|
|
<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 === 'default' ? 'selected' : ''} value="default">compiler default</option> |
|
|
|
|
|
|
|
<option data-id={state.evmVersion === 'berlin' ? 'selected' : ''} value="berlin">berlin</option> |
|
|
|
<option data-id={state.evmVersion === 'muirGlacier' ? 'selected' : ''} value="muirGlacier">muirGlacier</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 === 'istanbul' ? 'selected' : ''} value="istanbul">istanbul</option> |
|
|
|
<option data-id={state.evmVersion === 'petersburg' ? 'selected' : ''} value="petersburg">petersburg</option> |
|
|
|
<option data-id={state.evmVersion === 'petersburg' ? 'selected' : ''} value="petersburg">petersburg</option> |
|
|
|
@ -566,11 +577,10 @@ export const CompilerContainer = (props: CompilerContainerProps) => { |
|
|
|
<label className="form-check-label custom-control-label" htmlFor="enableHardhat">Enable Hardhat Compilation</label> |
|
|
|
<label className="form-check-label custom-control-label" htmlFor="enableHardhat">Enable Hardhat Compilation</label> |
|
|
|
</div> |
|
|
|
</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))}> |
|
|
|
<button id="compileBtn" data-id="compilerContainerCompileBtn" className="btn btn-primary btn-block remixui_disabled mt-3" title="Compile" onClick={compile} disabled={disableCompileButton}> |
|
|
|
<span> |
|
|
|
<span> |
|
|
|
<i ref={warningIcon} title="Compilation Slow" style={{ visibility: 'hidden' }} className="remixui_warnCompilationSlow fas fa-exclamation-triangle" aria-hidden="true"></i> |
|
|
|
{ <i ref={compileIcon} className="fas fa-sync remixui_icon" 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 { typeof state.compiledFileName === 'string' ? helper.extractNameFromKey(state.compiledFileName) || '<no file selected>' : '<no file selected>' } |
|
|
|
Compile { state.compiledFileName || '<no file selected>' } |
|
|
|
|
|
|
|
</span> |
|
|
|
</span> |
|
|
|
</button> |
|
|
|
</button> |
|
|
|
</header> |
|
|
|
</header> |
|
|
|
|
rorye
3 years ago
committed by
GitHub
