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

fix(style): markdown viewer text-intent

Browse Source
This commit is contained in:
jialin
2024-09-29 16:54:00 +08:00
parent 5c2503b2a8
commit 69ffdd4604
10 changed files with 63 additions and 54 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/assets/styles/common.less
+4
View File
@@ -93,6 +93,10 @@
align-items: center;
}
.flex-wrap {
flex-wrap: wrap;
}
.flex-gap-2 {
display: flex;
gap: 2px;
src/components/markdown-viewer/index.less
-1
View File
@@ -1,6 +1,5 @@
.markdown-viewer {
font-family: var(--font-family) !important;
white-space: pre-wrap;
.hr {
border: none;
src/components/seal-table/styles/cell.less
+2
View File
@@ -6,6 +6,8 @@
justify-content: flex-start;
height: 68px;
word-break: break-word;
min-width: 20px;
overflow: hidden;
.cell-content {
max-width: 100%;
src/hooks/use-update-chunk-list.ts
+28 -31
View File
@@ -1,5 +1,4 @@
import { WatchEventType } from '@/config';
import _ from 'lodash';
import { useEffect, useRef } from 'react';
interface ChunkedCollection {
@@ -19,6 +18,7 @@ export function useUpdateChunkedList(options: {
}) {
const cacheDataListRef = useRef<any[]>(options.dataList || []);
const timerRef = useRef<any>(null);
const countRef = useRef<number>(0);
useEffect(() => {
cacheDataListRef.current = [...(options.dataList || [])];
@@ -30,74 +30,71 @@ export function useUpdateChunkedList(options: {
options.setDataList?.([...cacheDataListRef.current]);
}, 80);
};
const updateChunkedList = (
data: ChunkedCollection,
dataList?: { id: string | number }[]
) => {
const updateChunkedList = (data: ChunkedCollection) => {
console.log('updateChunkedList=====', {
ids: data?.ids,
type: data?.type,
collection: data?.collection.length,
dataList: _.map(dataList, (o: any) => o.id)
collection: data?.collection
});
let collections = data?.collection || [];
if (options?.computedID) {
collections = _.map(collections, (item: any) => {
collections = collections?.map((item: any) => {
item.id = options?.computedID?.(item);
return item;
});
}
if (options?.filterFun) {
collections = _.filter(data?.collection, options?.filterFun);
collections = data?.collection?.filter(options?.filterFun);
}
if (options?.mapFun) {
collections = _.map(data?.collection, options?.mapFun);
collections = data?.collection?.map(options?.mapFun);
}
const ids = data?.ids || [];
// CREATE
if (data?.type === WatchEventType.CREATE) {
const newDataList: any[] = [];
_.each(collections, (item: any) => {
const updateIndex = _.findIndex(
cacheDataListRef.current,
const newDataList = collections.reduce((acc: any[], item: any) => {
const updateIndex = cacheDataListRef.current?.findIndex(
(sItem: any) => sItem.id === item.id
);
const updateItem = { ...item };
if (updateIndex === -1) {
const updateItem = _.cloneDeep(item);
newDataList.push(updateItem);
acc.push(updateItem);
} else {
cacheDataListRef.current[updateIndex] = updateItem;
}
console.log('create=========', updateIndex, collections);
});
cacheDataListRef.current = [...newDataList, ...cacheDataListRef.current];
// options.setDataList?.([...cacheDataListRef.current]);
return acc;
}, []);
cacheDataListRef.current = [
...newDataList,
...cacheDataListRef.current
].slice(0, 10);
}
// DELETE
if (data?.type === WatchEventType.DELETE) {
cacheDataListRef.current = _.filter(
cacheDataListRef.current,
cacheDataListRef.current = cacheDataListRef.current?.filter(
(item: any) => {
return !_.includes(ids, item.id);
return !ids?.includes(item.id);
}
);
options.setDataList?.([...cacheDataListRef.current]);
}
// UPDATE
if (data?.type === WatchEventType.UPDATE) {
_.each(collections, (item: any) => {
const updateIndex = _.findIndex(
cacheDataListRef.current,
collections?.forEach((item: any) => {
const updateIndex = cacheDataListRef.current?.findIndex(
(sItem: any) => sItem.id === item.id
);
const updateItem = { ...item };
if (updateIndex > -1) {
const updateItem = _.cloneDeep(item);
cacheDataListRef.current[updateIndex] = updateItem;
} else if (updateIndex === -1) {
const updateItem = _.cloneDeep(item);
cacheDataListRef.current.push(updateItem);
cacheDataListRef.current = [
updateItem,
...cacheDataListRef.current.slice(0, 9)
];
}
});
console.log('updateChunkedList=====update', cacheDataListRef.current);
// options.setDataList?.([...cacheDataListRef.current]);
}
debounceUpdateChunckedList();
src/locales/en-US/playground.ts
+1 -1
View File
@@ -46,5 +46,5 @@ export default {
'playground.compare.applytoall': 'Apply to all models',
'playground.model.noavailable': 'No available models.',
'playground.model.noavailable.tips':
'Please deploy a model first, and it is not an Embedding Only model.'
'Please deploy a model first, and it should not be an embedding-only model.'
};
src/locales/zh-CN/playground.ts
+1 -1
View File
@@ -46,5 +46,5 @@ export default {
'playground.compare.applytoall': '应用到所有模型',
'playground.model.noavailable': '无可用模型',
'playground.model.noavailable.tips':
'请先部署模型，且不是 Embedding Only 模型'
'请先部署模型，且不是 Embedding Only 的模型'
};
src/pages/llmodels/components/table-list.tsx
+11 -8
View File
@@ -519,17 +519,20 @@ const Models: React.FC<ModelsProps> = ({
span={5}
render={(text, record: ListItem) => {
return (
<span className="flex-center" style={{ maxWidth: '100%' }}>
<AutoTooltip className="m-r-5" ghost>
{text}
<span
className="flex-center flex-wrap"
style={{ maxWidth: '100%' }}
>
<AutoTooltip ghost>
<span className="m-r-5">{text}</span>
</AutoTooltip>
<span>
{record.embedding_only && (
<Tag style={{ marginTop: 6 }} color="geekblue">
{record.embedding_only && (
<span>
<Tag style={{ margin: 0 }} color="geekblue">
Embedding Only
</Tag>
)}
</span>
</span>
)}
</span>
);
}}
src/pages/playground/components/message-input.tsx
+3 -8
View File
@@ -1,12 +1,7 @@
import IconFont from '@/components/icon-font';
import HotKeys, { KeyMap } from '@/config/hotkeys';
import { platformCall } from '@/utils';
import {
ClearOutlined,
ControlOutlined,
SendOutlined,
SwapOutlined
} from '@ant-design/icons';
import { ClearOutlined, SendOutlined, SwapOutlined } from '@ant-design/icons';
import { useIntl } from '@umijs/max';
import { Button, Divider, Input, Select, Tooltip } from 'antd';
import _ from 'lodash';
@@ -351,7 +346,7 @@ const MessageInput: React.FC<MessageInputProps> = ({
></Button>
</Tooltip>
<Tooltip
{/* <Tooltip
title={intl.formatMessage({ id: 'playground.toolbar.prompts' })}
>
<Button
@@ -360,7 +355,7 @@ const MessageInput: React.FC<MessageInputProps> = ({
size="middle"
onClick={handleOpenPrompt}
></Button>
</Tooltip>
</Tooltip> */}
{updateLayout && (
<>
<Divider type="vertical" style={{ margin: 0 }} />
src/pages/playground/components/prompt-modal.tsx
+12 -3
View File
@@ -1,7 +1,7 @@
import useOverlayScroller from '@/hooks/use-overlay-scroller';
import { useIntl } from '@umijs/max';
import { Button, Modal, Typography } from 'antd';
import React from 'react';
import SimpleBar from 'simplebar-react';
import 'simplebar-react/dist/simplebar.min.css';
import promptList from '../config/prompt';
import '../style/prompt-modal.less';
@@ -15,6 +15,15 @@ type ViewModalProps = {
const AddWorker: React.FC<ViewModalProps> = (props) => {
const { open, onCancel } = props || {};
const intl = useIntl();
const { initialize } = useOverlayScroller();
const scrollerRef = React.useRef<any>(null);
React.useEffect(() => {
if (scrollerRef.current) {
initialize(scrollerRef.current);
}
}, [scrollerRef.current, initialize]);
const handleSelect = (item: {
title: string;
data: { role: string; content: string }[];
@@ -45,7 +54,7 @@ const AddWorker: React.FC<ViewModalProps> = (props) => {
}}
footer={null}
>
<SimpleBar style={{ maxHeight: '550px' }}>
<div ref={scrollerRef} style={{ maxHeight: '550px', overflow: 'auto' }}>
<div className="prompt-wrapper">
{promptList.map((item, index) => {
return (
@@ -83,7 +92,7 @@ const AddWorker: React.FC<ViewModalProps> = (props) => {
);
})}
</div>
</SimpleBar>
</div>
</Modal>
);
};