add settings and pluginManager localeMessage

pull/5370/head
drafish 2 years ago
parent 06e01d20cd
commit 804e6f73e7
  1. 3
      apps/remix-ide/src/app/components/plugin-manager-component.js
  2. 1
      apps/remix-ide/src/app/panels/file-panel.js
  3. 3
      apps/remix-ide/src/app/tabs/compile-tab.js
  4. 1
      apps/remix-ide/src/app/tabs/debugger-tab.js
  5. 48
      apps/remix-ide/src/app/tabs/locales/en-US.js
  6. 48
      apps/remix-ide/src/app/tabs/locales/zh-CN.js
  7. 7
      apps/remix-ide/src/app/tabs/search.tsx
  8. 1
      apps/remix-ide/src/app/tabs/settings-tab.tsx
  9. 5
      apps/remix-ide/src/app/udapp/run-tab.js
  10. 2
      apps/remix-ide/src/remixAppManager.js
  11. 2
      libs/remix-ui/locale-module/src/lib/remix-ui-locale-module.tsx
  12. 6
      libs/remix-ui/panel/src/lib/plugins/panel-header.tsx
  13. 7
      libs/remix-ui/plugin-manager/src/lib/components/ActivePluginCardContainer.tsx
  14. 7
      libs/remix-ui/plugin-manager/src/lib/components/InactivePluginCardContainer.tsx
  15. 59
      libs/remix-ui/plugin-manager/src/lib/components/LocalPluginForm.tsx
  16. 3
      libs/remix-ui/plugin-manager/src/lib/components/rootView.tsx
  17. 39
      libs/remix-ui/settings/src/lib/remix-ui-settings.tsx
  18. 2
      libs/remix-ui/theme-module/src/lib/remix-ui-theme-module.tsx

