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

fix: model list not refresh

Browse Source
This commit is contained in:
jialin
2024-07-12 16:17:47 +08:00
parent d839464a05
commit 0a0b96735c
13 changed files with 63 additions and 35 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/footer/index.tsx
+2 -4
View File
@@ -1,6 +1,6 @@
import { GPUStackVersionAtom } from '@/atoms/user';
import { getAtomStorage } from '@/atoms/utils';
import VersionInfo from '@/components/version-info';
import VersionInfo, { modalConfig } from '@/components/version-info';
import externalLinks from '@/config/external-links';
import { useIntl } from '@umijs/max';
import { Button, Modal, Space } from 'antd';
@@ -11,9 +11,7 @@ const Footer: React.FC = () => {
const showVersion = () => {
Modal.info({
icon: null,
centered: false,
width: 500,
...modalConfig,
content: <VersionInfo intl={intl} />
});
};
src/components/seal-table/components/table-row.tsx
+2 -5
View File
@@ -36,8 +36,9 @@ const TableRow: React.FC<
const pollTimer = useRef<any>(null);
const chunkRequestRef = useRef<any>(null);
const childrenDataRef = useRef<any[]>([]);
childrenDataRef.current = childrenData;
console.log('table row====');
console.log('table row====', record.name, firstLoad, expanded);
const { updateChunkedList } = useUpdateChunkedList({
setDataList: setChildrenData
// callback: (list) => renderChildren?.(list)
@@ -54,10 +55,6 @@ const TableRow: React.FC<
}
}, [rowSelection]);
useEffect(() => {
childrenDataRef.current = childrenData;
}, [childrenData]);
// useEffect(() => {
// if (expandedRowKeys?.includes(record[rowKey])) {
// setExpanded(true);
src/components/status-tag/index.tsx
+4 -1
View File
@@ -69,7 +69,10 @@ const StatusTag: React.FC<StatusTagProps> = ({
}}
>
{statusValue.message ? (
<Tooltip title={statusValue.message}>
<Tooltip
title={statusValue.message}
overlayInnerStyle={{ maxHeight: 200, overflow: 'auto' }}
>
<span className="m-r-5">
<InfoCircleOutlined />
</span>
src/components/version-info/index.less
+1
View File
@@ -6,6 +6,7 @@
.img {
margin-top: 16px;
margin-bottom: 30px;
text-align: center;
height: 30px;
src/components/version-info/index.tsx
+8 -3
View File
@@ -13,9 +13,6 @@ const VersionInfo: React.FC<{ intl: any }> = ({ intl }) => {
<div className="img">
<img src={Logo} alt="logo" />
</div>
<div className="title">
{intl.formatMessage({ id: 'common.footer.version.title' })}
</div>
<div>
<div className="ver">
<span className="label">
@@ -36,4 +33,12 @@ const VersionInfo: React.FC<{ intl: any }> = ({ intl }) => {
);
};
export const modalConfig = {
icon: null,
centered: false,
maskClosable: true,
footer: null,
width: 400
};
export default VersionInfo;
src/hooks/use-container-scorll.ts
+7
View File
@@ -1,3 +1,4 @@
import _ from 'lodash';
import { useRef } from 'react';
export default function useContainerScroll(
@@ -8,8 +9,14 @@ export default function useContainerScroll(
const scroller = useRef(container);
const optionsRef = useRef(options);
const toBottomFlag = useRef(options?.toBottom);
const debunceResetWheeled = _.debounce(() => {
isWheeled.current = false;
}, 5000);
const handleContentWheel = (e: any) => {
isWheeled.current = true;
debunceResetWheeled();
};
const scrollerRun = () => {
src/hooks/use-update-chunk-list.ts
+8 -3
View File
@@ -35,6 +35,7 @@ export function useUpdateChunkedList(options: {
const ids = data?.ids || [];
// CREATE
if (data?.type === WatchEventType.CREATE) {
const newDataList = _.cloneDeep(dataList);
_.each(collections, (item: any) => {
const updateIndex = _.findIndex(
dataList,
@@ -42,12 +43,13 @@ export function useUpdateChunkedList(options: {
);
if (updateIndex === -1) {
const updateItem = _.cloneDeep(item);
options.setDataList?.((preDataList: any) => {
return _.concat(updateItem, preDataList);
});
newDataList.push(updateItem);
}
console.log('create=========', updateIndex, dataList, collections);
});
options.setDataList?.(() => {
return newDataList;
});
}
// DELETE
if (data?.type === WatchEventType.DELETE) {
@@ -71,6 +73,9 @@ export function useUpdateChunkedList(options: {
if (updateIndex > -1) {
const updateItem = _.cloneDeep(item);
updatedDataList[updateIndex] = updateItem;
} else if (updateIndex === -1) {
const updateItem = _.cloneDeep(item);
updatedDataList.push(updateItem);
}
});
src/layouts/index.tsx
+2 -4
View File
@@ -1,7 +1,7 @@
// @ts-nocheck
import { userAtom } from '@/atoms/user';
import VersionInfo from '@/components/version-info';
import VersionInfo, { modalConfig } from '@/components/version-info';
import { logout } from '@/pages/login/apis';
import { useAccessMarkedRoutes } from '@@/plugin-access';
import { useModel } from '@@/plugin-model';
@@ -105,9 +105,7 @@ export default (props: any) => {
const showVersion = () => {
Modal.info({
icon: null,
centered: false,
width: 500,
...modalConfig,
content: <VersionInfo intl={intl} />
});
};
src/locales/zh-CN/playground.ts
+3 -3
View File
@@ -18,11 +18,11 @@ export default {
'playground.params.temperature.tips':
'控制随机性：降低温度会导致更少的随机完成。当温度接近零时，模型将变得确定性和重复性。',
'playground.params.maxtokens.tips':
'生成的最大 token 数。输入标记和生成的标记的总长度受模型上下文长度的限制。',
'生成的最大 token 数。输入的 token 和生成的 token 的总长度受模型上下文长度的限制。',
'playground.params.topp.tips':
'通过核心采样控制多样性：0.5 表示考虑所有基于概率权重选项的一半。',
'playground.params.seed.tips':
'如果指定，我们的系统将尽最大努力进行确定性采样，以便使用相同种子和参数的重复请求应返回相同的结果。',
'如果指定，我们的系统将尽最大努力进行确定性采样，以便使用相同 seed 和参数的重复请求应返回相同的结果。',
'playground.params.stop.tips':
'停止序列是一个预定义或用户指定的文本字符串，当这些序列出现时，它会提示 AI 停止生成后续的标记。'
'停止序列是一个预定义或用户指定的文本字符串，当这些序列出现时，它会提示 AI 停止生成后续的 token。'
};
src/pages/llmodels/components/table-list.tsx
+5 -4
View File
@@ -204,7 +204,7 @@ const Models: React.FC<ModelsProps> = ({
});
};
const getModelInstances = useCallback(async (row: any) => {
const getModelInstances = async (row: any) => {
const params = {
id: row.id,
page: 1,
@@ -212,7 +212,7 @@ const Models: React.FC<ModelsProps> = ({
};
const data = await queryModelInstancesList(params);
return data.items || [];
}, []);
};
const generateChildrenRequestAPI = (params: any) => {
return `${MODELS_API}/${params.id}/instances`;
@@ -249,14 +249,14 @@ const Models: React.FC<ModelsProps> = ({
[]
);
const renderChildren = (list: any) => {
const renderChildren = useCallback((list: any) => {
return (
<InstanceItem
list={list}
handleChildSelect={handleChildSelect}
></InstanceItem>
);
};
}, []);
return (
<>
@@ -371,6 +371,7 @@ const Models: React.FC<ModelsProps> = ({
showSorterTooltip={false}
sorter={true}
render={(val, row) => {
console.log('val=====', val, row['created_at'], row.name);
return dayjs(val).format('YYYY-MM-DD HH:mm:ss');
}}
/>
src/pages/llmodels/index.tsx
+3 -5
View File
@@ -28,14 +28,12 @@ const Models: React.FC = () => {
});
// request data
dataSourceRef.current = dataSource;
const { updateChunkedList } = useUpdateChunkedList({
setDataList: setDataSource
});
useEffect(() => {
dataSourceRef.current = dataSource;
}, [dataSource]);
const fetchData = useCallback(async () => {
axiosToken?.cancel?.();
axiosToken = createAxiosToken();
@@ -44,7 +42,7 @@ const Models: React.FC = () => {
const params = {
..._.pickBy(queryParams, (val: any) => !!val)
};
const res = await queryModelsList(params, {
const res: any = await queryModelsList(params, {
cancelToken: axiosToken.token
});
console.log('res=======', res);
src/pages/playground/components/ground-left.tsx
+16 -2
View File
@@ -1,11 +1,12 @@
import TransitionWrapper from '@/components/transition';
import HotKeys from '@/config/hotkeys';
import useContainerScroll from '@/hooks/use-container-scorll';
import { fetchChunkedData, readStreamData } from '@/utils/fetch-chunk-data';
import { EyeInvisibleOutlined, EyeOutlined } from '@ant-design/icons';
import { useIntl } from '@umijs/max';
import { Button, Input, Spin } from 'antd';
import _ from 'lodash';
import { useRef, useState } from 'react';
import { useEffect, useRef, useState } from 'react';
import { useHotkeys } from 'react-hotkeys-hook';
import { CHAT_API } from '../apis';
import { Roles } from '../config';
@@ -48,6 +49,15 @@ const MessageList: React.FC<MessageProps> = (props) => {
const systemRef = useRef<any>(null);
const contentRef = useRef<any>('');
const controllerRef = useRef<any>(null);
const scroller = useRef<any>(null);
const { updateScrollerPosition, handleContentWheel } = useContainerScroll(
scroller,
{ toBottom: true }
);
useEffect(() => {
updateScrollerPosition();
}, [messageList]);
const handleSystemMessageChange = (e: any) => {
setSystemMessage(e.target.value);
@@ -208,7 +218,11 @@ const MessageList: React.FC<MessageProps> = (props) => {
return (
<div className="ground-left">
<div className="message-list-wrap">
<div
className="message-list-wrap"
ref={scroller}
onWheel={handleContentWheel}
>
<div style={{ marginBottom: 40 }}>
<TransitionWrapper
header={renderLabel()}
src/pages/playground/components/reference-params.tsx
+2 -1
View File
@@ -1,5 +1,6 @@
import { useIntl } from '@umijs/max';
import { Space, Tooltip } from 'antd';
import _ from 'lodash';
import '../style/reference-params.less';
interface ReferenceParamsProps {
@@ -43,7 +44,7 @@ const ReferenceParams = (props: ReferenceParamsProps) => {
<span>
{intl.formatMessage({ id: 'playground.tokenoutput' })}:{' '}
{usage.tokens_per_second} Tokens/s
{_.round(usage.tokens_per_second, 2)} Tokens/s
</span>
</div>
);