From a08f1e251255b00d499dbf24fd0457e0e38b297e Mon Sep 17 00:00:00 2001 From: jialin Date: Fri, 5 Dec 2025 15:23:57 +0800 Subject: [PATCH] chore: rename ground-left as ground-llm --- src/components/icon-font/index.tsx | 4 +- src/config/settings.ts | 2 +- src/pages/_components/terminal-tabs/index.tsx | 15 +-- .../terminal-tabs/resize-container.tsx | 98 +++++++++++++++++++ src/pages/_components/terminal-tabs/tabs.tsx | 62 +++++++----- .../components/ground-embedding.tsx | 43 ++------ .../playground/components/ground-images.tsx | 2 +- .../{ground-left.tsx => ground-llm.tsx} | 2 +- .../playground/components/ground-reranker.tsx | 2 +- .../playground/components/ground-stt.tsx | 2 +- .../playground/components/ground-tts.tsx | 2 +- .../playground/components/image-edit.tsx | 2 +- src/pages/playground/index.tsx | 4 +- .../{ground-left.less => ground-llm.less} | 12 --- .../resources/hooks/use-terminal-tabs.tsx | 1 - 15 files changed, 161 insertions(+), 92 deletions(-) create mode 100644 src/pages/_components/terminal-tabs/resize-container.tsx rename src/pages/playground/components/{ground-left.tsx => ground-llm.tsx} (99%) rename src/pages/playground/style/{ground-left.less => ground-llm.less} (85%) diff --git a/src/components/icon-font/index.tsx b/src/components/icon-font/index.tsx index 2c4fbc7b..dadcd310 100644 --- a/src/components/icon-font/index.tsx +++ b/src/components/icon-font/index.tsx @@ -1,8 +1,8 @@ import { createFromIconfontCN } from '@ant-design/icons'; -import './iconfont/iconfont.js'; +// import './iconfont/iconfont.js'; const IconFont = createFromIconfontCN({ - scriptUrl: '' + scriptUrl: '//at.alicdn.com/t/c/font_4613488_5idsv7urmzf.js' }); export default IconFont; diff --git a/src/config/settings.ts b/src/config/settings.ts index e5814673..b61dec61 100644 --- a/src/config/settings.ts +++ b/src/config/settings.ts @@ -7,5 +7,5 @@ export const DEFAULT_ENTER_PAGE = { login: '/login' }; -export const GPUSTACK_API_BASE_URL = 'v2'; +export const GPUSTACK_API_BASE_URL = 'v1'; export const OPENAI_COMPATIBLE = 'v1'; diff --git a/src/pages/_components/terminal-tabs/index.tsx b/src/pages/_components/terminal-tabs/index.tsx index 37618616..78e10f16 100644 --- a/src/pages/_components/terminal-tabs/index.tsx +++ b/src/pages/_components/terminal-tabs/index.tsx @@ -3,7 +3,6 @@ import TerminalTabs from './tabs'; export interface TerminalModalProps { terminals: { url: string; name: string }[]; - height: number; open: boolean; onClose: () => void; currentActive?: string; @@ -11,20 +10,16 @@ export interface TerminalModalProps { const TerminalModal: React.FC = ({ terminals, - height, open, onClose, currentActive }) => { return ( -
- -
+ ); }; diff --git a/src/pages/_components/terminal-tabs/resize-container.tsx b/src/pages/_components/terminal-tabs/resize-container.tsx new file mode 100644 index 00000000..b5835b53 --- /dev/null +++ b/src/pages/_components/terminal-tabs/resize-container.tsx @@ -0,0 +1,98 @@ +import { HolderOutlined } from '@ant-design/icons'; +import { useIntl } from '@umijs/max'; +import { Button } from 'antd'; +import { Resizable, ResizableProps } from 're-resizable'; +import React, { forwardRef, useImperativeHandle, useRef } from 'react'; +import styled from 'styled-components'; + +const StyledButton = styled(Button)` + position: absolute; + padding: 0; + top: -12px; + font-size: var(--font-size-middle); + left: calc(50% + 10px); + transform: translateX(-50%); + background: none !important; + cursor: ns-resize; + &::hover { + background: none !important; + } +`; + +const ResizeContainer: React.FC< + React.PropsWithChildren< + ResizableProps & { + ref?: any; + defaultHeight?: number; + defaultWidth?: number; + minHeight?: number; + maxHeight?: number; + onReSize?: ( + e: MouseEvent | TouchEvent, + dir: any, + refToElement: HTMLElement + ) => void; + onReSizeStop?: ( + e: MouseEvent | TouchEvent, + dir: any, + refToElement: HTMLElement, + delta: { width: number; height: number } + ) => void; + } + > +> = forwardRef((props, ref) => { + const { + defaultWidth, + defaultHeight = 180, + minHeight = 180, + maxHeight = 400, + children, + onReSize, + onReSizeStop, + ...restProps + } = props; + const intl = useIntl(); + const resizeRef = useRef(null); + + useImperativeHandle(ref, () => ({ + container: resizeRef.current + })); + + const dragHanle = ( + + } + > + ); + + return ( + + {children} + + ); +}); + +export default ResizeContainer; diff --git a/src/pages/_components/terminal-tabs/tabs.tsx b/src/pages/_components/terminal-tabs/tabs.tsx index bc28a3aa..874c2c95 100644 --- a/src/pages/_components/terminal-tabs/tabs.tsx +++ b/src/pages/_components/terminal-tabs/tabs.tsx @@ -3,6 +3,7 @@ import { CloseOutlined } from '@ant-design/icons'; import { Button, Tabs } from 'antd'; import React, { useEffect, useMemo, useState } from 'react'; import styled from 'styled-components'; +import ResizeContainer from './resize-container'; import { TerminalProps } from './types'; const TabsContainer = styled.div` @@ -30,7 +31,22 @@ const TabsContainer = styled.div` display: none; } + &::before { + display: none; + content: ''; + left: 5px; + top: 5px; + bottom: 5px; + right: 5px; + position: absolute; + border-radius: 4px; + background-color: var(--ant-color-fill-tertiary); + } + &:hover { + &::before { + display: block; + } .ant-tabs-tab-remove { display: inline-block; } @@ -50,20 +66,19 @@ const TabsContainer = styled.div` export interface TerminalTabsProps { terminals: TerminalProps[]; - height: number; currentActive?: string; onClose: () => void; } const TerminalTabs: React.FC = ({ terminals, - height, currentActive, onClose }) => { const [activeKey, setActiveKey] = useState( currentActive || terminals[0]?.url || '' ); + const [height, setHeight] = useState(300); const items = useMemo(() => { return terminals.map((terminal) => { @@ -82,26 +97,29 @@ const TerminalTabs: React.FC = ({ }, [currentActive]); return ( - - } - type="text" - size="small" - onClick={onClose} - > - ) - }} - > - + + + } + type="text" + size="small" + style={{ marginRight: 8 }} + onClick={onClose} + > + ) + }} + > + + ); }; diff --git a/src/pages/playground/components/ground-embedding.tsx b/src/pages/playground/components/ground-embedding.tsx index 0f092042..39e425cd 100644 --- a/src/pages/playground/components/ground-embedding.tsx +++ b/src/pages/playground/components/ground-embedding.tsx @@ -5,9 +5,9 @@ import IconFont from '@/components/icon-font'; import SealInputNumber from '@/components/seal-form/input-number'; import useOverlayScroller from '@/hooks/use-overlay-scroller'; import useRequestToken from '@/hooks/use-request-token'; +import ResizeContainer from '@/pages/_components/terminal-tabs/resize-container'; import { ClearOutlined, - HolderOutlined, PlusOutlined, QuestionCircleOutlined, SendOutlined @@ -17,7 +17,6 @@ import { Button, Checkbox, Form, Segmented, Spin, Tabs, Tooltip } from 'antd'; import classNames from 'classnames'; import _ from 'lodash'; import 'overlayscrollbars/overlayscrollbars.css'; -import { Resizable } from 're-resizable'; import React, { forwardRef, useCallback, @@ -33,7 +32,7 @@ import { embeddingSamples } from '../config/samples'; import { LLM_METAKEYS } from '../hooks/config'; import useEmbeddingWorker from '../hooks/use-embedding-worker'; import { useInitLLmMeta } from '../hooks/use-init-meta'; -import '../style/ground-left.less'; +import '../style/ground-llm.less'; import '../style/rerank.less'; import { generateEmbeddingCode } from '../view-code/embedding'; import DynamicParams from './dynamic-params'; @@ -132,7 +131,7 @@ const GroundEmbedding: React.FC = forwardRef((props, ref) => { setCollapse(!collapse); }, calculateNewMaxFromBoundary: (maxWidth?: number, maxHeight?: number) => { - resizeRef.current?.calculateNewMaxFromBoundary(); + resizeRef.current?.container?.calculateNewMaxFromBoundary(); }, collapse: collapse }; @@ -259,8 +258,7 @@ const GroundEmbedding: React.FC = forwardRef((props, ref) => { }; const handleScaleResize = () => { - console.log('handleScaleResize', resizeRef.current); - const height = resizeRef.current?.state?.height; + const height = resizeRef.current?.container?.state?.height; if (height) { setOutputHeight(height); } @@ -638,38 +636,11 @@ const GroundEmbedding: React.FC = forwardRef((props, ref) => { )} - - - - ) - }} maxHeight={resizeMaxHeight} minHeight={180} + defaultHeight={180} onResize={handleScaleResize} onResizeStop={handleScaleOutputSize} > @@ -689,7 +660,7 @@ const GroundEmbedding: React.FC = forwardRef((props, ref) => { items={outputItems} > - + diff --git a/src/pages/playground/components/ground-images.tsx b/src/pages/playground/components/ground-images.tsx index a591ad78..5ddb3b7c 100644 --- a/src/pages/playground/components/ground-images.tsx +++ b/src/pages/playground/components/ground-images.tsx @@ -21,7 +21,7 @@ import React, { import { CREAT_IMAGE_API } from '../apis'; import { useInitImageMeta } from '../hooks/use-init-meta'; import useTextImage from '../hooks/use-text-image'; -import '../style/ground-left.less'; +import '../style/ground-llm.less'; import '../style/system-message-wrap.less'; import { generateImageCode, generateOpenaiImageCode } from '../view-code/image'; import DynamicParams from './dynamic-params'; diff --git a/src/pages/playground/components/ground-left.tsx b/src/pages/playground/components/ground-llm.tsx similarity index 99% rename from src/pages/playground/components/ground-left.tsx rename to src/pages/playground/components/ground-llm.tsx index 47e5c0cd..1c5f855f 100644 --- a/src/pages/playground/components/ground-left.tsx +++ b/src/pages/playground/components/ground-llm.tsx @@ -15,7 +15,7 @@ import { MessageItem, MessageItemAction } from '../config/types'; import { LLM_METAKEYS, llmInitialValues } from '../hooks/config'; import useChatCompletion from '../hooks/use-chat-completion'; import { useInitLLmMeta } from '../hooks/use-init-meta'; -import '../style/ground-left.less'; +import '../style/ground-llm.less'; import '../style/system-message-wrap.less'; import { generateLLMCode } from '../view-code/llm'; import DynamicParams from './dynamic-params'; diff --git a/src/pages/playground/components/ground-reranker.tsx b/src/pages/playground/components/ground-reranker.tsx index 372b141c..b4402081 100644 --- a/src/pages/playground/components/ground-reranker.tsx +++ b/src/pages/playground/components/ground-reranker.tsx @@ -38,7 +38,7 @@ import { rerankerSamples } from '../config/samples'; import { ParamsSchema } from '../config/types'; import { LLM_METAKEYS } from '../hooks/config'; import { useInitLLmMeta } from '../hooks/use-init-meta'; -import '../style/ground-left.less'; +import '../style/ground-llm.less'; import '../style/rerank.less'; import '../style/system-message-wrap.less'; import { generateRerankCode } from '../view-code/rerank'; diff --git a/src/pages/playground/components/ground-stt.tsx b/src/pages/playground/components/ground-stt.tsx index 7967d54f..2c523e57 100644 --- a/src/pages/playground/components/ground-stt.tsx +++ b/src/pages/playground/components/ground-stt.tsx @@ -26,7 +26,7 @@ import React, { import { AUDIO_SPEECH_TO_TEXT_API, speechToText } from '../apis'; import { SpeechToTextFormat, extractErrorMessage } from '../config'; import { RealtimeParamsConfig as paramsConfig } from '../config/params-config'; -import '../style/ground-left.less'; +import '../style/ground-llm.less'; import '../style/speech-to-text.less'; import '../style/system-message-wrap.less'; import { speechToTextCode } from '../view-code/audio'; diff --git a/src/pages/playground/components/ground-tts.tsx b/src/pages/playground/components/ground-tts.tsx index d7be4615..79aeb1bb 100644 --- a/src/pages/playground/components/ground-tts.tsx +++ b/src/pages/playground/components/ground-tts.tsx @@ -24,7 +24,7 @@ import { AUDIO_TEXT_TO_SPEECH_API, CHAT_API, textToSpeech } from '../apis'; import { extractErrorMessage } from '../config'; import { TTSParamsConfig as paramsConfig } from '../config/params-config'; import { MessageItem, ParamsSchema } from '../config/types'; -import '../style/ground-left.less'; +import '../style/ground-llm.less'; import '../style/system-message-wrap.less'; import { TextToSpeechCode } from '../view-code/audio'; import DynamicParams from './dynamic-params'; diff --git a/src/pages/playground/components/image-edit.tsx b/src/pages/playground/components/image-edit.tsx index f4c39aa1..7fb27532 100644 --- a/src/pages/playground/components/image-edit.tsx +++ b/src/pages/playground/components/image-edit.tsx @@ -26,7 +26,7 @@ import { EDIT_IMAGE_API } from '../apis'; import { EDIT_IMAGE_ACCEPT, scaleImageSize } from '../config'; import { useInitImageMeta } from '../hooks/use-init-meta'; import useTextImage from '../hooks/use-text-image'; -import '../style/ground-left.less'; +import '../style/ground-llm.less'; import '../style/system-message-wrap.less'; import { generateImageCode, generateOpenaiImageCode } from '../view-code/image'; import DynamicParams from './dynamic-params'; diff --git a/src/pages/playground/index.tsx b/src/pages/playground/index.tsx index 52080a5e..a275d48f 100644 --- a/src/pages/playground/index.tsx +++ b/src/pages/playground/index.tsx @@ -13,7 +13,7 @@ import { useEffect, useMemo, useRef, useState } from 'react'; import { useHotkeys } from 'react-hotkeys-hook'; import { PageContainerInner } from '../_components/page-box'; import { queryModelsList } from './apis'; -import GroundLeft from './components/ground-left'; +import GroundLLM from './components/ground-llm'; import MultipleChat from './components/multiple-chat'; import ViewCodeButtons from './components/view-code-buttons'; import './style/play-ground.less'; @@ -65,7 +65,7 @@ const Playground: React.FC = () => { label: 'Chat', icon: , children: ( - + ) }, { diff --git a/src/pages/playground/style/ground-left.less b/src/pages/playground/style/ground-llm.less similarity index 85% rename from src/pages/playground/style/ground-left.less rename to src/pages/playground/style/ground-llm.less index e7828f65..843df15b 100644 --- a/src/pages/playground/style/ground-left.less +++ b/src/pages/playground/style/ground-llm.less @@ -80,17 +80,5 @@ .embed-chart { position: relative; - - .drag-handler { - position: absolute; - padding: 0; - height: fit-content; - top: -10px; - font-size: var(--font-size-middle); - left: calc(50% + 10px); - transform: translateX(-50%); - background-color: transparent; - cursor: ns-resize; - } } } diff --git a/src/pages/resources/hooks/use-terminal-tabs.tsx b/src/pages/resources/hooks/use-terminal-tabs.tsx index 01fb2cea..99dee9b7 100644 --- a/src/pages/resources/hooks/use-terminal-tabs.tsx +++ b/src/pages/resources/hooks/use-terminal-tabs.tsx @@ -34,7 +34,6 @@ const useTerminalTabs = () => { const TerminalPanel = (