contractDropdownUI intl

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

@@ -4,6 +4,9 @@
   "udapp.account": "Account",
   "udapp.value": "Value",
   "udapp.contract": "Contract",
+  "udapp.compiledBy": "Compiled by {compilerName}",
+  "udapp.infoSyncCompiledContractTooltip": "Click here to import contracts compiled from an external framework.{br}This action is enabled when Remix is connected to an external{br} framework (hardhat, truffle, foundry) through remixd.",
+  "udapp.remixIpfsUdappTooltip": "Publishing the source code and metadata to IPFS facilitates{br} source code verification using Sourcify and will greatly foster{br} contract adoption (auditing, debugging, calling it, etc...)",
   "udapp.signAMessage": "Sign a message",
   "udapp.enterAMessageToSign": "Enter a message to sign",
   "udapp.hash": "hash",
@@ -15,7 +18,19 @@
   "udapp.publishTo": "Publish to",
   "udapp.or": "or",
   "udapp.atAddress": "At Address",
+  "udapp.atAddressOptionsTitle1": "address of contract",
+  "udapp.atAddressOptionsTitle2": "Interact with the deployed contract - requires the .abi file or {br} compiled .sol file to be selected in the editor {br}(with the same compiler configuration)",
+  "udapp.atAddressOptionsTitle3": "Compile a *.sol file or select a *.abi file.",
+  "udapp.atAddressOptionsTitle4": "To interact with a deployed contract, either{br} enter its address and compile its source *.sol file {br}(with the same compiler settings) or select its .abi file in the editor. ",
+  "udapp.contractOptionsTitle1": "Please compile *.sol file to deploy or access a contract",
+  "udapp.contractOptionsTitle2": "Select a compiled contract to deploy or to use with At Address.",
+  "udapp.contractOptionsTitle3": "Select and compile *.sol file to deploy or access a contract.",
+  "udapp.contractOptionsTitle4": "When there is a compiled .sol file, choose the {br} contract to deploy or to use with AtAddress.'",
+  "udapp.checkSumWarning": "It seems you are not using a checksumed address.{br}A checksummed address is an address that contains uppercase letters, as specified in {a}.{br}Checksummed addresses are meant to help prevent users from sending transactions to the wrong address.",
+  "udapp.isOverSizePrompt": "Contract creation initialization returns data with length of more than 24576 bytes. The deployment will likely fails. {br}More info: {a}",
+  "udapp.thisContractMayBeAbstract": "This contract may be abstract, it may not implement an abstract parent's methods completely or it may not invoke an inherited contract's constructor correctly.",
   "udapp.noCompiledContracts": "No compiled contracts",
+  "udapp.addressOfContract": "Address of contract",
   "udapp.loadContractFromAddress": "Load contract from Address",
   "udapp.deployedContracts": "Deployed Contracts",
   "udapp.deployAndRunClearInstances": "Clear instances list and reset recorder",
@@ -30,5 +45,9 @@
   "udapp.livemodeRecorderLabel": "Run transactions using the latest compilation result",
   "udapp.runRecorderTooltip": "Run transaction(s) from the current scenario file",
   "udapp.save": "Save",
-  "udapp.run": "Run"
+  "udapp.run": "Run",
+  "udapp.ok": "OK",
+  "udapp.alert": "Alert",
+  "udapp.proceed": "Proceed",
+  "udapp.cancel": "Cancel"
 }

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

@@ -4,6 +4,9 @@
   "udapp.account": "账户",
   "udapp.value": "以太币数量",
   "udapp.contract": "合约",
+  "udapp.compiledBy": "由 {compilerName} 编译",
+  "udapp.infoSyncCompiledContractTooltip": "单击此处导入从外部框架编译的合约。{br}当 Remix 通过 remixd 连接到外部{br}框架 (hardhat、truffle、foundry) 时启用此操作。",
+  "udapp.remixIpfsUdappTooltip": "将源代码和元数据发布到 IPFS 有助于{br}使用 Sourcify 验证源代码，并将极大地促进{br}合约采用（审计、调试、调用等）",
   "udapp.signAMessage": "给一个消息签名",
   "udapp.enterAMessageToSign": "输入一个需要签名的消息",
   "udapp.hash": "哈希",
