fix: downloading items display error

gpustack · Sep 11, 2024 · 7f2f3ea · 7f2f3ea
1 parent 3f92ea3
commit 7f2f3ea
Show file tree

Hide file tree

Showing 7 changed files with 243 additions and 30 deletions.
diff --git a/src/components/logs-viewer/index.tsx b/src/components/logs-viewer/index.tsx
@@ -33,44 +33,67 @@ const LogsViewer: React.FC<LogsViewerProps> = (props) => {
     updateScrollerPosition();
   }, [logsContent]);
 
+  const ansiEscapeRegex = /(\x1B\[[0-9;]*[A-Za-z])+$/;
+
   const endsWithAnsiEscapeSequence = useCallback((str: string) => {
-    const ansiEscapeRegex = /\x1B\[[0-9;]*[A-Za-z]$/;
     return ansiEscapeRegex.test(str);
   }, []);
   const getCursorUpLines = useCallback((str: string) => {
-    const match = str.match(/\x1B\[(\d*)A$/);
+    const matches = str.match(/(?:\x1B\[A)+$/);
+
+    return matches ? matches[0].length / 3 : 0;
+  }, []);
+
+  const removeDot = useCallback((str: string) => {
+    return str.replace(/^\(.*?\)/, '');
+  }, []);
+  const replaceAnsiEscapeSequence = useCallback((str: string) => {
+    const res = str.replace(ansiEscapeRegex, '');
+    return removeDot(res);
+  }, []);
 
-    if (match) {
-      return match[1] === '' ? 1 : parseInt(match[1], 10);
-    } else {
-      return null;
+  const handleRControl = useCallback((str: string) => {
+    if (str.includes('\r')) {
+      const parts = str.split('\r');
+      const lastLine = parts[parts.length - 1];
+      return lastLine;
     }
+    return str;
   }, []);
 
   const parseHtmlStr = useCallback((logStr: string) => {
     const result: string[] = [];
-    const lines = logStr?.split?.('\n');
-
+    const lines = logStr.split('\n').filter((line) => line.trim() !== '');
+    // const lines = text;
     lines.forEach((line: string, index: number) => {
       const upCount = getCursorUpLines(line);
+      console.log('line=========1', {
+        line,
+        upCount,
+        result
+      });
       if (endsWithAnsiEscapeSequence(line)) {
+        const newLine = handleRControl(line);
+        const val = removeDot(newLine);
+        if (result.length < upCount) {
+          result.push('');
+        }
         if (upCount) {
+          console.log('line=========0', {
+            line,
+            upCount,
+            result
+          });
           const placeIndex = result.length - upCount;
-          result[placeIndex] = line;
+          result[placeIndex] = replaceAnsiEscapeSequence(val);
         } else {
-          result.push(line);
+          result.push(val);
         }
       } else {
-        if (line.includes('\r')) {
-          const parts = line.split('\r');
-          const lastLine = parts[parts.length - 1];
-          result.push(lastLine);
-        } else {
-          result.push(line);
-        }
+        const val = handleRControl(line);
+        result.push(val);
       }
     });
-
     return result.map((item) => {
       return convert.toHtml(item);
     });

diff --git a/src/components/logs-viewer/text.ts b/src/components/logs-viewer/text.ts
diff --git a/src/locales/en-US/resources.ts b/src/locales/en-US/resources.ts
@@ -2,13 +2,14 @@ export default {
   'resources.title': 'Resources',
   'resources.nodes': 'Nodes',
   'resources.button.create': 'Add Worker',
+  'resources.button.edit': 'Edit Worker',
   'resources.button.edittags': 'Edit Labels',
   'resources.button.update': 'Update Labels',
   'resources.table.labels': 'Labels',
   'resources.table.hostname': 'Hostname',
   'resources.table.key.tips': 'The same key exists.',
   'resources.form.advanced': 'Advanced',
-  'resources.form.enablePartialOffload': 'Allow CPU Offload',
+  'resources.form.enablePartialOffload': 'Allow CPU Offloading',
   'resources.form.placementStrategy': 'Placement Strategy',
   'resources.form.workerSelector': 'Worker Selector',
   'resources.form.enableDistributedInferenceAcrossWorkers':

diff --git a/src/locales/zh-CN/resources.ts b/src/locales/zh-CN/resources.ts
@@ -1,6 +1,7 @@
 export default {
   'resources.title': '资源',
   'resources.button.create': '添加 Worker',
+  'resources.button.edit': '编辑 Worker',
   'resources.button.edittags': '编辑标签',
   'resources.button.update': '更新标签',
   'resources.nodes': '节点',

diff --git a/src/pages/llmodels/components/table-list.tsx b/src/pages/llmodels/components/table-list.tsx
@@ -130,7 +130,7 @@ const Models: React.FC<ModelsProps> = ({
       value: modelSourceMap.huggingface_value,
       key: 'huggingface',
       icon: <IconFont type="icon-huggingface"></IconFont>,
-      onClick: () => {
+      onClick: (e: any) => {
         setOpenDeployModal({
           show: true,
           width: 'calc(100vw - 220px)',
@@ -143,11 +143,13 @@ const Models: React.FC<ModelsProps> = ({
       value: modelSourceMap.ollama_library_value,
       key: 'ollama_library',
       icon: <IconFont type="icon-ollama"></IconFont>,
-      onClick: () => {
-        setOpenDeployModal({
-          show: true,
-          width: 600,
-          source: modelSourceMap.ollama_library_value
+      onClick: (e: any) => {
+        setOpenDeployModal(() => {
+          return {
+            show: true,
+            width: 600,
+            source: modelSourceMap.ollama_library_value
+          };
         });
       }
     }
@@ -242,7 +244,7 @@ const Models: React.FC<ModelsProps> = ({
 
   const handleCreateModel = useCallback(async (data: FormData) => {
     try {
-      console.log('data:', data);
+      console.log('data:', data, openDeployModal);
 
       await createModel({ data });
       setOpenDeployModal({

diff --git a/src/pages/resources/components/update-labels.tsx b/src/pages/resources/components/update-labels.tsx
@@ -37,7 +37,7 @@ const UpdateLabels: React.FC<ViewModalProps> = (props) => {
 
   return (
     <Modal
-      title={intl.formatMessage({ id: 'resources.button.edittags' })}
+      title={intl.formatMessage({ id: 'resources.button.edit' })}
       open={open}
       centered={true}
       onCancel={onCancel}

diff --git a/src/pages/resources/components/workers.tsx b/src/pages/resources/components/workers.tsx
@@ -10,10 +10,10 @@ import useTableSort from '@/hooks/use-table-sort';
 import { convertFileSize, handleBatchRequest } from '@/utils';
 import {
   DeleteOutlined,
+  EditOutlined,
   InfoCircleOutlined,
   PlusOutlined,
-  SyncOutlined,
-  TagsOutlined
+  SyncOutlined
 } from '@ant-design/icons';
 import { useIntl } from '@umijs/max';
 import { Button, Input, Space, Table, Tooltip, message } from 'antd';
@@ -31,7 +31,7 @@ const ActionList = [
   {
     label: 'common.button.edit',
     key: 'edit',
-    icon: <TagsOutlined />
+    icon: <EditOutlined />
   },
   {
     label: 'common.button.delete',