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

layout changes

Browse Source 
cleanup
pull/5042/head
lianahus 6 months ago committed by Aniket
parent 5155adb760
commit 547e5d888a
2 changed files with 310 additions and 260 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. 58
      apps/remix-ide/src/app/plugins/templates-selection/templates-selection-plugin.tsx
  2. 512
      apps/remix-ide/src/app/plugins/templates-selection/templates.ts

58
apps/remix-ide/src/app/plugins/templates-selection/templates-selection-plugin.tsx
Unescape View File

@ -1,6 +1,7 @@
import React from 'react' import React from 'react'
import { FormattedMessage, useIntl } from 'react-intl' import { FormattedMessage, useIntl } from 'react-intl'
import { CustomTooltip } from "@remix-ui/helper"
import { AppModal } from '@remix-ui/app' import { AppModal } from '@remix-ui/app'
import { ViewPlugin } from '@remixproject/engine-web' import { ViewPlugin } from '@remixproject/engine-web'
import { PluginViewWrapper } from '@remix-ui/helper' import { PluginViewWrapper } from '@remix-ui/helper'
@ -94,7 +95,7 @@ export class TemplatesSelectionPlugin extends ViewPlugin {
} }
const modalResult = await this.call('notification', 'modal', modal) const modalResult = await this.call('notification', 'modal', modal)
if (!modalResult) return if (!modalResult) return
this.emit('createWorkspaceReducerEvent', workspaceName, item.value, item.opts, false, (e, data) => { this.emit('createWorkspaceReducerEvent', workspaceName, item.value, item.opts, false, async (e, data) => {
if (e) { if (e) {
const modal: AppModal = { const modal: AppModal = {
id: 'TemplatesSelection', id: 'TemplatesSelection',
@ -103,7 +104,7 @@ export class TemplatesSelectionPlugin extends ViewPlugin {
okLabel: window._intl.formatMessage({ id: 'filePanel.ok' }), okLabel: window._intl.formatMessage({ id: 'filePanel.ok' }),
cancelLabel: window._intl.formatMessage({ id: 'filePanel.cancel' }) cancelLabel: window._intl.formatMessage({ id: 'filePanel.cancel' })
} }
this.call('notification', 'modal', modal) await this.call('notification', 'modal', modal)
console.error(e) console.error(e)
} }
@ -111,7 +112,7 @@ export class TemplatesSelectionPlugin extends ViewPlugin {
} }
const addToCurrentWorkspace = async (item) => { const addToCurrentWorkspace = async (item) => {
this.emit('addTemplateToWorkspaceReducerEvent', item.value, item.opts, false, (e, data) => { this.emit('addTemplateToWorkspaceReducerEvent', item.value, item.opts, false, async (e, data) => {
if (e) { if (e) {
const modal: AppModal = { const modal: AppModal = {
id: 'TemplatesSelection', id: 'TemplatesSelection',
@ -120,7 +121,7 @@ export class TemplatesSelectionPlugin extends ViewPlugin {
okLabel: window._intl.formatMessage({ id: 'filePanel.ok' }), okLabel: window._intl.formatMessage({ id: 'filePanel.ok' }),
cancelLabel: window._intl.formatMessage({ id: 'filePanel.cancel' }) cancelLabel: window._intl.formatMessage({ id: 'filePanel.cancel' })
} }
this.call('notification', 'modal', modal) await this.call('notification', 'modal', modal)
console.error(e) console.error(e)
} }
@ -131,33 +132,62 @@ export class TemplatesSelectionPlugin extends ViewPlugin {
<RemixUIGridView <RemixUIGridView
plugin={this} plugin={this}
styleList={""} styleList={""}
logo='/assets/img/YouTubeLogo.webp' logo='/assets/img/bgRemi.webp'
enableFilter={true} enableFilter={true}
showUntagged={true} showUntagged={true}
showPin={false} showPin={false}
tagList={[]} tagList={[
title='Remix Guide' ['Solidity', 'danger'],
description="Template Selection" ['ZKP', 'warning'],
['ERC20', 'success'],
['ERC721', 'secondary'],
['ERC1155', 'primary'],
]}
title='Template explorer'
description="Select the template to create a workspace"
> >
{ {
templates(window._intl).map(template => { templates(window._intl).map(template => {
return <RemixUIGridSection return <RemixUIGridSection
plugin={this} plugin={this}
title={template.name} title={template.name}
hScrollable= {false} hScrollable={false}
> >
{template.items.map(item => { {template.items.map(item => {
return <RemixUIGridCell return <RemixUIGridCell
plugin={this} plugin={this}
title={item.displayName} title={item.displayName}
tagList={item.tagList}
> >
<div> <div>
{item.displayName} {item.displayName}
{JSON.stringify(item.opts)} <div className='align-items-center justify-content-between w-100 d-flex pt-2 flex-row'>
<div> {!template.IsArtefact && <CustomTooltip
{!template.IsArtefact && <button data-id={`create-${item.value}${item.opts ? JSON.stringify(item.opts) : ''}`} onClick={async () => createWorkspace(item)} className="btn btn-secondary" >Create a new workspace</button>} placement="auto"
<button data-id={`add-${item.value}`} onClick={async () => addToCurrentWorkspace(item)} className="btn btn-primary" >Add to current workspace</button> tooltipId={`overlay-tooltip-new${item.name}`}
tooltipText="Create a new workspace"
>
<span
data-id={`create-${item.value}${item.opts ? JSON.stringify(item.opts) : ''}`}
onClick={async () => createWorkspace(item)}
className="btn btn-sm mr-2 border border-primary"
>
Create
</span>
</CustomTooltip>}
<CustomTooltip
placement="auto"
tooltipId={`overlay-tooltip-add${item.name}`}
tooltipText="Add template files to current workspace"
>
<span
data-id={`add-${item.value}`}
onClick={async () => addToCurrentWorkspace(item)}
className="btn btn-sm border"
>
Add to current
</span>
</CustomTooltip>
</div> </div>
</div> </div>
</RemixUIGridCell> </RemixUIGridCell>

512
apps/remix-ide/src/app/plugins/templates-selection/templates.ts
Unescape View File

@ -1,268 +1,288 @@
export const templates = (intl) => { export const templates = (intl) => {
return [ return [
{ {
name: "Generic", name: "Generic",
items: [ items: [
{ value: "remixDefault", displayName: intl.formatMessage({ id: 'filePanel.basic' }) }, { value: "remixDefault", displayName: intl.formatMessage({ id: 'filePanel.basic' }) },
{ value: "blank", displayName: intl.formatMessage({ id: 'filePanel.blank' }) } { value: "blank", displayName: intl.formatMessage({ id: 'filePanel.blank' }) }
] ]
}, },
{ {
name: "OpenZeppelin", name: "OpenZeppelin",
items: [ items: [
{ {
value: "ozerc20", value: "ozerc20",
displayName: "ERC20" displayName: "ERC20",
}, tagList: ["ERC20"]
{ },
value: "ozerc721", {
displayName: "ERC721 (NFT)" value: "ozerc721",
}, displayName: "ERC721 (NFT)",
{ tagList: ["ERC721"]
value: "ozerc1155", },
displayName: "ERC1155" {
}, value: "ozerc1155",
{ displayName: "ERC1155"
value: "ozerc20", },
displayName: "ERC20", {
opts: { value: "ozerc20",
mintable: true displayName: "ERC20",
} opts: {
}, mintable: true
{ }
value: "ozerc721", },
displayName: "ERC721 (NFT)", {
opts: { value: "ozerc721",
mintable: true displayName: "ERC721 (NFT)",
} opts: {
}, mintable: true
{
value: "ozerc1155",
displayName: "ERC1155",
opts: {
mintable: true
}
}, },
{ tagList: ["ERC721"]
value: "ozerc20", },
displayName: "ERC20", {
opts: { value: "ozerc1155",
mintable: true, displayName: "ERC1155",
burnable: true opts: {
} mintable: true
}
},
{
value: "ozerc20",
displayName: "ERC20",
opts: {
mintable: true,
burnable: true
}, },
{ tagList: ["ERC20"]
value: "ozerc721", },
displayName: "ERC721 (NFT)", {
opts: { value: "ozerc721",
mintable: true, displayName: "ERC721 (NFT)",
burnable: true opts: {
} mintable: true,
burnable: true
}, },
{ tagList: ["ERC721"]
value: "ozerc1155", },
displayName: "ERC1155", {
opts: { value: "ozerc1155",
mintable: true, displayName: "ERC1155",
burnable: true opts: {
} mintable: true,
burnable: true
}, },
{ tagList: ["ERC1155"]
value: "ozerc20", },
displayName: "ERC20", {
opts: { value: "ozerc20",
mintable: true, displayName: "ERC20",
pausable: true opts: {
} mintable: true,
pausable: true
}, },
{ tagList: ["ERC20"]
value: "ozerc721", },
displayName: "ERC721 (NFT)", {
opts: { value: "ozerc721",
mintable: true, displayName: "ERC721 (NFT)",
pausable: true opts: {
} mintable: true,
pausable: true
}, },
{ tagList: ["ERC721"]
value: "ozerc1155", },
displayName: "ERC1155", {
opts: { value: "ozerc1155",
mintable: true, displayName: "ERC1155",
pausable: true opts: {
} mintable: true,
pausable: true
} }
] }
}, ]
{ },
name: "OpenZeppelin Proxy", {
items: [ name: "OpenZeppelin Proxy",
{ items: [
value: "ozerc20", {
displayName: "ERC20", value: "ozerc20",
opts: { displayName: "ERC20",
upgradeable: 'uups' opts: {
} upgradeable: 'uups'
}, },
{ tagList: ["ERC20"]
value: "ozerc721", },
displayName: "ERC721 (NFT)", {
opts: { value: "ozerc721",
upgradeable: 'uups' displayName: "ERC721 (NFT)",
} opts: {
upgradeable: 'uups'
}, },
{ tagList: ["ERC721"]
value: "ozerc1155", },
displayName: "ERC1155", {
opts: { value: "ozerc1155",
upgradeable: 'uups' displayName: "ERC1155",
} opts: {
upgradeable: 'uups'
}, },
{ tagList: ["ERC1155"]
value: "ozerc20", },
displayName: "ERC20", {
opts: { value: "ozerc20",
upgradeable: 'uups', displayName: "ERC20",
mintable: true opts: {
} upgradeable: 'uups',
mintable: true
}, },
{ tagList: ["ERC20"]
value: "ozerc721", },
displayName: "ERC721 (NFT)", {
opts: { value: "ozerc721",
upgradeable: 'uups', displayName: "ERC721 (NFT)",
mintable: true opts: {
} upgradeable: 'uups',
mintable: true
}, },
{ tagList: ["ERC721"]
value: "ozerc1155", },
displayName: "ERC1155", {
opts: { value: "ozerc1155",
upgradeable: 'uups', displayName: "ERC1155",
mintable: true opts: {
} upgradeable: 'uups',
mintable: true
}, },
{ tagList: ["ERC1155"]
value: "ozerc20", },
displayName: "ERC20", {
opts: { value: "ozerc20",
upgradeable: 'uups', displayName: "ERC20",
mintable: true, opts: {
burnable: true upgradeable: 'uups',
} mintable: true,
burnable: true
}, },
{ tagList: ["ERC20"]
value: "ozerc721", },
displayName: "ERC721 (NFT)", {
opts: { value: "ozerc721",
upgradeable: 'uups', displayName: "ERC721 (NFT)",
mintable: true, opts: {
burnable: true upgradeable: 'uups',
} mintable: true,
burnable: true
}, },
{ tagList: ["ERC721"]
value: "ozerc1155", },
displayName: "ERC1155", {
opts: { value: "ozerc1155",
upgradeable: 'uups', displayName: "ERC1155",
mintable: true, opts: {
burnable: true upgradeable: 'uups',
} mintable: true,
burnable: true
}, },
{ tagList: ["ERC1155"]
value: "ozerc20", },
displayName: "ERC20", {
opts: { value: "ozerc20",
upgradeable: 'uups', displayName: "ERC20",
mintable: true, opts: {
pausable: true upgradeable: 'uups',
} mintable: true,
pausable: true
}, },
{ tagList: ["ERC20"]
value: "ozerc721", },
displayName: "ERC721 (NFT)", {
opts: { value: "ozerc721",
upgradeable: 'uups', displayName: "ERC721 (NFT)",
mintable: true, opts: {
pausable: true upgradeable: 'uups',
} mintable: true,
pausable: true
}, },
{ tagList: ["ERC721"]
value: "ozerc1155", },
displayName: "ERC1155", {
opts: { value: "ozerc1155",
upgradeable: 'uups', displayName: "ERC1155",
mintable: true, opts: {
pausable: true upgradeable: 'uups',
} mintable: true,
pausable: true
}, },
{ tagList: ["ERC1155"]
value: "ozerc1155", },
displayName: "ERC1155", {
opts: { value: "ozerc1155",
upgradeable: 'uups', displayName: "ERC1155",
mintable: true, opts: {
burnable: true, upgradeable: 'uups',
pausable: true mintable: true,
} burnable: true,
} pausable: true
] },
}, tagList: ["ERC1155"]
{ }
name: "OxProject", ]
items: [ },
{ value: "zeroxErc20", displayName: "ERC20" } {
] name: "OxProject",
}, items: [
{ { value: "zeroxErc20", displayName: "ERC20", tagList: ["ERC20"]}
name: "Gnosis Safe", ]
items: [ },
{ value: "gnosisSafeMultisig", displayName: intl.formatMessage({ id: 'filePanel.multiSigWallet' }) } {
] name: "Gnosis Safe",
}, items: [
{ { value: "gnosisSafeMultisig", displayName: intl.formatMessage({ id: 'filePanel.multiSigWallet' }) }
name: "Circom ZKP", ]
items: [ },
{ value: "semaphore", displayName: intl.formatMessage({ id: 'filePanel.semaphore' }) }, {
{ value: "hashchecker", displayName: intl.formatMessage({ id: 'filePanel.hashchecker' }) }, name: "Circom ZKP",
{ value: "rln", displayName: intl.formatMessage({ id: 'filePanel.rln' }) } items: [
] { value: "semaphore", tagList: ["ZKP"], displayName: intl.formatMessage({ id: 'filePanel.semaphore' }) },
}, { value: "hashchecker", tagList: ["ZKP"], displayName: intl.formatMessage({ id: 'filePanel.hashchecker' }) },
{ { value: "rln", tagList: ["ZKP"], displayName: intl.formatMessage({ id: 'filePanel.rln' }) }
name: "Generic ZKP", ]
items: [ },
{ value: "sindriScripts", displayName: intl.formatMessage({ id: 'filePanel.addscriptsindri' }) }, {
] name: "Generic ZKP",
}, items: [
{ { value: "sindriScripts", tagList: ["ZKP"], displayName: intl.formatMessage({ id: 'filePanel.addscriptsindri' }) },
name: "Uniswap V4", ],
items: [ },
{ value: "uniswapV4Template", displayName: intl.formatMessage({ id: 'filePanel.uniswapV4Template' }) }, {
{ value: "breakthroughLabsUniswapv4Hooks", displayName: intl.formatMessage({ id: 'filePanel.breakthroughLabsUniswapv4Hooks' }) }, name: "Uniswap V4",
{ value: "uniswapV4HookBookMultiSigSwapHook", displayName: intl.formatMessage({ id: 'filePanel.uniswapV4HookBookMultiSigSwapHook' }) } items: [
] { value: "uniswapV4Template", displayName: intl.formatMessage({ id: 'filePanel.uniswapV4Template' }) },
}, { value: "breakthroughLabsUniswapv4Hooks", displayName: intl.formatMessage({ id: 'filePanel.breakthroughLabsUniswapv4Hooks' }) },
{ { value: "uniswapV4HookBookMultiSigSwapHook", displayName: intl.formatMessage({ id: 'filePanel.uniswapV4HookBookMultiSigSwapHook' }) }
name: "Solidity CREATE2", ]
items: [ },
{ value: "contractCreate2Factory", displayName: intl.formatMessage({ id: 'filePanel.addcreate2solidityfactory' }) }, {
{ value: "contractDeployerScripts", displayName: intl.formatMessage({ id: 'filePanel.addscriptdeployer' }) } name: "Solidity CREATE2",
] items: [
}, { value: "contractCreate2Factory", displayName: intl.formatMessage({ id: 'filePanel.addcreate2solidityfactory' }) },
{ { value: "contractDeployerScripts", displayName: intl.formatMessage({ id: 'filePanel.addscriptdeployer' }) }
name: "Contract Verification", ]
items: [ },
{ value: "etherscanScripts", displayName: intl.formatMessage({ id: 'filePanel.addscriptetherscan' }) }, {
], name: "Contract Verification",
items: [
}, { value: "etherscanScripts", displayName: intl.formatMessage({ id: 'filePanel.addscriptetherscan' }) },
{ ],
name: 'Github Actions', },
items: [ {
{ value: "runJsTestAction", displayName: intl.formatMessage({ id: 'filePanel.tssoltestghaction' }) }, name: 'Github Actions',
{ value: "runSolidityUnittestingAction", displayName: intl.formatMessage({ id: 'filePanel.tssoltestghaction' }) }, items: [
{ value: "runSlitherAction", displayName: intl.formatMessage({ id: 'filePanel.slitherghaction' }) } { value: "runJsTestAction", displayName: intl.formatMessage({ id: 'filePanel.tssoltestghaction' }) },
], { value: "runSolidityUnittestingAction", displayName: intl.formatMessage({ id: 'filePanel.tssoltestghaction' }) },
IsArtefact: true { value: "runSlitherAction", displayName: intl.formatMessage({ id: 'filePanel.slitherghaction' }) }
} ],
] IsArtefact: true
}
]
} }
Write Preview
Loading…
Cancel
Save