mirror
/
remix-project
mirror of https://github.com/ethereum/remix-project.git
2
0
Fork 0
Code Issues Releases Wiki Activity

updated the ui

Browse Source
pull/5370/head
lianahus 3 years ago committed by yann300
parent 1d910c33c4
commit 200e2b21f7
2 changed files with 88 additions and 122 deletions
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Show Stats Download Patch File Download Diff File
  1. 24
      apps/remix-ide/contracts/solidity_compiler_config.json
  2. 186
      libs/remix-ui/solidity-compiler/src/lib/compiler-container.tsx

24
apps/remix-ide/contracts/solidity_compiler_config.json
Unescape View File

@ -1,24 +1,12 @@
{ {
"_comment": "for foll description visit https://docs.soliditylang.org/en/develop/using-the-compiler.html?highlight=standard%20json#input-description", "_comment": "For more info please visit https://docs.soliditylang.org/en/develop/using-the-compiler.html?highlight=standard%20json#input-description",
"language": "Solidity", "language": "Solidity",
"sources":
{
"myFile.sol":
{
"keccak256": "0x123...",
"urls": [
]
},
"destructible":
{
}
},
"settings": "settings":
{ {
"stopAfter": "parsing", "stopAfter": "parsing",
"remappings": [ ":g=/dir" ], "remappings": [ ":g=/dir" ],
"optimizer": { "optimizer": {
"enabled": true, "enabled": false,
"runs": 200, "runs": 200,
"details": { "details": {
"peephole": true, "peephole": true,
@ -31,10 +19,11 @@
"yul": false, "yul": false,
"yulDetails": { "yulDetails": {
"stackAllocation": true, "stackAllocation": true,
"optimizerSteps": "dhfoDgvulfnTUtnIf..."
} }
} }
}, },
"evmVersion": "london", "evmVersion": "byzantium",
"viaIR": true, "viaIR": true,
"debug": { "debug": {
"revertStrings": "default", "revertStrings": "default",
@ -44,8 +33,6 @@
"useLiteralContent": true, "useLiteralContent": true,
"bytecodeHash": "ipfs" "bytecodeHash": "ipfs"
}, },
"libraries": {
},
"outputSelection": { "outputSelection": {
"*": { "*": {
"*": [ "*": [
@ -62,9 +49,6 @@
}, },
"modelChecker": "modelChecker":
{ {
"contracts":
{
},
"divModNoSlacks": false, "divModNoSlacks": false,
"engine": "chc", "engine": "chc",
"invariants": ["contract", "reentrancy"], "invariants": ["contract", "reentrancy"],

186
libs/remix-ui/solidity-compiler/src/lib/compiler-container.tsx
Unescape View File

@ -156,8 +156,9 @@ export const CompilerContainer = (props: CompilerContainerProps) => {
} }
const createNewConfigFile = async () => { const createNewConfigFile = async () => {
await api.writeFile(configFilePathInput.current.value, "") const configFileContent =
setConfigFilePath(configFilePathInput.current.value) await api.writeFile(configFilePathInput.current.value, "")
setConfigFilePath(configFilePathInput.current.value)
} }
const handleConfigPathChange = async () => { const handleConfigPathChange = async () => {
if (await api.fileExists(configFilePathInput.current.value)) if (await api.fileExists(configFilePathInput.current.value))
@ -166,7 +167,7 @@ export const CompilerContainer = (props: CompilerContainerProps) => {
modal( modal(
'New configuration file', 'The file you entered does not exist. Do you want to create a new one?', 'New configuration file', 'The file you entered does not exist. Do you want to create a new one?',
'Create', 'Create',
async () => await createNewConfigFile, async () => await createNewConfigFile(),
'Cancel', 'Cancel',
() => {} () => {}
) )
@ -568,12 +569,29 @@ export const CompilerContainer = (props: CompilerContainerProps) => {
return ( return (
<section> <section>
<article> <article>
<header className='remixui_compilerSection border-bottom'> <header className='pt-0 remixui_compilerSection border-bottom'>
<div className="pl-0 d-flex remixui_compilerConfig custom-control custom-checkbox" onClick={toggleConfigType}> <div className="d-flex remixui_compilerConfig custom-control custom-checkbox">
<input type="radio" value="manual" checked={manualConfig} name="configType" /> <input className="custom-control-input" type="checkbox" value="file" onChange={toggleConfigType} checked={!manualConfig} id="sCManualConfig" />
<label className="font-weight-bold ml-1 remixui_compilerLabel">Compiler Configuration</label> <label className="font-weight-bold pt-1 form-check-label custom-control-label remixui_compilerLabel" htmlFor="sCManualConfig">Use configuration file</label>
</div>
<div className={`pt-2 ml-3 ml-2 align-items-start flex-column ${!manualConfig ? 'd-flex' : 'd-none'}`}>
{ !showFilePathInput && <span className="py-2 text-primary">{configFilePath}</span> }
<input
ref={configFilePathInput}
className={`py-0 my-0 ${showFilePathInput ? "d-flex" : "d-none"}`}
placeholder={"Enter the new path"}
title="If the file you entered does not exist you will be able to create one in the next step."
onKeyPress={event => {
if (event.key === 'Enter') {
handleConfigPathChange()
}
}}
/>
{ !showFilePathInput && <button className="btn-secondary" onClick={() => {setShowFilePathInput(true)}}>Set new config file</button> }
</div> </div>
<div className={`pt-2 ml-3 flex-column ${manualConfig ? 'd-flex' : 'd-none'}`}> <div className={`flex-column ${manualConfig ? 'd-flex' : 'd-none'}`}>
<div className="pl-0 d-flex remixui_compilerConfig custom-control custom-checkbox">
</div>
<div className="mb-2"> <div className="mb-2">
<label className="remixui_compilerLabel form-check-label" htmlFor="versionSelector"> <label className="remixui_compilerLabel form-check-label" htmlFor="versionSelector">
Compiler Compiler
@ -608,68 +626,32 @@ export const CompilerContainer = (props: CompilerContainerProps) => {
{compileTabLogic.evmVersions.map((version, index) => (<option key={index} data-id={state.evmVersion === version ? 'selected' : ''} value={version}>{version}</option>))} {compileTabLogic.evmVersions.map((version, index) => (<option key={index} data-id={state.evmVersion === version ? 'selected' : ''} value={version}>{version}</option>))}
</select> </select>
</div> </div>
<div className="mt-3"> <div className="mt-1 mt-3 border-dark pb-3 remixui_compilerConfig custom-control custom-checkbox">
<div className="border-dark pb-3 flex-column"> <div className="justify-content-between align-items-center d-flex">
<div className="mt-2 remixui_compilerConfig custom-control custom-checkbox"> <input onChange={(e) => { handleOptimizeChange(e.target.checked) }} className="custom-control-input" id="optimize" type="checkbox" checked={state.optimize} />
<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="optimize">Enable optimization</label>
<label className="form-check-label custom-control-label" htmlFor="autoCompile">Auto compile</label> <input
</div> min="1"
<div className="mt-1 remixui_compilerConfig custom-control custom-checkbox"> className="custom-select ml-2 remixui_runs"
<div className="justify-content-between align-items-center d-flex"> id="runs"
<input onChange={(e) => { handleOptimizeChange(e.target.checked) }} className="custom-control-input" id="optimize" type="checkbox" checked={state.optimize} /> placeholder="200"
<label className="form-check-label custom-control-label" htmlFor="optimize">Enable optimization</label> value={state.runs}
<input type="number"
min="1" title="Estimated number of times each opcode of the deployed code will be executed across the life-time of the contract."
className="custom-select ml-2 remixui_runs" onChange={(e) => onChangeRuns(e.target.value)}
id="runs" disabled={!state.optimize}
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.optimize}
/>
</div>
</div>
<div className="mt-1 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> </div>
</div> </div>
{
isHardhatProject &&
<div className="mt-3 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>
<a className="mt-1 text-nowrap" href='https://remix-ide.readthedocs.io/en/latest/hardhat.html#enable-hardhat-compilation' target={'_blank'}>
<OverlayTrigger placement={'right'} overlay={
<Tooltip className="text-nowrap" id="overlay-tooltip">
<span className="p-1 pr-3" style={{ backgroundColor: 'black', minWidth: '230px' }}>Learn how to use Hardhat Compilation</span>
</Tooltip>
}>
<i style={{ fontSize: 'medium' }} className={'ml-2 fal fa-info-circle'} aria-hidden="true"></i>
</OverlayTrigger>
</a>
</div>
}
</div> </div>
<div className="pl-0 d-flex remixui_compilerConfig custom-control custom-checkbox" onClick={toggleConfigType}> <label className="font-weight-bold ml-1 mt-3 remixui_compilerLabel">Plugin settings</label>
<input type="radio" value="file" checked={!manualConfig} name="configType" /> <div className="mt-2 remixui_compilerConfig custom-control custom-checkbox">
<label className="font-weight-bold ml-1 remixui_compilerLabel">Use configuration file</label> <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>
<div className={`pt-2 ml-3 align-items-start flex-column ${!manualConfig ? 'd-flex' : 'd-none'}`}> <div className="mt-1 mb-2 remixui_compilerConfig custom-control custom-checkbox">
{ !showFilePathInput && <span>{configFilePath}</span> } <input className="remixui_autocompile custom-control-input" onChange={handleHideWarningsChange} id="hideWarningsBox" type="checkbox" title="Hide warnings" checked={state.hideWarnings} />
{ showFilePathInput && <input <label className="form-check-label custom-control-label" htmlFor="hideWarningsBox">Hide warnings</label>
ref={configFilePathInput}
placeholder={"Enter new path"}
onKeyPress={event => {
if (event.key === 'Enter') {
handleConfigPathChange()
}
}}
/> }
{ !showFilePathInput && <button className="mt-2 btn-secondary" onClick={() => {setShowFilePathInput(true)}}>Set new config file</button> }
</div> </div>
{ {
isHardhatProject && isHardhatProject &&
@ -704,52 +686,52 @@ export const CompilerContainer = (props: CompilerContainerProps) => {
</div> </div>
} }
<div> <div>
<button id="compileBtn" data-id="compilerContainerCompileBtn" className="btn btn-primary btn-block d-block w-100 text-break remixui_disabled mb-1 mt-3" onClick={compile} disabled={disableCompileButton}> <button id="compileBtn" data-id="compilerContainerCompileBtn" className="btn btn-primary btn-block d-block w-100 text-break remixui_disabled mb-1 mt-3" onClick={compile} disabled={disableCompileButton}>
<OverlayTrigger overlay={
<Tooltip id="overlay-tooltip-compile">
<div className="text-left">
<div><b>Ctrl+S</b> for compiling</div>
</div>
</Tooltip>
}>
<span>
{ <i ref={compileIcon} className="fas fa-sync remixui_iconbtn" aria-hidden="true"></i> }
Compile { typeof state.compiledFileName === 'string' ? extractNameFromKey(state.compiledFileName) || '<no file selected>' : '<no file selected>' }
</span>
</OverlayTrigger>
</button>
<div className='d-flex align-items-center'>
<button id="compileAndRunBtn" data-id="compilerContainerCompileAndRunBtn" className="btn btn-secondary btn-block d-block w-100 text-break remixui_solidityCompileAndRunButton d-inline-block remixui_disabled mb-1 mt-3" onClick={compileAndRun} disabled={disableCompileButton}>
<OverlayTrigger overlay={ <OverlayTrigger overlay={
<Tooltip id="overlay-tooltip-compile-run"> <Tooltip id="overlay-tooltip-compile">
<div className="text-left"> <div className="text-left">
<div><b>Ctrl+Shift+S</b> for compiling and script execution</div> <div><b>Ctrl+S</b> for compiling</div>
</div> </div>
</Tooltip> </Tooltip>
}> }>
<span> <span>
Compile and Run script { <i ref={compileIcon} className="fas fa-sync remixui_iconbtn" aria-hidden="true"></i> }
Compile { typeof state.compiledFileName === 'string' ? extractNameFromKey(state.compiledFileName) || '<no file selected>' : '<no file selected>' }
</span> </span>
</OverlayTrigger> </OverlayTrigger>
</button> </button>
<OverlayTrigger overlay={ <div className='d-flex align-items-center'>
<Tooltip id="overlay-tooltip-compile-run-doc"> <button id="compileAndRunBtn" data-id="compilerContainerCompileAndRunBtn" className="btn btn-secondary btn-block d-block w-100 text-break remixui_solidityCompileAndRunButton d-inline-block remixui_disabled mb-1 mt-3" onClick={compileAndRun} disabled={disableCompileButton}>
<div className="text-left p-2"> <OverlayTrigger overlay={
<div>Choose the script to execute right after compilation by adding the `dev-run-script` natspec tag, as in:</div> <Tooltip id="overlay-tooltip-compile-run">
<pre> <div className="text-left">
<code> <div><b>Ctrl+Shift+S</b> for compiling and script execution</div>
/**<br />
* @title ContractName<br />
* @dev ContractDescription<br />
* @custom:dev-run-script file_path<br />
*/<br />
contract ContractName {'{}'}<br />
</code>
</pre>
Click to know more
</div> </div>
</Tooltip> </Tooltip>
}> }>
<span>
Compile and Run script
</span>
</OverlayTrigger>
</button>
<OverlayTrigger overlay={
<Tooltip id="overlay-tooltip-compile-run-doc">
<div className="text-left p-2">
<div>Choose the script to execute right after compilation by adding the `dev-run-script` natspec tag, as in:</div>
<pre>
<code>
/**<br />
* @title ContractName<br />
* @dev ContractDescription<br />
* @custom:dev-run-script file_path<br />
*/<br />
contract ContractName {'{}'}<br />
</code>
</pre>
Click to know more
</div>
</Tooltip>
}>
<a href="https://remix-ide.readthedocs.io/en/latest/running_js_scripts.html#compile-a-contract-and-run-a-script-on-the-fly" target="_blank" ><i className="pl-2 ml-2 mt-3 mb-1 fas fa-info text-dark"></i></a> <a href="https://remix-ide.readthedocs.io/en/latest/running_js_scripts.html#compile-a-contract-and-run-a-script-on-the-fly" target="_blank" ><i className="pl-2 ml-2 mt-3 mb-1 fas fa-info text-dark"></i></a>
</OverlayTrigger> </OverlayTrigger>
<CopyToClipboard tip="Copy tag to use in contract NatSpec" getContent={() => '@custom:dev-run-script file_path'} direction='top'> <CopyToClipboard tip="Copy tag to use in contract NatSpec" getContent={() => '@custom:dev-run-script file_path'} direction='top'>

Write Preview
Loading…
Cancel
Save