@ -8,6 +8,7 @@ const _paq = window._paq = window._paq || []
const profile = {
name: 'pluginManager',
displayName: 'Plugin manager',
intlId: 'pluginManager.displayName',
methods: [],
events: [],
icon: 'assets/img/pluginManager.webp',
@ -99,7 +100,7 @@ class PluginManagerComponent extends ViewPlugin {
return (
<div id='pluginManager'><PluginViewWrapper plugin={this} /></div>
);
}
getAndFilterPlugins = (filter) => {

@ -30,6 +30,7 @@ const { SlitherHandle } = require('../files/slither-handle.js')
const profile = {
name: 'filePanel',
displayName: 'File explorers',
intlId: 'filePanel.displayName',
methods: ['createNewFile', 'uploadFile', 'getCurrentWorkspace', 'getWorkspaces', 'createWorkspace', 'setWorkspace', 'registerContextMenuItem', 'renameWorkspace', 'deleteWorkspace'],
events: ['setWorkspace', 'workspaceRenamed', 'workspaceDeleted', 'workspaceCreated'],
icon: 'assets/img/fileManager.webp',

@ -12,6 +12,7 @@ import { compilerConfigChangedToastMsg, compileToastMsg } from '@remix-ui/helper
const profile = {
name: 'solidity',
displayName: 'Solidity compiler',
intlId: 'solidity.displayName',
icon: 'assets/img/solidity.webp',
description: 'Compile solidity contracts',
kind: 'compiler',
@ -98,7 +99,7 @@ class CompileTab extends CompilerApiMixin(ViewPlugin) { // implements ICompilerA
this.renderComponent()
// @todo(#2875) should use loading compiler return value to check whether the compiler is loaded instead of "setInterval"
const value = JSON.stringify(settings, null, '\t')
this.call('notification', 'toast', compilerConfigChangedToastMsg(this.currentRequest.from, value))
}

@ -10,6 +10,7 @@ const css = require('./styles/debugger-tab-styles')
const profile = {
name: 'debugger',
displayName: 'Debugger',
intlId: 'debugger.displayName',
methods: ['debug', 'getTrace'],
events: [],
icon: 'assets/img/debuggerLogo.webp',

@ -1,4 +1,48 @@
export default {
'themes': 'Themes',
'locales': 'Lanaguage',
'settings.displayName': 'Settings',
'settings.reset': 'Reset to Default settings',
'settings.general': 'General settings',
'settings.generateContractMetadataText': 'Generate contract metadata. Generate a JSON file in the contract folder. Allows to specify library addresses the contract depends on. If nothing is specified, Remix deploys libraries automatically.',
'settings.ethereunVMText': 'Always use Javascript VM at load',
'settings.wordWrapText': 'Word wrap in editor',
'settings.enablePersonalModeText': ' Enable Personal Mode for web3 provider. Transaction sent over Web3 will use the web3.personal API.\n',
'settings.warnText': 'Be sure the endpoint is opened before enabling it. \nThis mode allows a user to provide a passphrase in the Remix interface without having to unlock the account. Although this is very convenient, you should completely trust the backend you are connected to (Geth, Parity, ...). Remix never persists any passphrase'.split('\n').map(s => s.trim()).join(' '),
'settings.gitAccessTokenTitle': 'GitHub Access Token',
'settings.gitAccessTokenText': 'Manage the access token used to publish to Gist and retrieve GitHub contents.',
'settings.gitAccessTokenText2': 'Go to github token page (link below) to create a new token and save it in Remix. Make sure this token has only \'create gist\' permission.',
'settings.save': 'Save',
'settings.remove': 'Remove',
'settings.themes': 'Themes',
'settings.locales': 'Lanaguage',
'filePanel.displayName': 'File explorers',
'debugger.displayName': 'Debugger',
'udapp.displayName': 'Deploy & run transactions',
'search.displayName': 'Search in files',
'solidity.displayName': 'Solidity compiler',
'pluginManager.displayName': 'Plugin manager',
'pluginManager.activate': 'Activate',
'pluginManager.deactivate': 'Deactivate',
'pluginManager.activeModules': 'Active Modules',
'pluginManager.inactiveModules': 'Inactive Modules',
'pluginManager.connectLocal': 'Connect to a Local Plugin',
'pluginManager.localForm.title': 'Local Plugin',
'pluginManager.localForm.pluginName': 'Plugin Name',
'pluginManager.localForm.shouldBeCamelCase': 'Should be camelCase',
'pluginManager.localForm.displayName': 'Display Name',
'pluginManager.localForm.nameInTheHeader': 'Name in the header',
'pluginManager.localForm.required': 'required',
'pluginManager.localForm.commaSeparatedMethod': 'comma separated list of method names',
'pluginManager.localForm.commaSeparatedPlugin': 'comma separated list of plugin names',
'pluginManager.localForm.pluginsItCanActivate': 'Plugins it can activate',
'pluginManager.localForm.typeOfConnection': 'Type of connection',
'pluginManager.localForm.locationInRemix': 'Location in remix',
'pluginManager.localForm.sidePanel': 'Side Panel',
'pluginManager.localForm.mainPanel': 'Main Panel',
'pluginManager.localForm.none': 'None',
}

@ -1,4 +1,48 @@
export default {
'themes': '主题',
'locales': '语言',
'settings.displayName': '设置',
'settings.reset': '恢复默认设置',
'settings.general': '常规设置',
'settings.generateContractMetadataText': '生成合约元数据. 在contract文件夹中生成JSON文件. 允许指定合约依赖的库地址. 如果未指定任何内容,Remix将自动部署库.',
'settings.ethereunVMText': '加载时始终使用以太坊虚拟机',
'settings.wordWrapText': '文本换行',
'settings.enablePersonalModeText': '为web3提供器启用私有模式. 通过Web3发送的交易将使用web3.personal API.\n',
'settings.warnText': '在启用之前请确认访问端结点已经开放. \n此模式允许在Remix界面中提供密码而无需解锁账号. 虽然这很方便,但你应当完全信任所连接的后端节点 (Geth, Parity, ...). Remix不会持久化保存任何密码.'.split('\n').map(s => s.trim()).join(' '),
'settings.gitAccessTokenTitle': 'Github 访问 Token',
'settings.gitAccessTokenText': '管理用于发布到Gist以及读取Github内容的访问token.',
'settings.gitAccessTokenText2': '前往 github (参见下方链接) 创建一个新的token,然后保存到Remix中. 确保这个token只有 \'create gist\' 权限.',
'settings.save': '保存',
'settings.remove': '删除',
'settings.themes': '主题',
'settings.locales': '语言',
'filePanel.displayName': '文件浏览器',
'debugger.displayName': '调试器',
'udapp.displayName': '部署 & 发交易',
'search.displayName': '全文搜索',
'solidity.displayName': '合约编译',
'pluginManager.displayName': '插件管理',
'pluginManager.activate': '激活',
'pluginManager.deactivate': '停用',
'pluginManager.activeModules': '激活的模块',
'pluginManager.inactiveModules': '停用的模块',
'pluginManager.connectLocal': '连接本地插件',
'pluginManager.localForm.title': '本地插件',
'pluginManager.localForm.pluginName': '插件名称',
'pluginManager.localForm.shouldBeCamelCase': '应当采用驼峰命名法',
'pluginManager.localForm.displayName': '展示名称',
'pluginManager.localForm.nameInTheHeader': '标题中展示的名称',
'pluginManager.localForm.required': '必填',
'pluginManager.localForm.commaSeparatedMethod': '英文逗号分隔方法名称',
'pluginManager.localForm.commaSeparatedPlugin': '英文逗号分隔插件名称',
'pluginManager.localForm.pluginsItCanActivate': '能激活该插件的插件',
'pluginManager.localForm.typeOfConnection': '连接类型',
'pluginManager.localForm.locationInRemix': '在Remix中的位置',
'pluginManager.localForm.sidePanel': '侧面板',
'pluginManager.localForm.mainPanel': '主面板',
'pluginManager.localForm.none': '无',
}

@ -5,6 +5,7 @@ import { SearchTab } from '@remix-ui/search'
const profile = {
name: 'search',
displayName: 'Search in files',
intlId: 'search.displayName',
methods: [''],
events: [],
icon: 'assets/img/search_icon.webp',
@ -20,8 +21,8 @@ export class SearchPlugin extends ViewPlugin {
constructor () {
super(profile)
}
render() {
render() {
return (
<div id='searchTab'>
<SearchTab plugin={this}></SearchTab>
@ -29,4 +30,4 @@ export class SearchPlugin extends ViewPlugin {
);
}
}
}

@ -9,6 +9,7 @@ import { PluginViewWrapper } from '@remix-ui/helper'
const profile = {
name: 'settings',
displayName: 'Settings',
intlId: 'settings.displayName',
methods: ['get'],
events: [],
icon: 'assets/img/settings.webp',

@ -11,6 +11,7 @@ const _paq = window._paq = window._paq || []
const profile = {
name: 'udapp',
displayName: 'Deploy & run transactions',
intlId: 'udapp.displayName',
icon: 'assets/img/deployAndRun.webp',
description: 'execute and save transactions',
kind: 'udapp',
@ -68,7 +69,7 @@ export class RunTab extends ViewPlugin {
this.emit('clearAllInstancesReducer')
}
addInstance (address, abi, name) {
addInstance (address, abi, name) {
this.emit('addInstanceReducer', address, abi, name)
}
@ -94,7 +95,7 @@ export class RunTab extends ViewPlugin {
}
onReady (api) {
this.REACT_API = api
this.REACT_API = api
}
async onInitDone () {

@ -5,7 +5,7 @@ import { IframePlugin } from '@remixproject/engine-web'
const _paq = window._paq = window._paq || []
const requiredModules = [ // services + layout views + system views
'manager', 'config', 'compilerArtefacts', 'compilerMetadata', 'contextualListener', 'editor', 'offsetToLineColumnConverter', 'network', 'theme',
'manager', 'config', 'compilerArtefacts', 'compilerMetadata', 'contextualListener', 'editor', 'offsetToLineColumnConverter', 'network', 'theme', 'locale',
'fileManager', 'contentImport', 'blockchain', 'web3Provider', 'scriptRunner', 'fetchAndCompile', 'mainPanel', 'hiddenPanel', 'sidePanel', 'menuicons',
'filePanel', 'terminal', 'settings', 'pluginManager', 'tabs', 'udapp', 'dGitProvider', 'solidity', 'solidity-logic', 'gistHandler', 'layout',
'notification', 'permissionhandler', 'walkthrough', 'storage', 'restorebackupzip', 'link-libraries', 'deploy-libraries', 'openzeppelin-proxy', 'hardhat-provider', 'compileAndRun', 'search']

@ -17,7 +17,7 @@ export function RemixUiLocaleModule({ localeModule }: RemixUiLocaleModuleProps)
return (
<div className="border-top">
<div className="card-body pt-3 pb-2">
<h6 className="card-title"><FormattedMessage id='locales' defaultMessage='Lanaguage' /></h6>
<h6 className="card-title"><FormattedMessage id='settings.locales' defaultMessage='Lanaguage' /></h6>
<div className="card-text locales-container">
{localeModule.getLocales()
? localeModule.getLocales().map((locale, idx) => (

@ -1,5 +1,6 @@
/* eslint-disable jsx-a11y/anchor-has-content */
import React, { useEffect, useRef, useState } from 'react' // eslint-disable-line
import { FormattedMessage } from 'react-intl'
import { PluginRecord } from '../types'
import './panel.css'
@ -19,7 +20,10 @@ const RemixUIPanelHeader = (props: RemixPanelProps) => {
}, [props])
return (
<header className='swapitHeader'><h6 data-id='sidePanelSwapitTitle'>{plugin?.profile.displayName || plugin?.profile.name}</h6>
<header className='swapitHeader'>
<h6 data-id='sidePanelSwapitTitle'>
<FormattedMessage id={plugin?.profile.intlId || 'defaultId'} defaultMessage={plugin?.profile.displayName || plugin?.profile.name} />
</h6>
{plugin?.profile.documentation ? (<a href={plugin.profile.documentation} className="titleInfo mb-2" title="link to documentation" target="_blank" rel="noreferrer"><i aria-hidden="true" className="fas fa-book"></i></a>) : ''}
</header>)
}

@ -1,6 +1,7 @@
/* eslint-disable @typescript-eslint/no-unused-vars */
import { Profile } from '@remixproject/plugin-utils'
import React from 'react' // eslint-disable-line no-use-before-define
import { useIntl } from 'react-intl'
import { PluginManagerComponent } from '../../types'
import ActivePluginCard from './ActivePluginCard'
import ModuleHeading from './moduleHeading'
@ -15,13 +16,15 @@ function ActivePluginCardContainer ({ pluginComponent }: ActivePluginCardContain
pluginComponent.deactivateP(pluginName)
}
const intl = useIntl();
return (
<React.Fragment>
{(pluginComponent.activePlugins && pluginComponent.activePlugins.length) ? <ModuleHeading headingLabel="Active Modules" count={pluginComponent.activePlugins.length} /> : null}
{(pluginComponent.activePlugins && pluginComponent.activePlugins.length) ? <ModuleHeading headingLabel={intl.formatMessage({id: 'pluginManager.activeModules' , defaultMessage: 'Active Modules'})} count={pluginComponent.activePlugins.length} /> : null}
{pluginComponent.activePlugins && pluginComponent.activePlugins.map((profile, idx) => {
return (
<ActivePluginCard
buttonText="Deactivate"
buttonText={intl.formatMessage({id: 'pluginManager.deactivate' , defaultMessage: 'Deactivate'})}
profile={profile}
deactivatePlugin={deactivatePlugin}
key={idx}

@ -1,6 +1,7 @@
/* eslint-disable @typescript-eslint/no-unused-vars */
import { Profile } from '@remixproject/plugin-utils'
import React from 'react' // eslint-disable-line no-use-before-define
import { useIntl } from 'react-intl'
import { PluginManagerComponent } from '../../types'
import InactivePluginCard from './InactivePluginCard'
import ModuleHeading from './moduleHeading'
@ -16,13 +17,15 @@ function InactivePluginCardContainer ({ pluginComponent }: InactivePluginCardCon
pluginComponent.activateP(pluginName)
}
const intl = useIntl();
return (
<React.Fragment>
{(pluginComponent.inactivePlugins && pluginComponent.inactivePlugins.length) ? <ModuleHeading headingLabel="Inactive Modules" count={pluginComponent.inactivePlugins.length} /> : null}
{(pluginComponent.inactivePlugins && pluginComponent.inactivePlugins.length) ? <ModuleHeading headingLabel={intl.formatMessage({id: 'pluginManager.inactiveModules' , defaultMessage: 'Inactive Modules'})} count={pluginComponent.inactivePlugins.length} /> : null}
{pluginComponent.inactivePlugins && pluginComponent.inactivePlugins.map((profile, idx) => {
return (
<InactivePluginCard
buttonText="Activate"
buttonText={intl.formatMessage({id: 'pluginManager.activate' , defaultMessage: 'Activate'})}
profile={profile}
key={idx}
activatePlugin={activatePlugin}

@ -3,7 +3,7 @@ import React, { useEffect, useReducer, useState } from 'react' // eslint-disable
import { ModalDialog } from '@remix-ui/modal-dialog'
import { Toaster } from '@remix-ui/toaster'
import { IframePlugin, WebsocketPlugin } from '@remixproject/engine-web'
import { FormattedMessage, useIntl } from 'react-intl'
import { localPluginReducerActionType, localPluginToastReducer } from '../reducers/pluginManagerReducer'
import { canActivate, FormStateProps, PluginManagerComponent } from '../../types'
@ -93,12 +93,14 @@ function LocalPluginForm ({ closeModal, visible, pluginManager }: LocalPluginFor
}
}
const intl = useIntl()
return (
<><ModalDialog
handleHide={closeModal}
id="pluginManagerLocalPluginModalDialog"
hide={visible}
title="Local Plugin"
title={intl.formatMessage({ id: 'pluginManager.localForm.title', defaultMessage: 'Local Plugin' })}
okLabel="OK"
okFn={ handleModalOkClick }
cancelLabel="Cancel"
@ -106,27 +108,36 @@ function LocalPluginForm ({ closeModal, visible, pluginManager }: LocalPluginFor
>
<form id="local-plugin-form">
<div className="form-group">
<label htmlFor="plugin-name">Plugin Name <small>(required)</small></label>
<label htmlFor="plugin-name">
<FormattedMessage id='pluginManager.localForm.pluginName' defaultMessage='Plugin Name' />
&nbsp;
<small>(<FormattedMessage id='pluginManager.localForm.required' defaultMessage='required' />)</small>
</label>
<input
className="form-control"
onChange={e => setName(e.target.value)}
value={ name || '' }
id="plugin-name"
data-id="localPluginName"
placeholder="Should be camelCase" />
placeholder={intl.formatMessage({ id: 'pluginManager.localForm.shouldBeCamelCase', defaultMessage: 'Should be camelCase' })} />
</div>
<div className="form-group">
<label htmlFor="plugin-displayname">Display Name</label>
<label htmlFor="plugin-displayname">
<FormattedMessage id='pluginManager.localForm.displayName' defaultMessage='Display Name' />
</label>
<input
className="form-control"
onChange={e => setDisplayName(e.target.value)}
value={ displayName || '' }
id="plugin-displayname"
data-id="localPluginDisplayName"
placeholder="Name in the header" />
placeholder={intl.formatMessage({ id: 'pluginManager.localForm.nameInTheHeader', defaultMessage: 'Name in the header' })} />
</div>
<div className="form-group">
<label htmlFor="plugin-methods">Api (comma separated list of method names)</label>
<label htmlFor="plugin-methods">
Api&nbsp;
(<FormattedMessage id='pluginManager.localForm.commaSeparatedMethod' defaultMessage='comma separated list of method names' />)
</label>
<input
className="form-control"
onChange={e => setMethods(e.target.value)}
@ -136,7 +147,11 @@ function LocalPluginForm ({ closeModal, visible, pluginManager }: LocalPluginFor
placeholder="Methods" />
</div>
<div className="form-group">
<label htmlFor="plugin-methods">Plugins it can activate (comma separated list of plugin names)</label>
<label htmlFor="plugin-methods">
<FormattedMessage id='pluginManager.localForm.pluginsItCanActivate' defaultMessage='Plugins it can activate' />
&nbsp;
(<FormattedMessage id='pluginManager.localForm.commaSeparatedPlugin' defaultMessage='comma separated list of plugin names' />)
</label>
<input
className="form-control"
onChange={e => setCanactivate(e.target.value)}
@ -147,7 +162,11 @@ function LocalPluginForm ({ closeModal, visible, pluginManager }: LocalPluginFor
</div>
<div className="form-group">
<label htmlFor="plugin-url">Url <small>(required)</small></label>
<label htmlFor="plugin-url">Url&nbsp;
<small>
(<FormattedMessage id='pluginManager.localForm.required' defaultMessage='required' />)
</small>
</label>
<input
className="form-control"
onChange={e => setUrl(e.target.value)}
@ -156,7 +175,13 @@ function LocalPluginForm ({ closeModal, visible, pluginManager }: LocalPluginFor
data-id="localPluginUrl"
placeholder="ex: https://localhost:8000" />
</div>
<h6>Type of connection <small>(required)</small></h6>
<h6>
<FormattedMessage id='pluginManager.localForm.typeOfConnection' defaultMessage='Type of connection' />
&nbsp;
<small>
(<FormattedMessage id='pluginManager.localForm.required' defaultMessage='required' />)
</small>
</h6>
<div className="form-check form-group">
<div className="radio">
<input
@ -183,7 +208,13 @@ function LocalPluginForm ({ closeModal, visible, pluginManager }: LocalPluginFor
<label className="form-check-label" htmlFor="ws">Websocket</label>
</div>
</div>
<h6>Location in remix <small>(required)</small></h6>
<h6>
<FormattedMessage id='pluginManager.localForm.locationInRemix' defaultMessage='Location in remix' />
&nbsp;
<small>
(<FormattedMessage id='pluginManager.localForm.required' defaultMessage='required' />)
</small>
</h6>
<div className="form-check form-group">
<div className="radio">
<input
@ -195,7 +226,7 @@ function LocalPluginForm ({ closeModal, visible, pluginManager }: LocalPluginFor
data-id='localPluginRadioButtonsidePanel'
checked={location === 'sidePanel'}
onChange={(e) => setLocation(e.target.value as 'sidePanel' | 'mainPanel' | 'none')} />
<label className="form-check-label" htmlFor="sidePanel">Side Panel</label>
<label className="form-check-label" htmlFor="sidePanel"><FormattedMessage id='pluginManager.localForm.sidePanel' defaultMessage='Side Panel' /></label>
</div>
<div className="radio">
<input
@ -207,7 +238,7 @@ function LocalPluginForm ({ closeModal, visible, pluginManager }: LocalPluginFor
data-id='localPluginRadioButtonmainPanel'
checked={location === 'mainPanel'}
onChange={(e) => setLocation(e.target.value as 'sidePanel' | 'mainPanel' | 'none')} />
<label className="form-check-label" htmlFor="mainPanel">Main Panel</label>
<label className="form-check-label" htmlFor="mainPanel"><FormattedMessage id='pluginManager.localForm.mainPanel' defaultMessage='Main Panel' /></label>
</div>
<div className="radio">
<input
@ -219,7 +250,7 @@ function LocalPluginForm ({ closeModal, visible, pluginManager }: LocalPluginFor
data-id='localPluginRadioButtonnone'
checked={location === 'none'}
onChange={(e) => setLocation(e.target.value as 'sidePanel' | 'mainPanel' | 'none')} />
<label className="form-check-label" htmlFor="none">None</label>
<label className="form-check-label" htmlFor="none"><FormattedMessage id='pluginManager.localForm.none' defaultMessage='None' /></label>
</div>
</div>
</form>

@ -1,5 +1,6 @@
/* eslint-disable @typescript-eslint/no-unused-vars */
import React, { Fragment, ReactNode, useEffect, useState } from 'react' // eslint-disable-line no-use-before-define
import { FormattedMessage } from 'react-intl'
import { PluginManagerComponent, PluginManagerSettings } from '../../types'
import PermisssionsSettings from './permissionsSettings'
import { Profile } from '@remixproject/plugin-utils'
@ -47,7 +48,7 @@ function RootView ({ pluginComponent, children }: RootViewProps) {
data-id="pluginManagerComponentSearchInput"
/>
<button onClick={openModal} className="remixui_pluginSearchButton btn bg-transparent text-dark border-0 mt-2 text-underline" data-id="pluginManagerComponentPluginSearchButton">
Connect to a Local Plugin
<FormattedMessage id='pluginManager.connectLocal' defaultMessage='Connect to a Local Plugin' />
</button>
</header>
{children}

@ -9,6 +9,7 @@ import { initialState, toastInitialState, toastReducer, settingReducer } from '.
import { Toaster } from '@remix-ui/toaster'// eslint-disable-line
import { RemixUiThemeModule, ThemeModule} from '@remix-ui/theme-module'
import { RemixUiLocaleModule, LocaleModule} from '@remix-ui/locale-module'
import { FormattedMessage, useIntl } from 'react-intl'
/* eslint-disable-next-line */
export interface RemixUiSettingsProps {
@ -33,6 +34,7 @@ export const RemixUiSettings = (props: RemixUiSettingsProps) => {
const [ipfsProtocol, setipfsProtocol] = useState('')
const [ipfsProjectId, setipfsProjectId] = useState('')
const [ipfsProjectSecret, setipfsProjectSecret] = useState('')
const intl = useIntl()
const initValue = () => {
@ -150,27 +152,36 @@ export const RemixUiSettings = (props: RemixUiSettingsProps) => {
} catch (e) {
console.log(e)
}
}}>Reset to Default settings</button>
}}><FormattedMessage id='settings.reset' defaultMessage='Reset to Default settings' /></button>
</div>
<div className="card-body pt-3 pb-2">
<h6 className="card-title">General settings</h6>
<h6 className="card-title"><FormattedMessage id='settings.general' defaultMessage='General settings' /></h6>
<div className="mt-2 custom-control custom-checkbox mb-1">
<input onChange={onchangeGenerateContractMetadata} id="generatecontractmetadata" data-id="settingsTabGenerateContractMetadata" type="checkbox" className="custom-control-input" name="contractMetadata" checked = { isMetadataChecked }/>
<label className={`form-check-label custom-control-label align-middle ${getTextClass('settings/generate-contract-metadata')}`} data-id="settingsTabGenerateContractMetadataLabel" htmlFor="generatecontractmetadata">{generateContractMetadataText}</label>
<label className={`form-check-label custom-control-label align-middle ${getTextClass('settings/generate-contract-metadata')}`} data-id="settingsTabGenerateContractMetadataLabel" htmlFor="generatecontractmetadata">
<FormattedMessage id='settings.generateContractMetadataText' defaultMessage={generateContractMetadataText} />
</label>
</div>
<div className="fmt-2 custom-control custom-checkbox mb-1">
<input onChange={onchangeOption} className="custom-control-input" id="alwaysUseVM" data-id="settingsTabAlwaysUseVM" type="checkbox" name="ethereumVM" checked={ isEthereumVMChecked }/>
<label className={`form-check-label custom-control-label align-middle ${getTextClass('settings/always-use-vm')}`} htmlFor="alwaysUseVM">{ethereunVMText}</label>
<label className={`form-check-label custom-control-label align-middle ${getTextClass('settings/always-use-vm')}`} htmlFor="alwaysUseVM">
<FormattedMessage id='settings.ethereunVMText' defaultMessage={ethereunVMText} />
</label>
</div>
<div className="mt-2 custom-control custom-checkbox mb-1">
<input id="editorWrap" className="custom-control-input" type="checkbox" onChange={textWrapEvent} checked = { isEditorWrapChecked }/>
<label className={`form-check-label custom-control-label align-middle ${getTextClass('settings/text-wrap')}`} htmlFor="editorWrap">{wordWrapText}</label>
<label className={`form-check-label custom-control-label align-middle ${getTextClass('settings/text-wrap')}`} htmlFor="editorWrap">
<FormattedMessage id='settings.wordWrapText' defaultMessage={wordWrapText} />
</label>
</div>
<div className="custom-control custom-checkbox mb-1">
<input onChange={onchangePersonal} id="personal" type="checkbox" className="custom-control-input" checked = { isPersonalChecked }/>
<label className={`form-check-label custom-control-label align-middle ${getTextClass('settings/personal-mode')}`} htmlFor="personal">
<i className="fas fa-exclamation-triangle text-warning" aria-hidden="true"></i> <span> </span>
<span> </span>{enablePersonalModeText} {warnText}
<span> </span>
<FormattedMessage id='settings.enablePersonalModeText' defaultMessage={enablePersonalModeText} />
&nbsp;
<FormattedMessage id='settings.warnText' defaultMessage={warnText} />
</label>
</div>
<div className="custom-control custom-checkbox mb-1">
@ -209,17 +220,19 @@ export const RemixUiSettings = (props: RemixUiSettingsProps) => {
const token = (type: string) => (
<div className="border-top">
<div className="card-body pt-3 pb-2">
<h6 className="card-title">{ labels[type].title }</h6>
<p className="mb-1">{ labels[type].message1 }</p>
<p className="">{ labels[type].message2 }</p>
<h6 className="card-title"><FormattedMessage id='settings.gitAccessTokenTitle' defaultMessage={ labels[type].title } /></h6>
<p className="mb-1"><FormattedMessage id='settings.gitAccessTokenText' defaultMessage={ labels[type].message1 } /></p>
<p className=""><FormattedMessage id='settings.gitAccessTokenText2' defaultMessage={ labels[type].message2 } /></p>
<p className="mb-1"><a className="text-primary" target="_blank" href={labels[type].link}>{ labels[type].link }</a></p>
<div className=""><label>TOKEN:</label>
<div className="text-secondary mb-0 h6">
<input id="gistaccesstoken" data-id="settingsTabGistAccessToken" type="password" className="form-control" onChange={(e) => handleSaveTokenState(e, type)} value={ tokenValue[type] } />
<div className="d-flex justify-content-end pt-2">
<CopyToClipboard content={tokenValue[type]} data-id='copyToClipboardCopyIcon' />
<input className="btn btn-sm btn-primary ml-2" id="savegisttoken" data-id="settingsTabSaveGistToken" onClick={() => saveToken(type)} value="Save" type="button" disabled={tokenValue === ''}></input>
<button className="btn btn-sm btn-secondary ml-2" id="removegisttoken" data-id="settingsTabRemoveGistToken" title="Delete GitHub access token" onClick={() => removeToken(type)}>Remove</button>
<input className="btn btn-sm btn-primary ml-2" id="savegisttoken" data-id="settingsTabSaveGistToken" onClick={() => saveToken(type)} value={intl.formatMessage({id: 'settings.save', defaultMessage: 'Save'})} type="button" disabled={tokenValue === ''}></input>
<button className="btn btn-sm btn-secondary ml-2" id="removegisttoken" data-id="settingsTabRemoveGistToken" title="Delete GitHub access token" onClick={() => removeToken(type)}>
<FormattedMessage id='settings.remove' defaultMessage='Remove' />
</button>
</div>
</div></div>
</div>
@ -262,7 +275,7 @@ export const RemixUiSettings = (props: RemixUiSettingsProps) => {
</div>
</div>
<div className="d-flex justify-content-end pt-2">
<input className="btn btn-sm btn-primary ml-2" id="saveswarmsettings" data-id="settingsTabSaveSwarmSettings" onClick={() => saveSwarmSettings()} value="Save" type="button" disabled={privateBeeAddress === ''}></input>
<input className="btn btn-sm btn-primary ml-2" id="saveswarmsettings" data-id="settingsTabSaveSwarmSettings" onClick={() => saveSwarmSettings()} value={intl.formatMessage({id: 'settings.save', defaultMessage: 'Save'})} type="button" disabled={privateBeeAddress === ''}></input>
</div>
</div>
</div>
@ -339,7 +352,7 @@ export const RemixUiSettings = (props: RemixUiSettingsProps) => {
</div>
</div>
<div className="d-flex justify-content-end pt-2">
<input className="btn btn-sm btn-primary ml-2" id="saveIpfssettings" data-id="settingsTabSaveIpfsSettings" onClick={() => saveIpfsSettings()} value="Save" type="button"></input>
<input className="btn btn-sm btn-primary ml-2" id="saveIpfssettings" data-id="settingsTabSaveIpfsSettings" onClick={() => saveIpfsSettings()} value={intl.formatMessage({id: 'settings.save', defaultMessage: 'Save'})} type="button"></input>
</div>
</div>
</div>)

@ -19,7 +19,7 @@ export function RemixUiThemeModule({ themeModule }: RemixUiThemeModuleProps) {
return (
<div className="border-top">
<div className="card-body pt-3 pb-2">
<h6 className="card-title"><FormattedMessage id='themes' defaultMessage='Themes' /></h6>
<h6 className="card-title"><FormattedMessage id='settings.themes' defaultMessage='Themes' /></h6>
<div className="card-text themes-container">
{themeModule.getThemes()
? themeModule.getThemes().map((theme, idx) => (

Loading…
Cancel
Save