contractGUI intl

apps/remix-ide/src/app/tabs/locales/en/udapp.json

@@ -49,5 +49,15 @@
   "udapp.ok": "OK",
   "udapp.alert": "Alert",
   "udapp.proceed": "Proceed",
-  "udapp.cancel": "Cancel"
+  "udapp.cancel": "Cancel",
+  "udapp.parameters": "Parameters",
+  "udapp.copyParameters": "Copy encoded input parameters to clipboard",
+  "udapp.copyCalldata": "Copy calldata to clipboard",
+  "udapp.deployWithProxy": "Deploy with Proxy",
+  "udapp.upgradeWithProxy": "Upgrade with Proxy",
+  "udapp.useLastDeployedERC1967Contract": "Use last deployed ERC1967 contract",
+  "udapp.proxyAddressLabel": "Proxy Address",
+  "udapp.proxyAddressPlaceholder": "proxy address",
+  "udapp.proxyAddressInputTooltip": "Enter previously deployed proxy address on the selected network",
+  "udapp.proxyAddressTooltip": "Select this option to use the last deployed ERC1967 contract on the current network."
 }

apps/remix-ide/src/app/tabs/locales/zh/udapp.json

@@ -49,5 +49,15 @@
   "udapp.ok": "确认",
   "udapp.alert": "警告",
   "udapp.proceed": "继续",
-  "udapp.cancel": "取消"
+  "udapp.cancel": "取消",
+  "udapp.parameters": "参数",
+  "udapp.copyParameters": "复制已编码的输入参数到粘贴板",
+  "udapp.copyCalldata": "复制 calldata 到粘贴板",
+  "udapp.deployWithProxy": "使用代理部署",
+  "udapp.upgradeWithProxy": "使用代理升级",
+  "udapp.useLastDeployedERC1967Contract": "使用最新的已部署的 ERC1967 合约",
+  "udapp.proxyAddressLabel": "代理地址",
+  "udapp.proxyAddressPlaceholder": "代理地址",
+  "udapp.proxyAddressInputTooltip": "输入先前在所选网络上部署的代理地址",
+  "udapp.proxyAddressTooltip": "选择此选项可使用当前网络上最后部署的 ERC1967 合约。"
 }

libs/remix-ui/run-tab/src/lib/components/contractGUI.tsx

@@ -1,5 +1,6 @@
 // eslint-disable-next-line no-use-before-define
 import React, { useEffect, useRef, useState } from 'react'
+import { FormattedMessage, useIntl } from 'react-intl'
 import * as remixLib from '@remix-project/remix-lib'
 import { ContractGUIProps } from '../types'
 import { CopyToClipboard } from '@remix-ui/clipboard'
@@ -26,6 +27,7 @@ export function ContractGUI (props: ContractGUIProps) {
   const multiFields = useRef<Array<HTMLInputElement | null>>([])
   const initializeFields = useRef<Array<HTMLInputElement | null>>([])
   const basicInputRef = useRef<HTMLInputElement>()
+  const intl = useIntl()
 
   useEffect(() => {
     if (props.deployOption && Array.isArray(props.deployOption)) {
@@ -238,7 +240,7 @@ export function ContractGUI (props: ContractGUIProps) {
 
   const handleSetProxyAddress = (e) => {
     const value = e.target.value
-    
+
     setProxyAddress(value)
   }
 
@@ -367,7 +369,7 @@ export function ContractGUI (props: ContractGUIProps) {
           </div>
           <div className="d-flex udapp_group udapp_multiArg">
             <CopyToClipboard
-              tip="Copy calldata to clipboard"
+              tip={intl.formatMessage({ id: 'udapp.copyCalldata' })}
               icon="fa-clipboard"
               direction={"bottom"}
               getContent={getEncodedCall}
@@ -382,7 +384,7 @@ export function ContractGUI (props: ContractGUIProps) {
               </button>
             </CopyToClipboard>
             <CopyToClipboard
-              tip="Copy encoded input parameters to clipboard"
+              tip={intl.formatMessage({ id: 'udapp.copyParameters' })}
               icon="fa-clipboard"
               direction={"bottom"}
               getContent={getEncodedParams}
@@ -393,7 +395,7 @@ export function ContractGUI (props: ContractGUIProps) {
                   className="m-0 remixui_copyIcon far fa-copy"
                   aria-hidden="true"
                 ></i>
-                <label htmlFor="copyParameters">Parameters</label>
+                <label htmlFor="copyParameters"><FormattedMessage id='udapp.parameters' /></label>
               </button>
             </CopyToClipboard>
             <CustomTooltip
@@ -431,7 +433,7 @@ export function ContractGUI (props: ContractGUIProps) {
                   data-id="contractGUIDeployWithProxyLabel"
                   className="m-0 form-check-label w-100 custom-control-label udapp_checkboxAlign"
                 >
-                  Deploy with Proxy
+                  <FormattedMessage id='udapp.deployWithProxy' />
                 </label>
             </div>
             <div>
@@ -497,7 +499,7 @@ export function ContractGUI (props: ContractGUIProps) {
                   data-id="contractGUIUpgradeImplementationLabel"
                   className="m-0 form-check-label custom-control-label udapp_checkboxAlign"
                 >
-                  Upgrade with Proxy
+                  <FormattedMessage id='udapp.upgradeWithProxy' />
                 </label>
             </div>
             <span onClick={handleToggleUpgradeImp}>
@@ -527,7 +529,7 @@ export function ContractGUI (props: ContractGUIProps) {
                   checked={useLastProxy}
                 />
                 <CustomTooltip
-                  tooltipText="Select this option to use the last deployed ERC1967 contract on the current network."
+                  tooltipText={<FormattedMessage id='udapp.proxyAddressTooltip' />}
                   tooltipId="proxyAddressTooltip"
                   placement="auto"
                   tooltipClasses="text-wrap"
@@ -538,7 +540,7 @@ export function ContractGUI (props: ContractGUIProps) {
                     className="m-0 form-check-label custom-control-label udapp_checkboxAlign"
                     style={{ fontSize: 12 }}
                   >
-                    Use last deployed ERC1967 contract
+                    <FormattedMessage id='udapp.useLastDeployedERC1967Contract' />
                   </label>
                 </CustomTooltip>
               </div>
@@ -546,10 +548,10 @@ export function ContractGUI (props: ContractGUIProps) {
                 !useLastProxy ?
                 <div className="mb-2">
                   <label className="mt-2 text-left d-block">
-                    Proxy Address :
+                    <FormattedMessage id='udapp.proxyAddressLabel' /> :
                   </label>
-                  <CustomTooltip placement="right" tooltipText={'Enter previously deployed proxy address on the selected network'}>
-                    <input style={{ height: 32 }} className="form-control udapp_input" data-id="ERC1967AddressInput" placeholder='proxy address' onChange={handleSetProxyAddress} onBlur={() => validateProxyAddress(proxyAddress) } />
+                  <CustomTooltip placement="right" tooltipText={<FormattedMessage id='udapp.proxyAddressInputTooltip' />}>
+                    <input style={{ height: 32 }} className="form-control udapp_input" data-id="ERC1967AddressInput" placeholder={intl.formatMessage({ id: 'udapp.proxyAddressPlaceholder' })} onChange={handleSetProxyAddress} onBlur={() => validateProxyAddress(proxyAddress) } />
                   </CustomTooltip>
                   { proxyAddressError && <span className='text-lowercase' data-id="errorMsgProxyAddress" style={{ fontSize: '.8em' }}>{ proxyAddressError }</span> }
                 </div> :