From 687dabc77714e0566ae3148b41b2b11269f4d899 Mon Sep 17 00:00:00 2001
From: jialin <jialinkuang@126.com>
Date: Tue, 3 Dec 2024 16:06:33 +0800
Subject: [PATCH] fix: audio set progress error

---
 src/components/alert-info/index.tsx           | 51 ++++++++++---------
 src/components/list-input/index.tsx           |  6 +--
 src/components/logs-viewer/parse-ansi.ts      |  5 --
 src/components/logs-viewer/parse-worker.ts    |  5 --
 src/locales/en-US/models.ts                   |  6 ++-
 src/locales/zh-CN/models.ts                   |  6 ++-
 src/pages/llmodels/components/gpu-card.tsx    | 11 ++--
 .../playground/components/ground-stt.tsx      |  6 +--
 .../playground/components/ground-tts.tsx      | 11 ++--
 9 files changed, 52 insertions(+), 55 deletions(-)

diff --git a/src/components/alert-info/index.tsx b/src/components/alert-info/index.tsx
index c8d23f1f..6c2bb29d 100644
--- a/src/components/alert-info/index.tsx
+++ b/src/components/alert-info/index.tsx
@@ -13,33 +13,34 @@ interface AlertInfoProps {
 
 const AlertInfo: React.FC<AlertInfoProps> = (props) => {
   const { message, type, rows = 1, ellipsis, style } = props;
-  if (!message) {
-    return null;
-  }
 
   return (
-    <Typography.Paragraph
-      type={type}
-      ellipsis={
-        ellipsis !== undefined
-          ? ellipsis
-          : {
-              rows: rows,
-              tooltip: message
-            }
-      }
-      style={{
-        textAlign: 'center',
-        padding: '2px 5px',
-        borderRadius: 'var(--border-radius-base)',
-        margin: 0,
-        backgroundColor: 'var(--ant-color-error-bg)',
-        ...style
-      }}
-    >
-      <WarningOutlined className="m-r-8" />
-      {message}
-    </Typography.Paragraph>
+    <>
+      {message ? (
+        <Typography.Paragraph
+          type={type}
+          ellipsis={
+            ellipsis !== undefined
+              ? ellipsis
+              : {
+                  rows: rows,
+                  tooltip: message
+                }
+          }
+          style={{
+            textAlign: 'center',
+            padding: '2px 5px',
+            borderRadius: 'var(--border-radius-base)',
+            margin: 0,
+            backgroundColor: 'var(--ant-color-error-bg)',
+            ...style
+          }}
+        >
+          <WarningOutlined className="m-r-8" />
+          {message}
+        </Typography.Paragraph>
+      ) : null}
+    </>
   );
 };
 
diff --git a/src/components/list-input/index.tsx b/src/components/list-input/index.tsx
index 428f01aa..a6964448 100644
--- a/src/components/list-input/index.tsx
+++ b/src/components/list-input/index.tsx
@@ -88,11 +88,11 @@ const ListInput: React.FC<ListInputProps> = (props) => {
         <div className="flex justify-center">
           <Button
             ref={buttonRef}
-            type="text"
+            variant="filled"
+            color="default"
             block
             style={{
-              marginTop: 16,
-              backgroundColor: 'var(--ant-color-fill-secondary)'
+              marginTop: 16
             }}
             onClick={handleOnAdd}
           >
diff --git a/src/components/logs-viewer/parse-ansi.ts b/src/components/logs-viewer/parse-ansi.ts
index 320a7505..255c6fbe 100644
--- a/src/components/logs-viewer/parse-ansi.ts
+++ b/src/components/logs-viewer/parse-ansi.ts
@@ -67,11 +67,6 @@ const useParseAnsi = () => {
       const n = parseInt(match[1], 10) || 1;
       const m = parseInt(match[2], 10) || 1;
       const command = match[3];
-      console.log('command', {
-        command,
-        cursorRow,
-        n
-      });
 
       // handle ANSI control characters
       switch (command) {
diff --git a/src/components/logs-viewer/parse-worker.ts b/src/components/logs-viewer/parse-worker.ts
index be5ce0b7..eb955122 100644
--- a/src/components/logs-viewer/parse-worker.ts
+++ b/src/components/logs-viewer/parse-worker.ts
@@ -73,11 +73,6 @@ const parseAnsi = (input: string, setId: () => number) => {
     const n = parseInt(match[1], 10) || 1;
     const m = parseInt(match[2], 10) || 1;
     const command = match[3];
-    console.log('command', {
-      command,
-      cursorRow,
-      n
-    });
 
     // handle ANSI control characters
     switch (command) {
diff --git a/src/locales/en-US/models.ts b/src/locales/en-US/models.ts
index 5b9b9dfb..1b251158 100644
--- a/src/locales/en-US/models.ts
+++ b/src/locales/en-US/models.ts
@@ -58,8 +58,10 @@ export default {
   'models.table.layers': 'Layers',
   'models.form.backend': 'Backend',
   'models.form.backend_parameters': 'Backend Parameters',
-  'models.search.gguf.tips': '1. GGUF model backend is llama-box.',
-  'models.search.vllm.tips': '2. Non-GGUF model backend is vLLM.',
+  'models.search.gguf.tips':
+    '1. GGUF models backend is llama-box(supports Linux, macOS and Windows).',
+  'models.search.vllm.tips':
+    '2. Non-GGUF models use vox-box for audio and vLLM for others.',
   'models.form.ollamalink': 'Find More in Ollama Library',
   'models.form.backend_parameters.llamabox.placeholder':
     'e.g., --ctx-size=8192',
diff --git a/src/locales/zh-CN/models.ts b/src/locales/zh-CN/models.ts
index 1a4c5299..7fe2bf10 100644
--- a/src/locales/zh-CN/models.ts
+++ b/src/locales/zh-CN/models.ts
@@ -57,8 +57,10 @@ export default {
   'models.table.layers': '层',
   'models.form.backend': '后端',
   'models.form.backend_parameters': '后端参数',
-  'models.search.gguf.tips': '1. GGUF 模型后端为 llama-box',
-  'models.search.vllm.tips': '2. 非 GGUF 模型后端为 vLLM',
+  'models.search.gguf.tips':
+    '1. GGUF 模型后端为 llama-box(支持 Linux, macOS 和 Windows)。',
+  'models.search.vllm.tips':
+    '2. 非 GGUF 的音频模型用 vox-box，其它非 GGUF 的模型用 vLLM。',
   'models.form.ollamalink': '在 Ollama Library 中查找',
   'models.form.backend_parameters.llamabox.placeholder':
     '例如，--ctx-size=8192',
diff --git a/src/pages/llmodels/components/gpu-card.tsx b/src/pages/llmodels/components/gpu-card.tsx
index 8f74e712..dd4b51e1 100644
--- a/src/pages/llmodels/components/gpu-card.tsx
+++ b/src/pages/llmodels/components/gpu-card.tsx
@@ -29,15 +29,20 @@ const GPUCard: React.FC<{
               {intl.formatMessage({ id: 'resources.table.used' })}/
               {intl.formatMessage({ id: 'resources.table.total' })}):{' '}
               <span>
-                {convertFileSize(data?.memory?.used || 0)} /{' '}
-                {convertFileSize(data?.memory?.total || 0)}
+                {convertFileSize(
+                  data?.memory?.used || data?.memory?.allocated || 0
+                )}{' '}
+                / {convertFileSize(data?.memory?.total || 0)}
               </span>
             </span>
             <span>
               <span>
                 {intl.formatMessage({ id: 'resources.table.gpuutilization' })}:{' '}
               </span>
-              {_.round(data?.memory?.utilization_rate || 0, 2)}%
+              {data?.memory?.used
+                ? _.round(data?.memory?.utilization_rate || 0, 2)
+                : _.round(data.memory?.allocated / data.memory?.total, 2)}
+              %
             </span>
           </>
         )}
diff --git a/src/pages/playground/components/ground-stt.tsx b/src/pages/playground/components/ground-stt.tsx
index aacf1b0f..84152381 100644
--- a/src/pages/playground/components/ground-stt.tsx
+++ b/src/pages/playground/components/ground-stt.tsx
@@ -120,7 +120,7 @@ const GroundLeft: React.FC<MessageProps> = forwardRef((props, ref) => {
         }
       );
 
-      if (result?.error) {
+      if (result?.status_code !== 200) {
         setTokenResult({
           error: true,
           errorMessage:
@@ -380,7 +380,7 @@ const GroundLeft: React.FC<MessageProps> = forwardRef((props, ref) => {
               style={{ height: '100%', overflow: 'auto' }}
               ref={scroller}
             >
-              <>
+              <div>
                 {!tokenResult && (
                   <div
                     style={{
@@ -409,7 +409,7 @@ const GroundLeft: React.FC<MessageProps> = forwardRef((props, ref) => {
                     ></AlertInfo>
                   </div>
                 )}
-              </>
+              </div>
             </div>
             {loading && (
               <div style={{ width: '100%', flex: 1 }}>
diff --git a/src/pages/playground/components/ground-tts.tsx b/src/pages/playground/components/ground-tts.tsx
index 94cb20be..72a602f2 100644
--- a/src/pages/playground/components/ground-tts.tsx
+++ b/src/pages/playground/components/ground-tts.tsx
@@ -157,7 +157,7 @@ const GroundLeft: React.FC<MessageProps> = forwardRef((props, ref) => {
 
       console.log('result:', res);
 
-      if (res?.error) {
+      if (res?.status_code !== 200) {
         setTokenResult({
           error: true,
           errorMessage:
@@ -212,14 +212,11 @@ const GroundLeft: React.FC<MessageProps> = forwardRef((props, ref) => {
         const res = await queryModelVoices({
           model: value
         });
-        if (res?.error) {
+        if (res?.status_code !== 200) {
           setVoiceError({
             error: true,
             errorMessage:
-              res?.data?.error?.message ||
-              res?.data?.error ||
-              res.error?.detail ||
-              ''
+              res?.data?.error?.message || res?.data?.error || res?.detail || ''
           });
           setVoiceList([]);
           return;
@@ -248,7 +245,7 @@ const GroundLeft: React.FC<MessageProps> = forwardRef((props, ref) => {
           setVoiceError({
             error: true,
             errorMessage:
-              res?.error?.message || res?.data?.error || res.error?.detail || ''
+              res?.error?.message || res?.data?.error || res?.detail || ''
           });
         }
         setVoiceList([]);