patch i18n for remixApp and home

Author: drafish

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

@@ -1,4 +1,5 @@
 {
+  "home.home": "Home",
   "home.scamAlert": "Scam Alert",
   "home.scamAlertText": "The only URL Remix uses is remix.ethereum.org",
   "home.scamAlertText2": "Beware of online videos promoting \"liquidity front runner bots\"",

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

@@ -1,5 +1,11 @@
 {
   "remixApp.scrollToSeeAllTabs": "Scroll to see all tabs",
   "remixApp.alert": "Alert",
-  "remixApp.ok": "OK"
+  "remixApp.ok": "OK",
+  "remixApp.enterText1": "Welcome to Remix IDE",
+  "remixApp.enterText2": "In order to understand your needs better, we would like to know how you typically use Remix",
+  "remixApp.enterText3": "Learning - discovering web3 development",
+  "remixApp.enterText4": "Prototyping - trying out concepts and techniques",
+  "remixApp.enterText5": "Developing  projects - Remix as your main dev tool",
+  "remixApp.enterText6": "Production - only deployments"
 }

libs/remix-ui/app/src/lib/remix-app/components/modals/enter.tsx

@@ -1,4 +1,5 @@
 import React, {useContext, useEffect, useState} from 'react'
+import {FormattedMessage} from 'react-intl'
 import {AppContext} from '../../context/context'
 import {UsageTypes} from '../../types'
 import { type } from 'os'
@@ -30,19 +31,19 @@ const EnterDialog = (props: EnterDialogProps) => {
           }}
         >
           <div className="modal-header d-flex flex-column">
-            <h3 className='text-dark'>Welcome to Remix IDE</h3>
+            <h3 className='text-dark'><FormattedMessage id="remixApp.enterText1" /></h3>
             <div className='d-flex flex-row pt-2'>
               <h6 className="modal-title text-dark" data-id={`EnterModalDialogModalTitle-react`}>
-                In order to understand your needs better, we would like to know how you typically use Remix
+                <FormattedMessage id="remixApp.enterText2" />
               </h6>
               <i className="text-dark fal fa-door-open text-center" style={{minWidth: "100px", fontSize: "xxx-large"}}></i>
             </div>
           </div>
           <div className="modal-body text-break remixModalBody d-flex flex-column p-3 justify-content-between" data-id={`EnterModalDialogModalBody-react`}>
-            <button className="btn btn-secondary text-left" data-id="beginnerbtn" style={{minWidth: "100px"}} onClick={() => {enterAs(UsageTypes.Beginner)}}>Learning - discovering web3 development</button>
-            <button className="btn btn-secondary my-1 text-left" data-id="prototyperbtn" style={{minWidth: "100px"}} onClick={() => {enterAs(UsageTypes.Prototyper)}}>Prototyping - trying out concepts and techniques</button>
-            <button className="btn btn-secondary text-left" data-id="advanceUserbtn" style={{minWidth: "100px"}} onClick={() => {enterAs(UsageTypes.Advance)}}>Developing  projects - Remix as your main dev tool</button>
-            <button className="btn btn-secondary mt-1 text-left" data-id="productionbtn" style={{minWidth: "100px"}} onClick={() => {enterAs(UsageTypes.Production)}}>Production - only deployments</button>
+            <button className="btn btn-secondary text-left" data-id="beginnerbtn" style={{minWidth: "100px"}} onClick={() => {enterAs(UsageTypes.Beginner)}}><FormattedMessage id="remixApp.enterText3" /></button>
+            <button className="btn btn-secondary my-1 text-left" data-id="prototyperbtn" style={{minWidth: "100px"}} onClick={() => {enterAs(UsageTypes.Prototyper)}}><FormattedMessage id="remixApp.enterText4" /></button>
+            <button className="btn btn-secondary text-left" data-id="advanceUserbtn" style={{minWidth: "100px"}} onClick={() => {enterAs(UsageTypes.Advance)}}><FormattedMessage id="remixApp.enterText5" /></button>
+            <button className="btn btn-secondary mt-1 text-left" data-id="productionbtn" style={{minWidth: "100px"}} onClick={() => {enterAs(UsageTypes.Production)}}><FormattedMessage id="remixApp.enterText6" /></button>
           </div>
         </div>
       </div>

libs/remix-ui/vertical-icons-panel/src/lib/components/Home.tsx

@@ -1,13 +1,14 @@
 import {CustomTooltip} from '@remix-ui/helper'
 import React from 'react'
+import { FormattedMessage } from 'react-intl'
 import BasicLogo from './BasicLogo'
 interface HomeProps {
   verticalIconPlugin: any
 }
 
 function Home({verticalIconPlugin}: HomeProps) {
   return (
-    <CustomTooltip placement="right" tooltipText={'Home'}>
+    <CustomTooltip placement="right" tooltipText={<FormattedMessage id='home.home' />}>
       <div
         className="mt-2 my-1 remixui_homeIcon"
         onClick={async () => await verticalIconPlugin.activateHome()}