style: hidden expand button when no replicas

.prettierignore

@@ -2,4 +2,8 @@ node_modules
 .umi
 .umi-production
 public/static/*.js
-public/static/*.css
+public/static/*.css
+src/components/icon-font/iconfont/iconfont.js
+src/components/icon-font/iconfont/*.css
+
+

src/components/auto-tooltip/index.tsx

@@ -104,7 +104,7 @@ const AutoTooltip: React.FC<AutoTooltipProps> = ({
             {children}
           </TitleTip>
         ) : (
-          ''
+          false
         )
       }
       {...tooltipProps}

src/components/seal-table/components/row-prefix.tsx

@@ -1,13 +1,26 @@
 import IconFont from '@/components/icon-font';
 import { Button, Checkbox } from 'antd';
+import classNames from 'classnames';
 import _ from 'lodash';
-import React from 'react';
+import React, { useMemo } from 'react';
+import styled from 'styled-components';
+
+const ButtonWrapper = styled.div`
+  width: 30px;
+  margin-right: 5px;
+  &.disable-expand {
+    .ant-btn {
+      display: none;
+    }
+  }
+`;
 
 interface RowPrefixProps {
   expandable?: boolean | React.ReactNode;
   enableSelection?: boolean;
   expanded?: boolean;
   checked?: boolean;
+  disableExpand?: boolean;
   handleRowExpand?: () => void;
   handleSelectChange?: (e: any) => void;
 }
@@ -18,26 +31,33 @@ const RowPrefix: React.FC<RowPrefixProps> = (props) => {
     enableSelection,
     expanded,
     checked,
+    disableExpand,
     handleRowExpand,
     handleSelectChange
   } = props;
 
+  const isExpanded = useMemo(() => {
+    return expanded;
+  }, [expanded]);
+
   if (expandable && enableSelection) {
     return (
       <div className="row-prefix-wrapper">
-        <span style={{ marginRight: 5 }}>
+        <ButtonWrapper
+          className={classNames({ 'disable-expand': disableExpand })}
+        >
           {_.isBoolean(expandable) ? (
             <Button type="text" size="small" onClick={handleRowExpand}>
               <IconFont
                 type="icon-down"
-                rotate={expanded ? 0 : -90}
+                rotate={isExpanded ? 0 : -90}
                 className="size-14"
               ></IconFont>
             </Button>
           ) : (
             expandable
           )}
-        </span>
+        </ButtonWrapper>
         <Checkbox onChange={handleSelectChange} checked={checked}></Checkbox>
       </div>
     );
@@ -45,17 +65,26 @@ const RowPrefix: React.FC<RowPrefixProps> = (props) => {
   if (expandable) {
     return (
       <div className="row-prefix-wrapper">
-        {_.isBoolean(expandable) ? (
-          <Button type="text" size="small" onClick={handleRowExpand}>
-            <IconFont
-              type="icon-down"
-              rotate={expanded ? 0 : -90}
-              className="size-14"
-            ></IconFont>
-          </Button>
-        ) : (
-          expandable
-        )}
+        <ButtonWrapper
+          className={classNames({ 'disable-expand': disableExpand })}
+        >
+          {_.isBoolean(expandable) ? (
+            <Button
+              type="text"
+              size="small"
+              onClick={handleRowExpand}
+              disabled={disableExpand}
+            >
+              <IconFont
+                type="icon-down"
+                rotate={isExpanded ? 0 : -90}
+                className="size-14"
+              ></IconFont>
+            </Button>
+          ) : (
+            expandable
+          )}
+        </ButtonWrapper>
       </div>
     );
   }

src/components/seal-table/components/table-row.tsx

@@ -42,6 +42,7 @@ const TableRow: React.FC<
   const tableContext: any = React.useContext<{
     allChildren?: any[];
     allSubChildren?: any[];
+    setDisableExpand?: (record: any) => boolean;
   }>(TableContext);
   const { setChunkRequest } = useSetChunkRequest();
   const [childrenData, setChildrenData] = useState<any[]>([]);
@@ -206,6 +207,10 @@ const TableRow: React.FC<
     }
   };
 
+  const disableExpand = useMemo(() => {
+    return tableContext.setDisableExpand?.(record);
+  }, [tableContext.setDisableExpand, record]);
+
   useEffect(() => {
     const handleVisibilityChange = async () => {
       if (document.visibilityState === 'hidden') {
@@ -249,6 +254,7 @@ const TableRow: React.FC<
             checked={checked}
             handleRowExpand={handleRowExpand}
             handleSelectChange={handleSelectChange}
+            disableExpand={disableExpand}
           ></RowPrefix>
           <Row className="seal-table-row">
             {columns?.map((columnProps) => {

src/global.less

@@ -828,7 +828,7 @@ body {
 
 .ant-tooltip-content {
   .ant-tooltip-inner {
-    width: max-content;
+    width: fit-content;
     max-width: 300px;
 
     .text-tertiary {

src/locales/en-US/models.ts

@@ -64,7 +64,8 @@ export default {
     'Non-GGUF models use vox-box for audio and vLLM(x86 Linux only) for others.',
   'models.search.voxbox.tips':
     'To deploy an audio model, uncheck the checkbox.',
-  'models.form.ollamalink': 'Find More in Ollama Library',
+  'models.form.ollamalink':
+    'Find More in  <a href="https://www.ollama.com/library" target="_blank">Ollama Library</a>.',
   'models.form.backend_parameters.llamabox.placeholder':
     'e.g., --ctx-size=8192',
   'models.form.backend_parameters.vllm.placeholder':

src/locales/ja-JP/models.ts

@@ -64,7 +64,8 @@ export default {
     '非GGUFモデルは、音声にはvox-boxを、その他にはvLLM（x86 Linuxのみ）を使用します。',
   'models.search.voxbox.tips':
     '音声モデルをデプロイするには、GGUFチェックボックスをオフにしてください。',
-  'models.form.ollamalink': 'Ollamaライブラリでさらに探す',
+  'models.form.ollamalink':
+    '<a href="https://www.ollama.com/library" target="_blank">Ollama</a>ライブラリでさらに探す',
   'models.form.backend_parameters.llamabox.placeholder': '例: --ctx-size=8192',
   'models.form.backend_parameters.vllm.placeholder': '例: --max-model-len=8192',
   'models.form.backend_parameters.vllm.tips': '詳細な{backend}パラメータ情報',

src/locales/ru-RU/models.ts

@@ -64,7 +64,8 @@ export default {
     'Не-GGUF модели используют vox-box для аудио и vLLM (только x86 Linux) для остальных.',
   'models.search.voxbox.tips':
     'Для развертывания аудиомодели снимите отметку GGUF.',
-  'models.form.ollamalink': 'Больше моделей в библиотеке Ollama',
+  'models.form.ollamalink':
+    'Больше моделей в библиотеке <a href="https://www.ollama.com/library" target="_blank">Ollama</a>',
   'models.form.backend_parameters.llamabox.placeholder':
     'например: --ctx-size=8192',
   'models.form.backend_parameters.vllm.placeholder':

src/locales/zh-CN/models.ts

@@ -64,7 +64,8 @@ export default {
   'models.search.vllm.tips':
     ' 非 GGUF 的语音模型用 vox-box，其它非 GGUF 的模型用 vLLM（仅支持 x86 Linux）。',
   'models.search.voxbox.tips': '若需部署语音模型取消勾选。',
-  'models.form.ollamalink': '在 Ollama Library 中查找',
+  'models.form.ollamalink':
+    '在 <a href="https://www.ollama.com/library" target="_blank">Ollama Library</a> 中查找',
   'models.form.backend_parameters.llamabox.placeholder':
     '例如，--ctx-size=8192',
   'models.form.backend_parameters.vllm.placeholder':

src/pages/llmodels/forms/ollama_library.tsx

@@ -1,8 +1,7 @@
-import IconFont from '@/components/icon-font';
 import SealAutoComplete from '@/components/seal-form/auto-complete';
 import useAppUtils from '@/hooks/use-app-utils';
 import { useIntl } from '@umijs/max';
-import { Form, Typography } from 'antd';
+import { Form } from 'antd';
 import React from 'react';
 import { modelSourceMap, ollamaModelOptions } from '../config';
 import { useFormContext, useFormInnerContext } from '../config/form-context';
@@ -50,21 +49,11 @@ const OllamaForm: React.FC = () => {
           onSelect={handleModelNameChange}
           onBlur={handleOnBlur}
           description={
-            <span>
-              <span>
-                {intl.formatMessage({ id: 'models.form.ollamalink' })}
-              </span>
-              <Typography.Link
-                className="flex-center"
-                href="https://www.ollama.com/library"
-                target="_blank"
-              >
-                <IconFont
-                  type="icon-external-link"
-                  className="font-size-14"
-                ></IconFont>
-              </Typography.Link>
-            </span>
+            <span
+              dangerouslySetInnerHTML={{
+                __html: intl.formatMessage({ id: 'models.form.ollamalink' })
+              }}
+            ></span>
           }
           label={intl.formatMessage({ id: 'model.form.ollama.model' })}
           placeholder={intl.formatMessage({ id: 'model.form.ollamaholder' })}

src/pages/llmodels/index.tsx

@@ -389,6 +389,10 @@ const Models: React.FC = () => {
     };
   }, []);
 
+  const setDisableExpand = useCallback((record: any) => {
+    return !record?.replicas;
+  }, []);
+
   useEffect(() => {
     const handleVisibilityChange = async () => {
       if (document.visibilityState === 'visible') {
@@ -419,7 +423,8 @@ const Models: React.FC = () => {
   return (
     <TableContext.Provider
       value={{
-        allChildren: modelInstances
+        allChildren: modelInstances,
+        setDisableExpand: setDisableExpand
       }}
     >
       <TableList

src/pages/resources/components/styles/installation.less

@@ -17,7 +17,7 @@
   }
 
   .code-pre {
-    white-space: pre-line;
+    white-space: pre-line !important;
   }
 
   .ant-radio-button-wrapper {