root/gpustack-ui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: image stream data error

Browse Source
This commit is contained in:
jialin
2025-01-16 21:51:22 +08:00
parent b14c01f9f7
commit 214c5998c6
7 changed files with 44 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/auto-image/index.tsx
-3
View File
@@ -71,9 +71,6 @@ const AutoImage: React.FC<
}, [props.onLoad]);
const handleOnError = () => {
console.log('error===img=========', {
src: props.src
});
setIsError(true);
};
src/components/auto-image/single-image.tsx
+8 -5
View File
@@ -1,6 +1,7 @@
import { CloseCircleOutlined } from '@ant-design/icons';
import { Progress, ProgressProps } from 'antd';
import classNames from 'classnames';
import { round } from 'lodash';
import ResizeObserver from 'rc-resize-observer';
import React, { useCallback } from 'react';
import AutoImage from './index';
@@ -40,7 +41,7 @@ const SingleImage: React.FC<SingleImageProps> = (props) => {
progress,
maxHeight,
maxWidth,
dataUrl,
dataUrl = '',
style,
autoBgColor,
preview = true,
@@ -134,12 +135,12 @@ const SingleImage: React.FC<SingleImageProps> = (props) => {
}}
>
<Progress
percent={progress}
percent={round(progress, 0)}
type="dashboard"
size={loadingSize}
steps={{ count: 50, gap: 2 }}
format={() => (
<span className="font-size-20">{progress}%</span>
<span className="font-size-20">{round(progress, 0)}%</span>
)}
trailColor="var(--ant-color-fill-secondary)"
/>
@@ -164,12 +165,14 @@ const SingleImage: React.FC<SingleImageProps> = (props) => {
{progress && progress < 100 && (
<span className="small-progress-wrap">
<Progress
percent={progress}
percent={round(progress, 0)}
type="dashboard"
size="small"
steps={{ count: 25, gap: 3 }}
format={() => (
<span className="font-size-12">{progress}%</span>
<span className="font-size-12">
{round(progress, 0)}%
</span>
)}
strokeColor="var(--color-white-secondary)"
trailColor="var(--ant-color-fill-secondary)"
src/components/image-editor/index.tsx
+1 -1
View File
@@ -44,7 +44,7 @@ const CanvasImageEditor: React.FC<CanvasImageEditorProps> = ({
const canvasRef = useRef<HTMLCanvasElement>(null);
const overlayCanvasRef = useRef<HTMLCanvasElement>(null);
const containerRef = useRef<HTMLDivElement>(null);
const [lineWidth, setLineWidth] = useState<number>(30);
const [lineWidth, setLineWidth] = useState<number>(60);
const isDrawing = useRef<boolean>(false);
const currentStroke = useRef<Point[]>([]);
const resizeObserver = useRef<ResizeObserver | null>(null);
src/pages/dashboard/components/active-table.tsx
+12 -1
View File
@@ -1,11 +1,18 @@
import AutoTooltip from '@/components/auto-tooltip';
import PageTools from '@/components/page-tools';
import { modelCategoriesMap } from '@/pages/llmodels/config';
import { convertFileSize } from '@/utils';
import { useIntl } from '@umijs/max';
import { Col, Row, Table } from 'antd';
import { memo, useContext } from 'react';
import { DashboardContext } from '../config/dashboard-context';
const NACategories = [
modelCategoriesMap.llm,
modelCategoriesMap.embedding,
modelCategoriesMap.reranker
];
const ActiveTable = () => {
const intl = useIntl();
const data = useContext(DashboardContext).active_models || [];
@@ -48,9 +55,13 @@ const ActiveTable = () => {
key: 'token_count',
ellipsis: true,
render: (text: any, record: any) => {
let val = text;
if (!text) {
val = NACategories.includes(record.category?.[0]) ? 'N/A' : 0;
}
return (
<AutoTooltip ghost>
<span>{text || 'N/A'}</span>
<span>{val}</span>
</AutoTooltip>
);
}
src/pages/playground/components/ground-images.tsx
+10 -4
View File
@@ -60,6 +60,8 @@ const METAKEYS = [
'negative_prompt'
];
const ODD_STRING = 'AAAABJRU5ErkJgg===';
const advancedFieldsDefaultValus = {
seed: null,
sample_method: 'euler_a',
@@ -135,6 +137,10 @@ const GroundImages: React.FC<MessageProps> = forwardRef((props, ref) => {
};
});
const removeBase64Suffix = (str: string, suffix: string) => {
return str.endsWith(suffix) ? str.slice(0, -suffix.length) : str;
};
const getNewImageSizeOptions = useCallback((metaData: any) => {
const { max_height, max_width } = metaData || {};
if (!max_height || !max_width) {
@@ -350,12 +356,12 @@ const GroundImages: React.FC<MessageProps> = forwardRef((props, ref) => {
chunk?.data?.forEach((item: any) => {
const imgItem = newImageList[item.index];
if (item.b64_json && stream_options.chunk_results) {
imgItem.dataUrl += item.b64_json;
imgItem.dataUrl += removeBase64Suffix(item.b64_json, ODD_STRING);
} else if (item.b64_json) {
console.log('item.b64_json:', item.b64_json, item.index);
imgItem.dataUrl = `data:image/png;base64,${item.b64_json}`;
imgItem.dataUrl = `data:image/png;base64,${removeBase64Suffix(item.b64_json, ODD_STRING)}`;
}
const progress = _.round(item.progress, 0);
const progress = item.progress;
newImageList[item.index] = {
dataUrl: imgItem.dataUrl,
height: imgSize[1],
src/pages/playground/components/image-edit.tsx
+11 -4
View File
@@ -62,6 +62,8 @@ const METAKEYS = [
'strength'
];
const ODD_STRING = 'AAAABJRU5ErkJgg===';
const advancedFieldsDefaultValus = {
seed: null,
sample_method: 'euler_a',
@@ -150,6 +152,10 @@ const GroundImages: React.FC<MessageProps> = forwardRef((props, ref) => {
};
});
const removeBase64Suffix = (str: string, suffix: string) => {
return str.endsWith(suffix) ? str.slice(0, -suffix.length) : str;
};
const updateCacheFormData = (values: Record<string, any>) => {
cacheFormData.current = {
...cacheFormData.current,
@@ -383,11 +389,11 @@ const GroundImages: React.FC<MessageProps> = forwardRef((props, ref) => {
chunk?.data?.forEach((item: any) => {
const imgItem = newImageList[item.index];
if (item.b64_json && params.stream_options_chunk_result) {
imgItem.dataUrl += item.b64_json;
imgItem.dataUrl += removeBase64Suffix(item.b64_json, ODD_STRING);
} else if (item.b64_json) {
imgItem.dataUrl = `data:image/png;base64,${item.b64_json}`;
imgItem.dataUrl = `data:image/png;base64,${removeBase64Suffix(item.b64_json, ODD_STRING)}`;
}
const progress = _.round(item.progress, 0);
const progress = item.progress;
newImageList[item.index] = {
dataUrl: imgItem.dataUrl,
@@ -832,7 +838,8 @@ const GroundImages: React.FC<MessageProps> = forwardRef((props, ref) => {
style={{
height: 125,
maxWidth: 125,
maxHeight: 125
maxHeight: 125,
overflow: 'hidden'
}}
key={item.uid}
>
src/utils/fetch-chunk-data.ts
+2 -2
View File
@@ -210,7 +210,6 @@ const processBuffer = async (buffer: string, callback: (data: any) => void) => {
const jsonStr = trimmedLine.slice(6).trim();
try {
if (jsonStr !== '[DONE]') {
console.log('jsonStr>>>>>>>>>>>>>done:', jsonStr);
const jsonData = JSON.parse(jsonStr);
callback(jsonData);
}
@@ -219,7 +218,6 @@ const processBuffer = async (buffer: string, callback: (data: any) => void) => {
}
} else if (trimmedLine.startsWith('error:')) {
const errorStr = trimmedLine.slice(7).trim();
console.log('jsonStr>>>>>>>>>>>>>error:', errorStr);
try {
const jsonData = JSON.parse(errorStr);
callback({ error: jsonData });
@@ -308,6 +306,8 @@ export const readLargeStreamData = async (
const lines = buffer.split('\n');
buffer = lines.pop() || ''; // Keep last line (may be incomplete)
console.log('buffer>>>>>>>>>>>>>:', buffer);
for (const line of lines) {
bufferManager.add(line);
}