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/2249/head
lianahus 3 years ago committed by yann300
parent 1c7fbd585b
commit 6df6987224
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",
"sources":
{
"myFile.sol":
{
"keccak256": "0x123...",
"urls": [
]
},
"destructible":
{
}
},
"settings":
{
"stopAfter": "parsing",
"remappings": [ ":g=/dir" ],
"optimizer": {
"enabled": true,
"enabled": false,
"runs": 200,
"details": {
"peephole": true,
@ -31,10 +19,11 @@
"yul": false,
"yulDetails": {
"stackAllocation": true,
"optimizerSteps": "dhfoDgvulfnTUtnIf..."
}
}
},
"evmVersion": "london",
"evmVersion": "byzantium",
"viaIR": true,
"debug": {
"revertStrings": "default",
@ -44,8 +33,6 @@
"useLiteralContent": true,
"bytecodeHash": "ipfs"
},
"libraries": {
},
"outputSelection": {
"*": {
"*": [
@ -62,9 +49,6 @@
},
"modelChecker":
{
"contracts":
{
},
"divModNoSlacks": false,
"engine": "chc",
"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 () => {
await api.writeFile(configFilePathInput.current.value, "")
setConfigFilePath(configFilePathInput.current.value)
const configFileContent =
await api.writeFile(configFilePathInput.current.value, "")
setConfigFilePath(configFilePathInput.current.value)
}
const handleConfigPathChange = async () => {
if (await api.fileExists(configFilePathInput.current.value))
@ -166,7 +167,7 @@ export const CompilerContainer = (props: CompilerContainerProps) => {
modal(
'New configuration file', 'The file you entered does not exist. Do you want to create a new one?',
'Create',
async () => await createNewConfigFile,
async () => await createNewConfigFile(),
'Cancel',
() => {}
)
@ -568,12 +569,29 @@ export const CompilerContainer = (props: CompilerContainerProps) => {
return (
<section>
<article>
<header className='remixui_compilerSection border-bottom'>
<div className="pl-0 d-flex remixui_compilerConfig custom-control custom-checkbox" onClick={toggleConfigType}>
<input type="radio" value="manual" checked={manualConfig} name="configType" />
<label className="font-weight-bold ml-1 remixui_compilerLabel">Compiler Configuration</label>
<header className='pt-0 remixui_compilerSection border-bottom'>
<div className="d-flex remixui_compilerConfig custom-control custom-checkbox">
<input className="custom-control-input" type="checkbox" value="file" onChange={toggleConfigType} checked={!manualConfig} id="sCManualConfig" />
<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 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">
<label className="remixui_compilerLabel form-check-label" htmlFor="versionSelector">
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>))}
</select>
</div>
<div className="mt-3">
<div className="border-dark pb-3 flex-column">
<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-1 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.optimize} />
<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.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 className="mt-1 mt-3 border-dark pb-3 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.optimize} />
<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.optimize}
/>
</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 className="pl-0 d-flex remixui_compilerConfig custom-control custom-checkbox" onClick={toggleConfigType}>
<input type="radio" value="file" checked={!manualConfig} name="configType" />
<label className="font-weight-bold ml-1 remixui_compilerLabel">Use configuration file</label>
<label className="font-weight-bold ml-1 mt-3 remixui_compilerLabel">Plugin settings</label>
<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={`pt-2 ml-3 align-items-start flex-column ${!manualConfig ? 'd-flex' : 'd-none'}`}>
{ !showFilePathInput && <span>{configFilePath}</span> }
{ showFilePathInput && <input
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 className="mt-1 mb-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>
{
isHardhatProject &&
@ -704,52 +686,52 @@ export const CompilerContainer = (props: CompilerContainerProps) => {
</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}>
<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}>
<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-run">
<Tooltip id="overlay-tooltip-compile">
<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>
</Tooltip>
}>
<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>
</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
</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={
<Tooltip id="overlay-tooltip-compile-run">
<div className="text-left">
<div><b>Ctrl+Shift+S</b> for compiling and script execution</div>
</div>
</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>
</OverlayTrigger>
<CopyToClipboard tip="Copy tag to use in contract NatSpec" getContent={() => '@custom:dev-run-script file_path'} direction='top'>

Write Preview
Loading…
Cancel
Save