@@ -15,7 +18,19 @@
   "udapp.publishTo": "发布到",
   "udapp.or": "或",
   "udapp.atAddress": "At Address",
+  "udapp.atAddressOptionsTitle1": "合约地址",
+  "udapp.atAddressOptionsTitle2": "与已部署的合约交互 - 需要在编辑器中选择 .abi 文件或{br}编译的 .sol 文件{br}（具有相同的编译器配置）",
+  "udapp.atAddressOptionsTitle3": "编译一个 *.sol 文件或选中一个 *.abi 文件。",
+  "udapp.atAddressOptionsTitle4": "要与已部署的合约进行交互，{br} 输入其地址并编译其源 *.sol 文件{br}（使用相同的编译器设置）或在编辑器中选择其 .abi 文件。",
+  "udapp.contractOptionsTitle1": "请编译 *.sol 文件以部署或访问合约",
+  "udapp.contractOptionsTitle2": "选择要部署或与 At Address 一起使用的已编译合约。",
+  "udapp.contractOptionsTitle3": "选择并编译 *.sol 文件以部署或访问合约。",
+  "udapp.contractOptionsTitle4": "当有编译的 .sol 文件时，选择 {br} 合约进行部署或与 AtAddress 一起使用。",
+  "udapp.checkSumWarning": "您似乎没有使用 checksumed address 。{br} checksumed address 是包含大写字母的地址，如 {a} 中所指定。{br} checksumed address 旨在帮助防止用户将交易发送到错误地址。",
+  "udapp.isOverSizePrompt": "合约创建初始化返回长度超过24576字节的数据。部署可能会失败。 {br}更多信息：{a}",
+  "udapp.thisContractMayBeAbstract": "这个合约可能是抽象的，它可能没有完全实现抽象父类的方法，或者它可能没有正确调用继承合约的构造函数。",
   "udapp.noCompiledContracts": "没有已编译的合约",
+  "udapp.addressOfContract": "合约地址",
   "udapp.loadContractFromAddress": "加载此地址的合约",
   "udapp.deployedContracts": "已部署的合约",
   "udapp.deployAndRunClearInstances": "清空合约实例并重置交易记录",
@@ -30,5 +45,9 @@
   "udapp.livemodeRecorderLabel": "用最新的编译结果执行交易",
   "udapp.runRecorderTooltip": "从当前场景文件中执行交易",
   "udapp.save": "保存",
-  "udapp.run": "执行"
+  "udapp.run": "执行",
+  "udapp.ok": "确认",
+  "udapp.alert": "警告",
+  "udapp.proceed": "继续",
+  "udapp.cancel": "取消"
 }

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

@@ -18,12 +18,12 @@ export function ContractDropdownUI (props: ContractDropdownProps) {
     content: ''
   })
   const [atAddressOptions, setAtAddressOptions] = useState<{ title: string | JSX.Element, disabled: boolean }>({
-    title: 'address of contract',
+    title: <FormattedMessage id='udapp.atAddressOptionsTitle1' />,
     disabled: true
   })
   const [loadedAddress, setLoadedAddress] = useState<string>('')
   const [contractOptions, setContractOptions] = useState<{ title: string | JSX.Element, disabled: boolean }>({
-    title: 'Please compile *.sol file to deploy or access a contract',
+    title: <FormattedMessage id='udapp.contractOptionsTitle1' />,
     disabled: true
   })
   const [loadedContractData, setLoadedContractData] = useState<ContractData>(null)
