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. 56
      apps/remix-ide/src/app/plugins/templates-selection/templates-selection-plugin.tsx
  2. 76
      apps/remix-ide/src/app/plugins/templates-selection/templates.ts

56
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,16 +132,21 @@ 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}
@ -151,13 +157,37 @@ export class TemplatesSelectionPlugin extends ViewPlugin {
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>

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

@ -12,11 +12,13 @@ export const templates = (intl) => {
items: [ items: [
{ {
value: "ozerc20", value: "ozerc20",
displayName: "ERC20" displayName: "ERC20",
tagList: ["ERC20"]
}, },
{ {
value: "ozerc721", value: "ozerc721",
displayName: "ERC721 (NFT)" displayName: "ERC721 (NFT)",
tagList: ["ERC721"]
}, },
{ {
value: "ozerc1155", value: "ozerc1155",
@ -34,7 +36,8 @@ export const templates = (intl) => {
displayName: "ERC721 (NFT)", displayName: "ERC721 (NFT)",
opts: { opts: {
mintable: true mintable: true
} },
tagList: ["ERC721"]
}, },
{ {
value: "ozerc1155", value: "ozerc1155",
@ -49,7 +52,8 @@ export const templates = (intl) => {
opts: { opts: {
mintable: true, mintable: true,
burnable: true burnable: true
} },
tagList: ["ERC20"]
}, },
{ {
value: "ozerc721", value: "ozerc721",
@ -57,7 +61,8 @@ export const templates = (intl) => {
opts: { opts: {
mintable: true, mintable: true,
burnable: true burnable: true
} },
tagList: ["ERC721"]
}, },
{ {
value: "ozerc1155", value: "ozerc1155",
@ -65,7 +70,8 @@ export const templates = (intl) => {
opts: { opts: {
mintable: true, mintable: true,
burnable: true burnable: true
} },
tagList: ["ERC1155"]
}, },
{ {
value: "ozerc20", value: "ozerc20",
@ -73,7 +79,8 @@ export const templates = (intl) => {
opts: { opts: {
mintable: true, mintable: true,
pausable: true pausable: true
} },
tagList: ["ERC20"]
}, },
{ {
value: "ozerc721", value: "ozerc721",
@ -81,7 +88,8 @@ export const templates = (intl) => {
opts: { opts: {
mintable: true, mintable: true,
pausable: true pausable: true
} },
tagList: ["ERC721"]
}, },
{ {
value: "ozerc1155", value: "ozerc1155",
@ -101,21 +109,24 @@ export const templates = (intl) => {
displayName: "ERC20", displayName: "ERC20",
opts: { opts: {
upgradeable: 'uups' upgradeable: 'uups'
} },
tagList: ["ERC20"]
}, },
{ {
value: "ozerc721", value: "ozerc721",
displayName: "ERC721 (NFT)", displayName: "ERC721 (NFT)",
opts: { opts: {
upgradeable: 'uups' upgradeable: 'uups'
} },
tagList: ["ERC721"]
}, },
{ {
value: "ozerc1155", value: "ozerc1155",
displayName: "ERC1155", displayName: "ERC1155",
opts: { opts: {
upgradeable: 'uups' upgradeable: 'uups'
} },
tagList: ["ERC1155"]
}, },
{ {
value: "ozerc20", value: "ozerc20",
@ -123,7 +134,8 @@ export const templates = (intl) => {
opts: { opts: {
upgradeable: 'uups', upgradeable: 'uups',
mintable: true mintable: true
} },
tagList: ["ERC20"]
}, },
{ {
value: "ozerc721", value: "ozerc721",
@ -131,7 +143,8 @@ export const templates = (intl) => {
opts: { opts: {
upgradeable: 'uups', upgradeable: 'uups',
mintable: true mintable: true
} },
tagList: ["ERC721"]
}, },
{ {
value: "ozerc1155", value: "ozerc1155",
@ -139,7 +152,8 @@ export const templates = (intl) => {
opts: { opts: {
upgradeable: 'uups', upgradeable: 'uups',
mintable: true mintable: true
} },
tagList: ["ERC1155"]
}, },
{ {
value: "ozerc20", value: "ozerc20",
@ -148,7 +162,8 @@ export const templates = (intl) => {
upgradeable: 'uups', upgradeable: 'uups',
mintable: true, mintable: true,
burnable: true burnable: true
} },
tagList: ["ERC20"]
}, },
{ {
value: "ozerc721", value: "ozerc721",
@ -157,7 +172,8 @@ export const templates = (intl) => {
upgradeable: 'uups', upgradeable: 'uups',
mintable: true, mintable: true,
burnable: true burnable: true
} },
tagList: ["ERC721"]
}, },
{ {
value: "ozerc1155", value: "ozerc1155",
@ -166,7 +182,8 @@ export const templates = (intl) => {
upgradeable: 'uups', upgradeable: 'uups',
mintable: true, mintable: true,
burnable: true burnable: true
} },
tagList: ["ERC1155"]
}, },
{ {
value: "ozerc20", value: "ozerc20",
@ -175,7 +192,8 @@ export const templates = (intl) => {
upgradeable: 'uups', upgradeable: 'uups',
mintable: true, mintable: true,
pausable: true pausable: true
} },
tagList: ["ERC20"]
}, },
{ {
value: "ozerc721", value: "ozerc721",
@ -184,7 +202,8 @@ export const templates = (intl) => {
upgradeable: 'uups', upgradeable: 'uups',
mintable: true, mintable: true,
pausable: true pausable: true
} },
tagList: ["ERC721"]
}, },
{ {
value: "ozerc1155", value: "ozerc1155",
@ -193,7 +212,8 @@ export const templates = (intl) => {
upgradeable: 'uups', upgradeable: 'uups',
mintable: true, mintable: true,
pausable: true pausable: true
} },
tagList: ["ERC1155"]
}, },
{ {
value: "ozerc1155", value: "ozerc1155",
@ -203,14 +223,15 @@ export const templates = (intl) => {
mintable: true, mintable: true,
burnable: true, burnable: true,
pausable: true pausable: true
} },
tagList: ["ERC1155"]
} }
] ]
}, },
{ {
name: "OxProject", name: "OxProject",
items: [ items: [
{ value: "zeroxErc20", displayName: "ERC20" } { value: "zeroxErc20", displayName: "ERC20", tagList: ["ERC20"]}
] ]
}, },
{ {
@ -222,16 +243,16 @@ export const templates = (intl) => {
{ {
name: "Circom ZKP", name: "Circom ZKP",
items: [ items: [
{ value: "semaphore", displayName: intl.formatMessage({ id: 'filePanel.semaphore' }) }, { value: "semaphore", tagList: ["ZKP"], displayName: intl.formatMessage({ id: 'filePanel.semaphore' }) },
{ value: "hashchecker", displayName: intl.formatMessage({ id: 'filePanel.hashchecker' }) }, { value: "hashchecker", tagList: ["ZKP"], displayName: intl.formatMessage({ id: 'filePanel.hashchecker' }) },
{ value: "rln", displayName: intl.formatMessage({ id: 'filePanel.rln' }) } { value: "rln", tagList: ["ZKP"], displayName: intl.formatMessage({ id: 'filePanel.rln' }) }
] ]
}, },
{ {
name: "Generic ZKP", name: "Generic ZKP",
items: [ items: [
{ value: "sindriScripts", displayName: intl.formatMessage({ id: 'filePanel.addscriptsindri' }) }, { value: "sindriScripts", tagList: ["ZKP"], displayName: intl.formatMessage({ id: 'filePanel.addscriptsindri' }) },
] ],
}, },
{ {
name: "Uniswap V4", name: "Uniswap V4",
@ -253,7 +274,6 @@ export const templates = (intl) => {
items: [ items: [
{ value: "etherscanScripts", displayName: intl.formatMessage({ id: 'filePanel.addscriptetherscan' }) }, { value: "etherscanScripts", displayName: intl.formatMessage({ id: 'filePanel.addscriptetherscan' }) },
], ],
}, },
{ {
name: 'Github Actions', name: 'Github Actions',

Write Preview
Loading…
Cancel
Save