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

fix(style): model status

Browse Source
This commit is contained in:
jialin
2024-07-08 19:47:47 +08:00
parent 9ad9539b51
commit 734368dd49
25 changed files with 109 additions and 83 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/pages/api-keys/components/add-apikey.tsx
+1
View File
@@ -89,6 +89,7 @@ const AddModal: React.FC<AddModalProps> = ({
<Modal
title={title}
open={open}
centered={true}
onOk={handleSumit}
onCancel={onCancel}
afterOpenChange={handleAfterOpenChange}
src/pages/api-keys/index.tsx
+8
View File
@@ -259,6 +259,14 @@ const Models: React.FC = () => {
return dayjs(text).format('YYYY-MM-DD HH:mm:ss');
}}
/>
<Column
title={intl.formatMessage({ id: 'common.table.description' })}
dataIndex="description"
key="description"
ellipsis={{
showTitle: true
}}
/>
<Column
title={intl.formatMessage({ id: 'common.table.createTime' })}
dataIndex="created_at"
src/pages/llmodels/components/add-modal.tsx
+1
View File
@@ -276,6 +276,7 @@ const AddModal: React.FC<AddModalProps> = (props) => {
<Modal
title={title}
open={open}
centered={true}
onOk={handleSumit}
onCancel={onCancel}
destroyOnClose={true}
src/pages/llmodels/components/instance-item.tsx
+12 -10
View File
@@ -7,7 +7,7 @@ import { Col, Row, Space } from 'antd';
import dayjs from 'dayjs';
import _ from 'lodash';
import React from 'react';
import { status } from '../config';
import { InstanceStatusMap, status } from '../config';
import { ModelInstanceListItem } from '../config/types';
interface InstanceItemProps {
@@ -33,6 +33,15 @@ const InstanceItem: React.FC<InstanceItemProps> = ({
icon: <DeleteOutlined />
}
];
const testStatus = {
state: InstanceStatusMap.Scheduled
};
const getWorkerIp = (item: ModelInstanceListItem) => {
if (item.worker_ip) {
return item.port ? `${item.worker_ip}:${item.port}` : item.worker_ip;
}
return '-';
};
return (
<Space size={16} direction="vertical" style={{ width: '100%' }}>
{_.map(list, (item: ModelInstanceListItem, index: number) => {
@@ -40,18 +49,11 @@ const InstanceItem: React.FC<InstanceItemProps> = ({
<div
key={`${item.id}`}
style={{ borderRadius: 'var(--ant-table-header-border-radius)' }}
className={
item.download_progress !== 100 && item.state !== 'Running'
? 'skeleton-loading'
: ''
}
>
<RowChildren key={`${item.id}_row`}>
<Row style={{ width: '100%' }} align="middle">
<Col span={4}>{item.name}</Col>
<Col span={3}>
{item.worker_ip ? `${item.worker_ip}:${item.port}` : '-'}
</Col>
<Col span={3}>{getWorkerIp(item)}</Col>
<Col span={4}>
<span>
{item.source === 'huggingface'
@@ -68,7 +70,7 @@ const InstanceItem: React.FC<InstanceItemProps> = ({
{item.state && (
<StatusTag
download={
item.state !== 'Running'
item.state === InstanceStatusMap.Downloading
? { percent: item.download_progress }
: undefined
}
src/pages/llmodels/components/view-logs-modal.tsx
+2 -2
View File
@@ -21,13 +21,13 @@ const ViewCodeModal: React.FC<ViewModalProps> = (props) => {
<Modal
title={intl.formatMessage({ id: 'common.button.viewlog' })}
open={open}
centered={true}
onCancel={onCancel}
destroyOnClose={true}
closeIcon={true}
maskClosable={false}
keyboard={false}
width={'max(50%, 600px)'}
style={{ top: '80px' }}
width={600}
footer={null}
>
<LogsViewer
src/pages/llmodels/config/index.ts
+17 -11
View File
@@ -18,9 +18,24 @@ export const modelSourceMap: Record<string, string> = {
s3: 'S3'
};
export const InstanceStatusMap = {
Initializing: 'Initializing',
Pending: 'Pending',
Running: 'Running',
Scheduled: 'Scheduled',
Error: 'Error',
Downloading: 'Downloading',
Unknown: 'Unknown'
};
export const status: any = {
Running: StatusMaps.success,
Pending: StatusMaps.transitioning
[InstanceStatusMap.Running]: StatusMaps.success,
[InstanceStatusMap.Pending]: StatusMaps.transitioning,
[InstanceStatusMap.Initializing]: StatusMaps.transitioning,
[InstanceStatusMap.Scheduled]: StatusMaps.success,
[InstanceStatusMap.Error]: StatusMaps.error,
[InstanceStatusMap.Downloading]: StatusMaps.transitioning,
[InstanceStatusMap.Unknown]: StatusMaps.inactive
};
export const ActionList = [
@@ -40,12 +55,3 @@ export const ActionList = [
icon: EditOutlined
}
];
export const InstanceStatusMap = {
Initializing: 'Initializing',
Pending: 'Pending',
Running: 'Running',
Scheduled: 'Scheduled',
Error: 'Error',
Downloading: 'Downloading'
};
src/pages/playground/components/chat-footer.tsx
+2 -2
View File
@@ -1,9 +1,9 @@
import IconFont from '@/components/icon-font';
import HotKeys from '@/config/hotkeys';
import {
CodeOutlined,
DeleteOutlined,
EnterOutlined,
MacCommandOutlined,
PlusOutlined
} from '@ant-design/icons';
import { useIntl } from '@umijs/max';
@@ -74,7 +74,7 @@ const ChatFooter: React.FC<ChatFooterProps> = (props) => {
<Button disabled={disabled} type="primary" onClick={onSubmit}>
{intl.formatMessage({ id: 'common.button.submit' })}
<span className="m-l-5 opct-7">
<MacCommandOutlined /> + <EnterOutlined />
<IconFont type="icon-command"></IconFont> + <EnterOutlined />
</span>
</Button>
</Space>
src/pages/playground/components/ground-left.tsx
+5 -2
View File
@@ -85,6 +85,7 @@ const MessageList: React.FC<MessageProps> = (props) => {
uid: messageId.current
}
]);
console.log('messageList=====', messageList, messageId.current, chunk);
return false;
};
const submitMessage = async () => {
@@ -115,7 +116,6 @@ const MessageList: React.FC<MessageProps> = (props) => {
return;
}
const { reader, decoder } = result;
await readStreamData(reader, decoder, (chunk: any) => {
joinMessage(chunk);
});
@@ -207,7 +207,10 @@ const MessageList: React.FC<MessageProps> = (props) => {
autoSize={true}
onFocus={handleFocus}
onBlur={handleBlur}
placeholder={intl.formatMessage({ id: 'playground.system.tips' })}
style={{ minHeight: 40 }}
placeholder={intl.formatMessage({
id: 'playground.system.tips'
})}
onChange={handleSystemMessageChange}
></Input.TextArea>
</TransitionWrapper>
src/pages/playground/components/message-item.tsx
+15 -12
View File
@@ -31,18 +31,6 @@ const MessageItem: React.FC<{
const [currentIsFocus, setCurrentIsFocus] = useState(isFocus);
const inputRef = useRef<any>(null);
useHotkeys(
HotKeys.SUBMIT,
() => {
onSubmit();
},
{
enabled: currentIsFocus && !loading,
enableOnFormTags: currentIsFocus && !loading,
preventDefault: true
}
);
useEffect(() => {
if (inputRef.current && isFocus) {
inputRef.current.focus();
@@ -110,6 +98,20 @@ const MessageItem: React.FC<{
const handleDelete = () => {
onDelete();
};
useHotkeys(
HotKeys.SUBMIT,
() => {
inputRef.current.blur();
onSubmit();
},
{
enabled: currentIsFocus,
enableOnFormTags: currentIsFocus,
preventDefault: true
}
);
return (
<div className="message-item">
<div className="role-type">
@@ -124,6 +126,7 @@ const MessageItem: React.FC<{
value={messageContent}
autoSize={true}
variant="filled"
readOnly={loading}
onChange={handleMessageChange}
onFocus={handleFocus}
onBlur={handleBlur}
src/pages/playground/components/view-code-modal.tsx
+4 -3
View File
@@ -116,6 +116,7 @@ const ViewCodeModal: React.FC<ViewModalProps> = (props) => {
},
formatOnType: true,
formatOnPaste: true,
fontWeight: '700',
scrollbar: {
verticalSliderSize: 8
}
@@ -130,13 +131,13 @@ const ViewCodeModal: React.FC<ViewModalProps> = (props) => {
<Modal
title={title}
open={open}
centered={true}
onCancel={handleClose}
destroyOnClose={true}
closeIcon={true}
maskClosable={false}
keyboard={false}
width={'max(50%, 600px)'}
style={{ top: '80px' }}
width={660}
footer={null}
>
<div style={{ marginBottom: '10px' }}>
@@ -151,7 +152,7 @@ const ViewCodeModal: React.FC<ViewModalProps> = (props) => {
onChangeLang={handleOnChangeLang}
>
<Editor
height="500px"
height="min(500px, 90vh)"
theme="vs-dark"
className="monaco-editor"
defaultLanguage="shell"
src/pages/profile/index.tsx
+1 -20
View File
@@ -50,26 +50,6 @@ const Profile: React.FC = () => {
onFinish={handleOnFinish}
onFinishFailed={handleOnFinishFailed}
>
{/* <Form.Item<ProfileProps>
name="username"
rules={[
{
required: true,
message: intl.formatMessage(
{ id: 'common.form.rule.input' },
{
name: intl.formatMessage({ id: 'common.form.username' })
}
)
}
]}
>
<SealInput.Input
label={intl.formatMessage({ id: 'common.form.username' })}
required
style={{ width: INPUT_WIDTH.default }}
></SealInput.Input>
</Form.Item> */}
<Form.Item<ProfileProps>
name="current_password"
rules={[
@@ -135,6 +115,7 @@ const Profile: React.FC = () => {
]}
>
<SealInput.Password
required={true}
label={intl.formatMessage({ id: 'users.password.confirm' })}
/>
</Form.Item>
src/pages/table/components/CreateForm.tsx
+1
View File
@@ -14,6 +14,7 @@ const CreateForm: React.FC<PropsWithChildren<CreateFormProps>> = (props) => {
destroyOnClose
title="新建"
width={420}
centered={true}
open={modalVisible}
onCancel={() => onCancel()}
footer={null}
src/pages/users/components/add-modal.tsx
+1
View File
@@ -54,6 +54,7 @@ const AddModal: React.FC<AddModalProps> = ({
<Modal
title={title}
open={open}
centered={true}
onOk={handleSumit}
onCancel={onCancel}
destroyOnClose={true}