@@ -136,12 +136,12 @@ export function ContractDropdownUI (props: ContractDropdownProps) {
     if (enable) {
       setAtAddressOptions({
         disabled: false,
-        title: <span className="text-start">Interact with the deployed contract - requires the .abi file or <br /> compiled .sol file to be selected in the editor <br />(with the same compiler configuration)</span>
+        title: <span className="text-start"><FormattedMessage id='udapp.atAddressOptionsTitle2' values={{ br: <br /> }} /></span>
       })
     } else {
       setAtAddressOptions({
         disabled: true,
-        title: loadedAddress ? 'Compile a *.sol file or select a *.abi file.' : <span className="text-start">To interact with a deployed contract, either<br /> enter its address and compile its source *.sol file <br />(with the same compiler settings) or select its .abi file in the editor. </span>
+        title: loadedAddress ? <FormattedMessage id='udapp.atAddressOptionsTitle3' /> : <span className="text-start"><FormattedMessage id='udapp.atAddressOptionsTitle4' values={{ br: <br /> }} /></span>
       })
     }
   }
@@ -150,12 +150,12 @@ export function ContractDropdownUI (props: ContractDropdownProps) {
     if (enable) {
       setContractOptions({
         disabled: false,
-        title: 'Select a compiled contract to deploy or to use with At Address.'
+        title: <FormattedMessage id='udapp.contractOptionsTitle2' />
       })
     } else {
       setContractOptions({
         disabled: true,
-        title: loadType === 'sol' ? 'Select and compile *.sol file to deploy or access a contract.' : <span className="text-start">When there is a compiled .sol file, choose the <br /> contract to deploy or to use with AtAddress.'</span>
+        title: loadType === 'sol' ? <FormattedMessage id='udapp.contractOptionsTitle3' /> : <span className="text-start"><FormattedMessage id='udapp.contractOptionsTitle4' values={{ br: <br /> }} /></span>
       })
     }
   }
