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

fix: jump to playground from model list

Browse Source
This commit is contained in:
jialin
2024-11-28 21:48:14 +08:00
parent bd418b23dc
commit 51ae3a16bd
16 changed files with 760 additions and 366 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/pages/playground/components/ground-embedding.tsx
+19 -13
View File
@@ -12,7 +12,7 @@ import {
SendOutlined
} from '@ant-design/icons';
import { useIntl, useSearchParams } from '@umijs/max';
import { Button, Segmented, Tabs, Tooltip } from 'antd';
import { Button, Checkbox, Segmented, Tabs, Tooltip } from 'antd';
import classNames from 'classnames';
import { PCA } from 'ml-pca';
import 'overlayscrollbars/overlayscrollbars.css';
@@ -81,7 +81,7 @@ const GroundEmbedding: React.FC<MessageProps> = forwardRef((props, ref) => {
copyValue: ''
});
const [lessTwoInput, setLessTwoInput] = useState<boolean>(false);
const [multiplePasteEnable, setMultiplePasteEnable] = useState<boolean>(true);
const multiplePasteEnable = useRef<boolean>(true);
const [textList, setTextList] = useState<
{ text: string; uid: number | string; name: string }[]
@@ -279,21 +279,30 @@ const GroundEmbedding: React.FC<MessageProps> = forwardRef((props, ref) => {
const handleOnPaste = useCallback(
(e: any, index: number) => {
if (!multiplePasteEnable) return;
if (!multiplePasteEnable.current) return;
const text = e.clipboardData.getData('text');
if (text) {
const currentContent = textList[index].text;
const dataLlist = text.split('\n').map((item: string) => {
return {
text: item?.trim(),
uid: inputListRef.current?.setMessageId(),
uid: setMessageId(),
name: ''
};
});
dataLlist[0].text = currentContent + dataLlist[0].text;
const result = [
...textList.slice(0, index),
...dataLlist,
...textList.slice(index + 1)
].filter((item) => item.text);
]
.filter((item) => item.text)
.map((item, index) => {
return {
...item,
uid: setMessageId()
};
});
setTextList(result);
}
},
@@ -407,19 +416,16 @@ const GroundEmbedding: React.FC<MessageProps> = forwardRef((props, ref) => {
id: 'playground.input.multiplePaste.tips'
})}
>
<Button
className="flex-center"
variant="filled"
size="middle"
color={multiplePasteEnable ? 'primary' : 'default'}
onClick={() => {
setMultiplePasteEnable(!multiplePasteEnable);
<Checkbox
defaultChecked={multiplePasteEnable.current}
onChange={(e: any) => {
multiplePasteEnable.current = e.target.checked;
}}
>
{intl.formatMessage({
id: 'playground.input.multiplePaste'
})}
</Button>
</Checkbox>
</Tooltip>
<Button size="middle" onClick={handleAddText}>
src/pages/playground/components/ground-images.tsx
+4 -3
View File
@@ -78,9 +78,9 @@ const GroundImages: React.FC<MessageProps> = forwardRef((props, ref) => {
// width: 'auto',
// uid: 0,
// span: 12,
// loading: true,
// loading: false,
// progress: 60
// }
// },
// {
// dataUrl:
// 'https://gw.alipayobjects.com/zos/antfincdn/LlvErxo8H9/photo-1503185912284-5271ff81b9a8.webp',
@@ -466,12 +466,13 @@ const GroundImages: React.FC<MessageProps> = forwardRef((props, ref) => {
flexWrap: 'unset',
alignItems: 'center'
}}
autoBgColor={true}
editable={false}
dataList={imageList}
loading={loading}
responseable={true}
gutter={[8, 16]}
autoSize={true}
autoSize={false}
></ThumbImg>
{!imageList.length && (
<div className="flex-column font-size-14 flex-center gap-20 justify-center hold-wrapper">
src/pages/playground/components/ground-reranker.tsx
+19 -14
View File
@@ -2,7 +2,7 @@ import useOverlayScroller from '@/hooks/use-overlay-scroller';
import useRequestToken from '@/hooks/use-request-token';
import { ClearOutlined, PlusOutlined, SendOutlined } from '@ant-design/icons';
import { useIntl, useSearchParams } from '@umijs/max';
import { Button, Input, Spin, Tag, Tooltip } from 'antd';
import { Button, Checkbox, Input, Spin, Tag, Tooltip } from 'antd';
import classNames from 'classnames';
import _ from 'lodash';
import 'overlayscrollbars/overlayscrollbars.css';
@@ -77,7 +77,7 @@ const GroundReranker: React.FC<MessageProps> = forwardRef((props, ref) => {
const messageListLengthCache = useRef<number>(0);
const requestToken = useRef<any>(null);
const formRef = useRef<any>(null);
const [multiplePasteEnable, setMultiplePasteEnable] = useState<boolean>(true);
const multiplePasteEnable = useRef<boolean>(true);
const [fileList, setFileList] = useState<
{
text: string;
@@ -346,22 +346,30 @@ const GroundReranker: React.FC<MessageProps> = forwardRef((props, ref) => {
const handleOnPaste = useCallback(
(e: any, index: number) => {
if (!multiplePasteEnable) return;
if (!multiplePasteEnable.current) return;
const text = e.clipboardData.getData('text');
if (text) {
console.log('text:', text);
const currentContent = textList[index]?.text;
const dataLlist = text.split('\n').map((item: string) => {
return {
text: item?.trim(),
uid: inputListRef.current?.setMessageId(),
uid: setMessageId(),
name: ''
};
});
dataLlist[0].text = currentContent + dataLlist[0].text;
const result = [
...textList.slice(0, index),
...dataLlist,
...textList.slice(index + 1)
].filter((item) => item.text);
]
.filter((item) => item.text)
.map((item, index) => {
return {
...item,
uid: setMessageId()
};
});
setTextList(result);
}
},
@@ -470,19 +478,16 @@ const GroundReranker: React.FC<MessageProps> = forwardRef((props, ref) => {
id: 'playground.input.multiplePaste.tips'
})}
>
<Button
className="flex-center"
variant="filled"
size="middle"
color={multiplePasteEnable ? 'primary' : 'default'}
onClick={() => {
setMultiplePasteEnable(!multiplePasteEnable);
<Checkbox
defaultChecked={multiplePasteEnable.current}
onChange={(e: any) => {
multiplePasteEnable.current = e.target.checked;
}}
>
{intl.formatMessage({
id: 'playground.input.multiplePaste'
})}
</Button>
</Checkbox>
</Tooltip>
<Button size="middle" onClick={handleAddText}>
<PlusOutlined />
src/pages/playground/components/thumb-img.tsx
+26 -4
View File
@@ -1,4 +1,5 @@
import AutoImage from '@/components/auto-image';
import SingleImage from '@/components/auto-image/single-image';
import { CloseCircleOutlined } from '@ant-design/icons';
import { Col, Progress, Row } from 'antd';
import _ from 'lodash';
@@ -15,13 +16,14 @@ const ThumbImg: React.FC<{
gutter?: number | number[] | object;
justify?: any;
autoSize?: boolean;
autoBgColor?: boolean;
}> = ({
dataList,
editable,
responseable,
gutter,
onDelete,
loading,
autoBgColor,
autoSize,
style
}) => {
@@ -112,7 +114,13 @@ const ThumbImg: React.FC<{
className="flex-center justify-center"
style={{ height: '100%', width: '100%' }}
>
{renderImageItem(item)}
<SingleImage
{...item}
autoSize={autoSize}
editable={editable}
autoBgColor={autoBgColor}
onDelete={handleOnDelete}
></SingleImage>
</Col>
);
})}
@@ -137,7 +145,13 @@ const ThumbImg: React.FC<{
className="flex-center justify-center"
style={{ height: '100%', width: '100%' }}
>
{renderImageItem(item)}
<SingleImage
{...item}
autoSize={autoSize}
editable={editable}
autoBgColor={autoBgColor}
onDelete={handleOnDelete}
></SingleImage>
</Col>
);
})}
@@ -147,7 +161,15 @@ const ThumbImg: React.FC<{
) : (
<>
{_.map(dataList, (item: any) => {
return renderImageItem(item);
return (
<SingleImage
{...item}
autoSize={autoSize}
editable={editable}
autoBgColor={autoBgColor}
onDelete={handleOnDelete}
></SingleImage>
);
})}
</>
)}