add locale messages for solUmlGen

apps/remix-ide/src/app/tabs/locales/en/index.js

@@ -10,6 +10,7 @@ import terminalJson from './terminal.json';
 import udappJson from './udapp.json';
 import solidityUnitTestingJson from './solidityUnitTesting.json';
 import permissionHandlerJson from './permissionHandler.json';
+import solUmlGenJson from './solUmlGen.json'
 import remixAppJson from './remixApp.json'
 
 export default {
@@ -25,5 +26,6 @@ export default {
   ...udappJson,
   ...solidityUnitTestingJson,
   ...permissionHandlerJson,
+  ...solUmlGenJson,
   ...remixAppJson,
 }

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

@@ -1,4 +1,10 @@
 {
-  "solUml.pngDownload": "Download as PNG",
-  "solUml.pdfDownload": "Download as PDF"
-}
+  "solUmlGen.pngDownload": "Download as PNG",
+  "solUmlGen.pdfDownload": "Download as PDF",
+  "solUmlGen.pngDownloadTooltip": "Download UML diagram as a PNG file",
+  "solUmlGen.pdfDownloadTooltip": "Download UML diagram as a PDF file",
+  "solUmlGen.text1": "To view your contract as a UML Diagram",
+  "solUmlGen.text2": "Right click on your contract file",
+  "solUmlGen.clickOn": "Click on",
+  "solUmlGen.generateUML": "Generate UML"
+}

apps/remix-ide/src/app/tabs/locales/es/solUmlgen.json

@@ -1,4 +1,10 @@
 {
-  "solUml.pngDownload": "Download as PNG",
-  "solUml.pdfDownload": "Download as PDF"
-}
+  "solUmlGen.pngDownload": "Download as PNG",
+  "solUmlGen.pdfDownload": "Download as PDF",
+  "solUmlGen.pngDownloadTooltip": "Download UML diagram as a PNG file",
+  "solUmlGen.pdfDownloadTooltip": "Download UML diagram as a PDF file",
+  "solUmlGen.text1": "To view your contract as a UML Diagram",
+  "solUmlGen.text2": "Right click on your contract file",
+  "solUmlGen.clickOn": "Click on",
+  "solUmlGen.generateUML": "Generate UML"
+}

apps/remix-ide/src/app/tabs/locales/fr/solUmlgen.json

@@ -1,4 +1,10 @@
 {
-  "solUml.pngDownload": "Download as PNG",
-  "solUml.pdfDownload": "Download as PDF"
-}
+  "solUmlGen.pngDownload": "Download as PNG",
+  "solUmlGen.pdfDownload": "Download as PDF",
+  "solUmlGen.pngDownloadTooltip": "Download UML diagram as a PNG file",
+  "solUmlGen.pdfDownloadTooltip": "Download UML diagram as a PDF file",
+  "solUmlGen.text1": "To view your contract as a UML Diagram",
+  "solUmlGen.text2": "Right click on your contract file",
+  "solUmlGen.clickOn": "Click on",
+  "solUmlGen.generateUML": "Generate UML"
+}

apps/remix-ide/src/app/tabs/locales/zh/index.js

@@ -10,6 +10,7 @@ import terminalJson from './terminal.json';
 import udappJson from './udapp.json';
 import solidityUnitTestingJson from './solidityUnitTesting.json';
 import permissionHandlerJson from './permissionHandler.json';
+import solUmlGenJson from './solUmlGen.json'
 import remixAppJson from './remixApp.json'
 import enJson from '../en';
 
@@ -28,5 +29,6 @@ export default Object.assign({}, enJson, {
   ...udappJson,
   ...solidityUnitTestingJson,
   ...permissionHandlerJson,
+  ...solUmlGenJson,
   ...remixAppJson,
 })

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

@@ -1,4 +1,10 @@
 {
-  "solUml.pngDownload": "Download as PNG",
-  "solUml.pdfDownload": "Download as PDF"
-}
+  "solUmlGen.pngDownload": "下载 PNG",
+  "solUmlGen.pdfDownload": "下载 PDF",
+  "solUmlGen.pngDownloadTooltip": "将 UML 图下载为 PNG 文件",
+  "solUmlGen.pdfDownloadTooltip": "将 UML 图下载为 PDF 文件",
+  "solUmlGen.text1": "以 UML 图查看您的合约",
+  "solUmlGen.text2": "右键单击您的合约文件",
+  "solUmlGen.clickOn": "点击",
+  "solUmlGen.generateUML": "生成 UML"
+}