@@ -166,20 +166,20 @@ export function ContractDropdownUI (props: ContractDropdownProps) {
 
   const createInstance = (selectedContract, args, deployMode?: DeployMode[]) => {
     if (selectedContract.bytecodeObject.length === 0) {
-      return props.modal('Alert', 'This contract may be abstract, it may not implement an abstract parent\'s methods completely or it may not invoke an inherited contract\'s constructor correctly.', 'OK', () => { })
+      return props.modal(intl.formatMessage({ id: 'udapp.alert' }), intl.formatMessage({ id: 'udapp.thisContractMayBeAbstract' }), intl.formatMessage({ id: 'udapp.ok' }), () => { })
     }
     if ((selectedContract.name !== currentContract) && (selectedContract.name === 'ERC1967Proxy')) selectedContract.name = currentContract
     const isProxyDeployment = (deployMode || []).find(mode => mode === 'Deploy with Proxy')
     const isContractUpgrade = (deployMode || []).find(mode => mode === 'Upgrade with Proxy')
 
     if (isProxyDeployment) {
-      props.modal('Deploy Implementation & Proxy (ERC1967)', deployWithProxyMsg(), 'Proceed', () => {
+      props.modal('Deploy Implementation & Proxy (ERC1967)', deployWithProxyMsg(), intl.formatMessage({ id: 'udapp.proceed' }), () => {
         props.createInstance(loadedContractData, props.gasEstimationPrompt, props.passphrasePrompt, props.publishToStorage, props.mainnetPrompt, isOverSizePrompt, args, deployMode)
-      }, 'Cancel', () => { })
+      }, intl.formatMessage({ id: 'udapp.cancel' }), () => { })
     } else if (isContractUpgrade) {
-      props.modal('Deploy Implementation & Update Proxy', upgradeWithProxyMsg(), 'Proceed', () => {
+      props.modal('Deploy Implementation & Update Proxy', upgradeWithProxyMsg(), intl.formatMessage({ id: 'udapp.proceed' }), () => {
         props.createInstance(loadedContractData, props.gasEstimationPrompt, props.passphrasePrompt, props.publishToStorage, props.mainnetPrompt, isOverSizePrompt, args, deployMode)
-      }, 'Cancel', () => { })
+      }, intl.formatMessage({ id: 'udapp.cancel' }), () => { })
     } else {
       props.createInstance(loadedContractData, props.gasEstimationPrompt, props.passphrasePrompt, props.publishToStorage, props.mainnetPrompt, isOverSizePrompt, args, deployMode)
     }
@@ -237,17 +237,15 @@ export function ContractDropdownUI (props: ContractDropdownProps) {
   const checkSumWarning = () => {
     return (
       <span className="text-start">
-        It seems you are not using a checksumed address.
+        <FormattedMessage id='udapp.checkSumWarning' values={{ br: <br />, a: <a href="https://eips.ethereum.org/EIPS/eip-55" target="_blank" rel="noreferrer">EIP-55</a> }} />
-        <br />A checksummed address is an address that contains uppercase letters, as specified in <a href="https://eips.ethereum.org/EIPS/eip-55" target="_blank" rel="noreferrer">EIP-55</a>.
-        <br />Checksummed addresses are meant to help prevent users from sending transactions to the wrong address.
       </span>
     )
   }
 
   const isOverSizePrompt = () => {
     return (
-      <div>Contract creation initialization returns data with length of more than 24576 bytes. The deployment will likely fails. <br />
+      <div>
-        More info: <a href="https://github.com/ethereum/EIPs/blob/master/EIPS/eip-170.md" target="_blank" rel="noreferrer">eip-170</a>
+        <FormattedMessage id='udapp.isOverSizePrompt' values={{ br: <br />, a: <a href="https://github.com/ethereum/EIPs/blob/master/EIPS/eip-170.md" target="_blank" rel="noreferrer">eip-170</a> }} />
       </div>
     )
   }
@@ -259,7 +257,7 @@ export function ContractDropdownUI (props: ContractDropdownProps) {
           <label className="udapp_settingsLabel pr-1">
             <FormattedMessage id='udapp.contract' />
           </label>
-          <div className="d-flex">{compilerName && compilerName !== '' && <label style={{ maxHeight: '0.6rem', lineHeight: '1rem' }} data-id="udappCompiledBy">(Compiled by <span className="text-capitalize"> {compilerName}</span>)</label>}</div>
+          <div className="d-flex">{compilerName && compilerName !== '' && <label style={{ maxHeight: '0.6rem', lineHeight: '1rem' }} data-id="udappCompiledBy">(<FormattedMessage id='udapp.compiledBy' values={{ compilerName: <span className="text-capitalize"> {compilerName}</span> }} />)</label>}</div>
         </div>
         {props.remixdActivated ?
           (<CustomTooltip
@@ -267,8 +265,7 @@ export function ContractDropdownUI (props: ContractDropdownProps) {
             tooltipClasses="text-wrap text-left"
             tooltipId="info-sync-compiled-contract"
             tooltipText={<span className="text-left">
-              Click here to import contracts compiled from an external framework.<br/>
+              <FormattedMessage id='udapp.infoSyncCompiledContractTooltip' values={{ br: <br /> }} />
-              This action is enabled when Remix is connected to an external<br/> framework (hardhat, truffle, foundry) through remixd.
             </span>}
           >
             <button className="btn d-flex py-0" onClick={_ => {
@@ -330,7 +327,7 @@ export function ContractDropdownUI (props: ContractDropdownProps) {
                   placement={'right'}
                   tooltipClasses="text-wrap text-left"
                   tooltipId="remixIpfsUdappTooltip"
-                  tooltipText={<span className="text-start">Publishing the source code and metadata to IPFS facilitates<br/> source code verification using Sourcify and will greatly foster<br/> contract adoption (auditing, debugging, calling it, etc...)</span>}
+                  tooltipText={<span className="text-start"><FormattedMessage id='udapp.remixIpfsUdappTooltip' values={{ br: <br /> }} /></span>}
                 >
                   <label
                     htmlFor="deployAndRunPublishToIPFS"
@@ -364,7 +361,7 @@ export function ContractDropdownUI (props: ContractDropdownProps) {
             placement={'top-end'}
             tooltipClasses="text-wrap text-left"
             tooltipId="runAndDeployAddressInputtooltip"
-            tooltipText={"Address of contract"}
+            tooltipText={<FormattedMessage id='udapp.addressOfContract' />}
           >
             <input
               ref={atAddressValue}