Merge remote-tracking branch 'origin/main'

lang/en.json

@@ -5,7 +5,9 @@
     "launch_button": "Launch",
     "gc_enable": "Connect via Grasscutter",
     "ip_placeholder": "Server Address...",
-    "port_placeholder": "Port..."
+    "port_placeholder": "Port...",
+    "files_downloading": "Files Downloading: ",
+    "files_extracting": "Files Extracting: "
   },
   "options": {
     "game_exec": "Set Game Executable",
@@ -17,6 +19,13 @@
     "grasscutter_latest": "Download Grasscutter Latest",
     "resources": "Download Grasscutter Resources"
   },
+  "download_status": {
+    "downloading": "Downloading",
+    "extracting": "Extracting",
+    "error": "Error",
+    "finished": "Finished",
+    "stopped": "Stopped"
+  },
   "components": {
     "select_file": "Select file or folder...",
     "download": "Download"

src/ui/components/common/MainProgressBar.tsx

@@ -1,5 +1,6 @@
 import React from 'react'
 import DownloadHandler from '../../../utils/download'
+import Tr from '../../../utils/language'
 import './ProgressBar.css'
 
 interface IProps {
@@ -67,9 +68,9 @@ export default class ProgressBar extends React.Component<IProps, IState> {
         </div>
 
         <div className="MainProgressText">
-          Files Downloading: {this.state.files} ({this.state.speed})
+          <Tr text="main.files_downloading" /> {this.state.files} ({this.state.speed})
           <br />
-          Files Extracting: {this.state.extracting}
+          <Tr text="main.files_extracting" /> {this.state.extracting}
         </div>
       </div>
     )

src/ui/components/common/ProgressBar.tsx

@@ -4,6 +4,7 @@ import { capitalize } from '../../../utils/string'
 import Stop from '../../../resources/icons/close.svg' 
 import './ProgressBar.css'
 import DownloadHandler from '../../../utils/download'
+import { translate } from '../../../utils/language'
 
 interface IProps {
   path: string,
@@ -31,11 +32,11 @@ export default class ProgressBar extends React.Component<IProps, IState> {
 
   componentDidMount() {
     // Periodically check the progress of passed file path
-    const intv = setInterval(() => {
+    const intv = setInterval(async () => {
       const prog = this.props.downloadManager.getDownloadProgress(this.props.path)
       this.setState({
         progress: prog?.progress || 0,
-        status: prog?.status || 'stopped',
+        status: await translate(`download_status.${prog?.status || 'stopped'}`) || 'stopped',
         total: prog?.total || 0,
       })