style: add model selection tips in playground

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

@@ -19,7 +19,7 @@ import {
   queryHuggingfaceModelFiles,
   queryModelScopeModelFiles
 } from '../apis';
-import { modelSourceMap } from '../config';
+import { backendOptionsMap, modelSourceMap } from '../config';
 import '../style/hf-model-file.less';
 import ModelFileItem from './model-file-item';
 import TitleWrapper from './title-wrapper';
@@ -228,6 +228,7 @@ const HFModelFile: React.FC<HFModelFileProps> = forwardRef((props, ref) => {
     try {
       const evaluateFileList = list.map((item: any) => {
         return {
+          backend: backendOptionsMap.llamaBox,
           source: modelSource,
           ...(modelSource === modelSourceMap.huggingface_value
             ? {

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

@@ -207,8 +207,19 @@ const SearchModel: React.FC<SearchInputProps> = (props) => {
     try {
       const repoList = list.map((item) => {
         const res = handleRecognizeAudioModel(item, modelSource);
+        let backendObj = {};
+        if (res.isAudio) {
+          backendObj = {
+            backend: backendOptionsMap.voxBox
+          };
+        } else if (item.isGGUF) {
+          // backendObj = {
+          //   backend: backendOptionsMap.llamaBox
+          // };
+        }
+
         return {
-          ...(res.isAudio ? { backend: backendOptionsMap.voxBox } : {}),
+          ...backendObj,
           source: modelSource,
           ...(modelSource === modelSourceMap.huggingface_value
             ? {

src/pages/llmodels/hooks/index.ts

@@ -431,10 +431,6 @@ export const useCheckCompatibility = () => {
     const { scheduleType } = allValues;
     const gpuIds = allValues.gpu_selector?.gpu_ids || [];
 
-    if (scheduleType === 'manual') {
-      return !gpuIds.length;
-    }
-
     const noLocalValue =
       allValues.source === modelSourceMap.local_path_value &&
       !allValues.local_path;
@@ -443,6 +439,10 @@ export const useCheckCompatibility = () => {
       allValues.source === modelSourceMap.ollama_library_value &&
       !allValues.ollama_library_model_name;
 
+    if (scheduleType === 'manual') {
+      return !gpuIds.length || noLocalValue || noOllamaValue;
+    }
+
     return noLocalValue || noOllamaValue;
   };
 
@@ -455,6 +455,7 @@ export const useCheckCompatibility = () => {
     if (_.isEqual(cacheFormValuesRef.current, allValues)) {
       return;
     }
+
     if (checkRequiredValue(allValues)) {
       setWarningStatus({
         show: false,

src/pages/playground/components/dynamic-params.tsx

@@ -174,6 +174,9 @@ const ParamsSettings: React.FC<ParamsSettingsProps> = forwardRef(
                   ]}
                 >
                   <SealSelect
+                    description={intl.formatMessage({
+                      id: 'playground.model.noavailable.tips2'
+                    })}
                     onChange={handleOnModelChange}
                     showSearch={true}
                     options={modelList}

src/pages/resources/components/model-files.tsx

@@ -97,6 +97,13 @@ const PathWrapper = styled.div`
   }
 `;
 
+const OverlayScrollerWrapper = styled.div`
+  .overlay-scroller-wrapper {
+    padding-block: 0;
+    padding-inline: 6px 0;
+  }
+`;
+
 const ItemWrapper = styled.ul`
   max-width: 300px;
   margin: 0;
@@ -331,7 +338,11 @@ const ModelFiles = () => {
 
     return (
       <Tooltip
-        title={<OverlayScroller>{renderItem()}</OverlayScroller>}
+        title={
+          <OverlayScrollerWrapper>
+            <OverlayScroller>{renderItem()}</OverlayScroller>
+          </OverlayScrollerWrapper>
+        }
         overlayInnerStyle={{ width: 'max-content', maxWidth: 300 }}
       >
         <FilesTag color="purple" icon={<InfoCircleOutlined />}>

src/pages/resources/components/workers.tsx

@@ -246,8 +246,7 @@ const Workers: React.FC = () => {
                   style={{
                     display: 'flex',
                     flexWrap: 'wrap',
-                    gap: 6,
-                    maxWidth: 200
+                    gap: 6
                   }}
                 >
                   {_.map(record.labels, (value: any, key: string) => {
@@ -255,7 +254,7 @@ const Workers: React.FC = () => {
                       <AutoTooltip
                         key={key}
                         className="m-r-0"
-                        maxWidth={120}
+                        maxWidth={155}
                         style={{
                           paddingInline: 8,
                           borderRadius: 12