chore: vllm params

config/config.ts

@@ -14,7 +14,7 @@ const isProduction = env === 'production';
 const t = Date.now();
 export default defineConfig({
   proxy: {
-    ...proxy('http://192.168.50.4')
+    ...proxy()
   },
   history: {
     type: 'hash'

config/routes.ts

@@ -31,13 +31,6 @@ export default [
     access: 'canSeeAdmin',
     component: './resources'
   },
-  // {
-  //   name: 'usage',
-  //   path: '/usage',
-  //   key: 'usage',
-  //   icon: 'BarChartOutlined',
-  //   component: './usage'
-  // },
   {
     name: 'apikeys',
     path: '/api-keys',

src/components/list-input/hint-input.tsx

@@ -21,7 +21,7 @@ const HintInput: React.FC<HintInputProps> = (props) => {
 
   const generateOptions = (context: string) => {
     if (!context) {
-      setOptions([]);
+      setOptions(sourceOptions || []);
       return;
     }
     const match = context.match(matchReg);

src/components/list-input/index.tsx

@@ -78,7 +78,6 @@ const ListInput: React.FC<ListInputProps> = (props) => {
               options={options}
               key={item.uid}
               value={item.value}
-              label={`${index + 1}`}
               onRemove={() => handleOnRemove(index)}
               onChange={(val) => handleOnChange(val, index)}
             />

src/locales/zh-CN.ts

@@ -9,6 +9,14 @@ import shortcuts from './zh-CN/shortcuts';
 import usage from './zh-CN/usage';
 import users from './zh-CN/users';
 
+// import { LangConfigType } from './lang-config-map';
+
+// const DIR: LangConfigType = 'zh-CN';
+
+// const langConfig = require.context(`./`, true, /\.ts$/);
+
+// console.log('langConfig====', langConfig);
+
 export default {
   ...common,
   ...menu,

src/pages/llmodels/apis/index.ts

@@ -154,9 +154,17 @@ export async function queryModelScopeModels(
     Target?: string;
     SingleCriterion?: any[];
     Name: string;
+    filterGGUF?: boolean;
   },
   config?: any
 ) {
+  const Criterion = params.filterGGUF
+    ? {
+        Criterion: [
+          { category: 'tags', predicate: 'contains', values: ['gguf'] }
+        ]
+      }
+    : {};
   const res = await fetch(`${MODEL_SCOPE_LIST_MODEL_API}`, {
     method: 'PUT',
     signal: config?.signal,
@@ -165,6 +173,7 @@ export async function queryModelScopeModels(
     },
     body: JSON.stringify({
       ...params,
+      ...Criterion,
       Name: `${params.Name}`,
       PageSize: 100,
       PageNumber: 1

src/pages/llmodels/components/advance-config.tsx

@@ -1,5 +1,7 @@
 import LabelSelector from '@/components/label-selector';
+import ListInput from '@/components/list-input';
 import SealSelect from '@/components/seal-form/seal-select';
+import { PageAction } from '@/config';
 import { PageActionType } from '@/config/types';
 import { InfoCircleOutlined, RightOutlined } from '@ant-design/icons';
 import { useIntl } from '@umijs/max';
@@ -191,7 +193,7 @@ const AdvanceConfig: React.FC<AdvanceConfigProps> = (props) => {
             </Form.Item>
           </>
         )}
-        {/* <Form.Item name="backend">
+        <Form.Item name="backend">
           <SealSelect
             label={intl.formatMessage({ id: 'models.form.backend' })}
             options={[
@@ -208,8 +210,8 @@ const AdvanceConfig: React.FC<AdvanceConfigProps> = (props) => {
             ]}
             disabled={action === PageAction.EDIT}
           ></SealSelect>
-        </Form.Item> */}
-        {/* <Form.Item<FormData> name="backend_parameters">
+        </Form.Item>
+        <Form.Item<FormData> name="backend_parameters">
           <ListInput
             btnText="common.button.addParams"
             label={intl.formatMessage({ id: 'models.form.backend_parameters' })}
@@ -217,7 +219,7 @@ const AdvanceConfig: React.FC<AdvanceConfigProps> = (props) => {
             onChange={handleBackendParametersChange}
             options={paramsConfig}
           ></ListInput>
-        </Form.Item> */}
+        </Form.Item>
         {scheduleType === 'manual' && (
           <Form.Item<FormData>
             name="gpu_selector"

src/pages/llmodels/components/data-form.tsx

@@ -101,9 +101,6 @@ const DataForm: React.FC<DataFormProps> = forwardRef((props, ref) => {
   );
 
   const handleOnSelectModel = () => {
-    if (!props.selectedModel.name) {
-      return;
-    }
     let name = _.split(props.selectedModel.name, '/').slice(-1)[0];
     const reg = /(-gguf)$/i;
     name = _.toLower(name).replace(reg, '');

src/pages/llmodels/components/hf-model-file.tsx

@@ -192,7 +192,6 @@ const HFModelFile: React.FC<HFModelFileProps> = forwardRef((props, ref) => {
       }
 
       const newList = generateGroupByFilename(list);
-      console.log('newList====', newList);
       const sortList = _.sortBy(newList, (item: any) => {
         return sortType === 'size' ? item.size : item.path;
       });
@@ -200,7 +199,6 @@ const HFModelFile: React.FC<HFModelFileProps> = forwardRef((props, ref) => {
       handleSelectModelFile(sortList[0]);
       setDataSource({ fileList: sortList, loading: false });
     } catch (error) {
-      console.log('error======', error);
       setDataSource({ fileList: [], loading: false });
       handleSelectModelFile({});
     }
@@ -246,9 +244,12 @@ const HFModelFile: React.FC<HFModelFileProps> = forwardRef((props, ref) => {
     fetchModelFiles: handleFetchModelFiles
   }));
 
-  // useEffect(() => {
-  //   handleFetchModelFiles();
-  // }, [props.selectedModel.name]);
+  useEffect(() => {
+    if (!props.selectedModel.name) {
+      setDataSource({ fileList: [], loading: false });
+      handleSelectModelFile({});
+    }
+  }, [props.selectedModel.name]);
 
   useEffect(() => {
     return () => {

src/pages/llmodels/components/instance-item.tsx

@@ -96,7 +96,7 @@ const InstanceItem: React.FC<InstanceItemProps> = ({
         <div>{workerIp}</div>
         <div>
           {intl.formatMessage({ id: 'models.table.gpuindex' })}: [
-          {_.join(item.gpu_indexes, ',')}]
+          {_.join(item.gpu_indexes?.sort?.(), ',')}]
         </div>
       </div>
     );
@@ -119,7 +119,7 @@ const InstanceItem: React.FC<InstanceItemProps> = ({
         worker_name: `${row.worker_name}`,
         worker_ip: `${row.worker_ip}`,
         port: row.port,
-        gpu_index: `${row.gpu_indexes} (main)`
+        gpu_index: `${row.gpu_indexes?.sort?.()} (main)`
       }
     ];
 

src/pages/llmodels/components/search-model.tsx

@@ -1,6 +1,6 @@
 import { BulbOutlined } from '@ant-design/icons';
 import { useIntl } from '@umijs/max';
-import { Select } from 'antd';
+import { Checkbox, Select } from 'antd';
 import _ from 'lodash';
 import React, { useCallback, useEffect, useRef, useState } from 'react';
 import { queryHuggingfaceModels, queryModelScopeModels } from '../apis';
@@ -22,7 +22,6 @@ interface SearchInputProps {
 }
 
 const SearchModel: React.FC<SearchInputProps> = (props) => {
-  console.log('SearchModel======');
   const intl = useIntl();
   const { modelSource, setLoadingModel, onSourceChange, onSelectModel } = props;
   const [dataSource, setDataSource] = useState<{
@@ -44,7 +43,7 @@ const SearchModel: React.FC<SearchInputProps> = (props) => {
   const cacheRepoOptions = useRef<any[]>([]);
   const axiosTokenRef = useRef<any>(null);
   const searchInputRef = useRef<any>('');
-  const filterGGUFRef = useRef<boolean>(true);
+  const filterGGUFRef = useRef<boolean | undefined>();
   const modelFilesSortOptions = useRef<any[]>([
     {
       label: intl.formatMessage({ id: 'models.sort.trending' }),
@@ -78,8 +77,7 @@ const SearchModel: React.FC<SearchInputProps> = (props) => {
         search: {
           query: searchInputRef.current || '',
           sort: sort,
-          // tags: filterGGUFRef.current ? ['gguf'] : [],
-          tags: ['gguf'],
+          tags: filterGGUFRef.current ? ['gguf'] : [],
           task
         }
       };
@@ -103,10 +101,8 @@ const SearchModel: React.FC<SearchInputProps> = (props) => {
   const getModelsFromModelscope = useCallback(async (sort: string) => {
     try {
       const params = {
-        // Name: filterGGUFRef.current
-        //   ? `${searchInputRef.current} gguf`
-        //   : searchInputRef.current || '',
-        Name: `${searchInputRef.current} gguf`,
+        Name: `${searchInputRef.current}`,
+        filterGGUF: filterGGUFRef.current,
         SortBy: ModelScopeSortType[sort]
       };
       const data = await queryModelScopeModels(params, {
@@ -233,13 +229,13 @@ const SearchModel: React.FC<SearchInputProps> = (props) => {
             </span>
           </span>
           <span>
-            {/* <Checkbox
+            <Checkbox
               onChange={handleFilterGGUFChange}
               className="m-r-5"
               checked={filterGGUFRef.current}
             >
               GGUF
-            </Checkbox> */}
+            </Checkbox>
             <Select
               allowClear
               value={dataSource.sortType}

src/pages/playground/components/ground-left.tsx

@@ -42,9 +42,7 @@ const GroundLeft: React.FC<MessageProps> = forwardRef((props, ref) => {
   const [systemMessage, setSystemMessage] = useState('');
   const [show, setShow] = useState(false);
   const [loading, setLoading] = useState(false);
-  const [activeIndex, setActiveIndex] = useState(-1);
   const [tokenResult, setTokenResult] = useState<any>(null);
-  const [currentIsFocus, setCurrentIsFocus] = useState(false);
   const [collapse, setCollapse] = useState(false);
   const contentRef = useRef<any>('');
   const controllerRef = useRef<any>(null);
@@ -92,7 +90,6 @@ const GroundLeft: React.FC<MessageProps> = forwardRef((props, ref) => {
     });
     setMessageId();
     setMessageList([...messageList]);
-    setActiveIndex(messageList.length - 1);
   };
 
   const joinMessage = (chunk: any) => {
@@ -252,7 +249,7 @@ const GroundLeft: React.FC<MessageProps> = forwardRef((props, ref) => {
     <div className="ground-left-wrapper">
       <div className="ground-left">
         <div
-          className="message-list-wrap"
+          className="message-list-wrap custome-scrollbar"
           onWheel={handleContentWheel}
           ref={scroller}
         >

src/pages/playground/style/prompt-modal.less

@@ -32,8 +32,7 @@
 
     .role {
       display: flex;
-      width: 60px;
-      flex-basis: 60px;
+      width: 50px;
       font-weight: var(--font-weight-bold);
       margin-bottom: 8px;
     }