libs/remix-ui/solidity-uml-gen/src/lib/components/UmlDownload.tsx

@@ -1,5 +1,6 @@
 import {CustomTooltip} from '@remix-ui/helper'
 import React, {Fragment, Ref} from 'react'
+import {FormattedMessage} from 'react-intl'
 import {Dropdown} from 'react-bootstrap'
 import {UmlFileType} from '../utilities/UmlDownloadStrategy'
 
@@ -76,25 +77,39 @@ export default function UmlDownload(props: UmlDownloadProps) {
             }}
             data-id="umlPngDownload"
           >
-            <CustomTooltip placement="left-start" tooltipId="solUmlgenDownloadAsPngTooltip" tooltipClasses="text-nowrap" tooltipText={'Download UML diagram as a PNG file'}>
+            <CustomTooltip
+              placement="left-start"
+              tooltipId="solUmlgenDownloadAsPngTooltip"
+              tooltipClasses="text-nowrap"
+              tooltipText={<FormattedMessage id="solUmlGen.pngDownloadTooltip" />}
+            >
               <div data-id="umlPngDownload">
                 <span id="umlPngDownloadBtn" data-id="umlPngDownload" className="far fa-image pl-2"></span>
-                <span className="pl-1">Download as PNG</span>
+                <span className="pl-1">
+                  <FormattedMessage id="solUmlGen.pngDownload" />
+                </span>
               </div>
             </CustomTooltip>
           </Dropdown.Item>
           <Dropdown.Divider />
           <Dropdown.Item
             onClick={() => {
-              _paq.push(['trackEvent', 'solUmlgen', 'umlpdfdownload', 'downloadAsPdf'])
+              _paq.push(['trackEvent', 'solUmlGen', 'umlpdfdownload', 'downloadAsPdf'])
               props.download('pdf')
             }}
             data-id="umlPdfDownload"
           >
-            <CustomTooltip placement="left-start" tooltipId="solUmlgenDownloadAsPdfTooltip" tooltipClasses="text-nowrap" tooltipText={'Download UML diagram as a PDF file'}>
+            <CustomTooltip
+              placement="left-start"
+              tooltipId="solUmlgenDownloadAsPdfTooltip"
+              tooltipClasses="text-nowrap"
+              tooltipText={<FormattedMessage id="solUmlGen.pdfDownloadTooltip" />}
+            >
               <div data-id="umlPdfDownload">
                 <span id="umlPdfDownloadBtn" data-id="umlPdfDownload" className="far fa-file-pdf pl-2"></span>
-                <span className="pl-2">Download as PDF</span>
+                <span className="pl-2">
+                  <FormattedMessage id="solUmlGen.pdfDownload" />
+                </span>
               </div>
             </CustomTooltip>
           </Dropdown.Item>

libs/remix-ui/solidity-uml-gen/src/lib/solidity-uml-gen.tsx

@@ -1,4 +1,5 @@
 import React, {Fragment, useCallback, useEffect, useState} from 'react'
+import {FormattedMessage} from 'react-intl'
 import {TransformComponent, TransformWrapper} from 'react-zoom-pan-pinch'
 import {GlassMagnifier, MagnifierContainer} from 'react-image-magnifiers'
 import {ThemeSummary} from '../types'
@@ -75,18 +76,25 @@ export function RemixUiSolidityUmlGen({updatedSvg, loading, fileName, themeDark}
   const DefaultInfo = () => (
     <div className="d-flex flex-column justify-content-center align-items-center mt-5 ml-5">
       <h3 className="h3 align-self-start text-dark">
-        <p>To view your contract as a UML Diagram</p>
+        <p>
+          <FormattedMessage id="solUmlGen.text1" />
+        </p>
       </h3>
       <ul className="ml-3 justify-content-start align-self-start">
         <li>
           <h5 className="h5 align-self-start text-dark">
-            <p>Right click on your contract file</p>
+            <p>
+              <FormattedMessage id="solUmlGen.text2" />
+            </p>
           </h5>
         </li>
         <li>
           <h5 className="h5 align-self-start text-dark">
             <p>
-              Click on <b>Generate UML</b>
+              <FormattedMessage id="solUmlGen.clickOn" />{' '}
+              <b>
+                <FormattedMessage id="solUmlGen.generateUML" />
+              </b>
             </p>
           </h5>
         </li>