feat: backend entrypoint

hibig · hibig · commit ad048a92edfb · 2025-12-19T14:40:20.000+08:00
diff --git a/src/components/alert-info/block.tsx b/src/components/alert-info/block.tsx
@@ -1,4 +1,8 @@
-import { WarningFilled } from '@ant-design/icons';
+import {
+  CheckCircleFilled,
+  LoadingOutlined,
+  WarningFilled
+} from '@ant-design/icons';
 import { Typography } from 'antd';
 import { createStyles } from 'antd-style';
 import classNames from 'classnames';
@@ -122,6 +126,17 @@ const AlertInfo: React.FC<AlertInfoProps> = (props) => {
     overlayScrollerProps = {}
   } = props;
   const { styles } = useStyles();
+
+  const renderIcon = () => {
+    if (type === 'transition') {
+      return <LoadingOutlined />;
+    }
+    if (type === 'success') {
+      return <CheckCircleFilled />;
+    }
+    return <WarningFilled />;
+  };
+
   return (
     <>
       {message ? (
@@ -139,7 +154,7 @@ const AlertInfo: React.FC<AlertInfoProps> = (props) => {
           >
             <div className={classNames('title', type)}>
               <span className={classNames('info-icon', type)}>
-                {icon ?? <WarningFilled />}
+                {icon ?? renderIcon()}
               </span>
             </div>
             {title && (
diff --git a/src/components/seal-form/seal-textarea.tsx b/src/components/seal-form/seal-textarea.tsx
@@ -102,7 +102,7 @@ const SealTextArea: React.FC<InputTextareaProps & SealFormItemProps> = (
     <InputWrapper>
       <Wrapper
         status={status}
-        label={<LabelWrapper>{label}</LabelWrapper>}
+        label={label && <LabelWrapper>{label}</LabelWrapper>}
         isFocus={alwaysFocus || isFocus}
         required={required}
         description={description}
diff --git a/src/components/seal-form/switch-input.tsx b/src/components/seal-form/switch-input.tsx
@@ -0,0 +1,75 @@
+import { Switch, Tooltip } from 'antd';
+import React, { useState } from 'react';
+import styled from 'styled-components';
+import LabelInfo from '../seal-form/components/label-info';
+
+const SwitchContainer = styled.div`
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  gap: 8px;
+  border: 1px solid var(--ant-color-border);
+  border-radius: var(--ant-border-radius);
+  padding: 12px 14px;
+  min-height: 54px;
+`;
+
+const LabelContainer = styled.div`
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+`;
+
+interface SwitchInputProps {
+  label?: React.ReactNode;
+  description?: string;
+  checked?: boolean;
+  defaultChecked?: boolean;
+  onChange?: (checked: boolean) => void;
+  children?: React.ReactNode;
+  style?: React.CSSProperties;
+  alwaysShowChildren?: boolean;
+  btnTips?: React.ReactNode;
+  size?: 'small' | 'default';
+}
+
+const SwitchInput: React.FC<SwitchInputProps> = (props) => {
+  const {
+    label,
+    description,
+    checked,
+    defaultChecked,
+    onChange,
+    children,
+    style,
+    alwaysShowChildren = true,
+    size,
+    btnTips
+  } = props;
+  const [internalChecked, setInternalChecked] = useState<boolean>(
+    defaultChecked || false
+  );
+
+  const handleChange = (checked: boolean) => {
+    setInternalChecked(checked);
+    onChange?.(checked);
+  };
+
+  return (
+    <SwitchContainer style={style}>
+      <LabelContainer>
+        <LabelInfo label={label} description={description} />
+        <Tooltip title={btnTips}>
+          <Switch
+            size={size}
+            checked={checked !== undefined ? checked : internalChecked}
+            onChange={handleChange}
+          />
+        </Tooltip>
+      </LabelContainer>
+      {(alwaysShowChildren || internalChecked) && children}
+    </SwitchContainer>
+  );
+};
+
+export default SwitchInput;
diff --git a/src/global.less b/src/global.less
@@ -203,7 +203,7 @@ body {
 
   // form item help
   .ant-form-item-with-help .ant-form-item-explain {
-    padding-left: 16px;
+    // padding-left: 16px;
   }
 
   // icon
diff --git a/src/locales/en-US/backends.ts b/src/locales/en-US/backends.ts
@@ -34,5 +34,9 @@ export default {
     'The custom backend name must end with "-custom".',
   'backend.quickConfig': 'Quick Config',
   'backend.version.default.not.exists':
-    'The default version does not exist in {versions}.'
+    'The default version does not exist in {versions}.',
+  'backend.replaceEntrypoint': 'Override Image Entrypoint',
+  'backend.entrypoint': 'Image Entrypoint',
+  'backend.entrypoint.tips':
+    'If specified, the ENTRYPOINT defined in the image will be ignored, and the command below will be used as the container startup entrypoint.'
 };
diff --git a/src/locales/en-US/clusters.ts b/src/locales/en-US/clusters.ts
@@ -89,8 +89,10 @@ Same applies to the <span class="bold-text">/opt/dtk</span> directory.`,
   'clusters.button.genToken':
     'Need to create a new token? Click <a href="{link}" target="_blank">here</a>.',
   'clusters.addworker.amdNotes-01': `If the <span class="bold-text">/opt/rocm</span> directory does not exist, please create a symbolic link pointing to the ROCm installed path: <span class="bold-text">ln -s /path/to/rocm /opt/rocm</span>.`,
-  'clusters.addworker.message.success':
-    '{count} workers have been added to the cluster.',
+  'clusters.addworker.message.success_single':
+    '{count} new worker has been added to the cluster.',
+  'clusters.addworker.message.success_multiple':
+    '{count} new workers have been added to the cluster.',
   'clusters.create.serverUrl': 'Server URL',
   'clusters.create.workerConfig': 'Worker Configuration',
   'clusters.addworker.containerName': 'Worker Container Name',
diff --git a/src/locales/ja-JP/backends.ts b/src/locales/ja-JP/backends.ts
@@ -34,5 +34,9 @@ export default {
     'The custom backend name must end with "-custom".',
   'backend.quickConfig': 'Quick Config',
   'backend.version.default.not.exists':
-    'The default version does not exist in {versions}.'
+    'The default version does not exist in {versions}.',
+  'backend.replaceEntrypoint': 'Override Image Entrypoint',
+  'backend.entrypoint': 'Image Entrypoint',
+  'backend.entrypoint.tips':
+    'If specified, the ENTRYPOINT defined in the image will be ignored, and the command below will be used as the container startup entrypoint.'
 };
diff --git a/src/locales/ja-JP/clusters.ts b/src/locales/ja-JP/clusters.ts
@@ -89,8 +89,10 @@ Same applies to the <span class="bold-text">/opt/dtk</span> directory.`,
   'clusters.button.genToken':
     'Need to create a new token? Click <a href="{link}" target="_blank">here</a>.',
   'clusters.addworker.amdNotes-01': `If the <span class="bold-text">/opt/rocm</span> directory does not exist, please create a symbolic link pointing to the ROCm installed path: <span class="bold-text">ln -s /path/to/rocm /opt/rocm</span>.`,
-  'clusters.addworker.message.success':
-    '{count} workers have been added to the cluster.',
+  'clusters.addworker.message.success_single':
+    '{count} new worker has been added to the cluster.',
+  'clusters.addworker.message.success_multiple':
+    '{count} new workers have been added to the cluster.',
   'clusters.create.serverUrl': 'Server URL',
   'clusters.create.workerConfig': 'Worker Configuration',
   'clusters.addworker.containerName': 'Worker Container Name',
@@ -179,11 +181,12 @@ Same applies to the <span class="bold-text">/opt/dtk</span> directory.`,
 // 71.  'clusters.addworker.cacheVolume': 'Model Cache Volume Mount',
 // 72.  'clusters.addworker.cacheVolume.tips': 'If you want to customize the model cache directory, you can specify the path to mount it.',
 // 73. 'clusters.addworker.cacheVolume.holder': 'e.g. /data/cache (path must start with /)',
-// 74. 'clusters.addworker.message.success': '{count} workers have been added to the cluster.',
-// 75. 'clusters.create.serverUrl': 'Server URL',
-// 76.  'clusters.create.workerConfig': 'Worker Configuration'
-// 75.  'clusters.addworker.containerName': 'Worker Container Name',
-// 76.  'clusters.addworker.containerName.tips':'Specify a name for the worker container.',
+// 74. 'clusters.addworker.message.success_single': '{count} new worker has been added to the cluster.',
+// 75. 'clusters.addworker.message.success_multiple': '{count} new workers have been added to the cluster.',
+// 76. 'clusters.create.serverUrl': 'Server URL',
+// 77.  'clusters.create.workerConfig': 'Worker Configuration'
+// 78.  'clusters.addworker.containerName': 'Worker Container Name',
+// 79.  'clusters.addworker.containerName.tips':'Specify a name for the worker container.',
 // 77. 'clusters.addworker.dataVolume': 'GPUStack Data Volume',
 // 78.  'clusters.addworker.dataVolume.tips': 'Specify a data storage path for GPUStack.',
 // 79.  'clusters.table.ip.internal': 'Internal',
diff --git a/src/locales/ru-RU/backends.ts b/src/locales/ru-RU/backends.ts
@@ -34,9 +34,17 @@ export default {
     'Пользовательское название бэкенда должно оканчиваться на «-custom».',
   'backend.quickConfig': 'Быстрая настройка',
   'backend.version.default.not.exists':
-    'The default version does not exist in {versions}.'
+    'The default version does not exist in {versions}.',
+  'backend.replaceEntrypoint': 'Override Image Entrypoint',
+  'backend.entrypoint': 'Image Entrypoint',
+  'backend.entrypoint.tips':
+    'If specified, the ENTRYPOINT defined in the image will be ignored, and the command below will be used as the container startup entrypoint.'
 };
 
 // ========== To-Do: Translate Keys (Remove After Translation) ==========
-// 1. 'backend.version.default.not.exists': 'The default version does not exist in {versions}.'
+// 1. 'backend.version.default.not.exists': 'The default version does not exist in {versions}.',
+// 2. 'backend.replaceEntrypoint': 'Override Image Entrypoint',
+// 3. 'backend.entrypoint': 'Image Entrypoint',
+// 4. 'backend.entrypoint.tips':
+//    'If specified, the ENTRYPOINT defined in the image will be ignored, and the command below will be used as the container startup entrypoint.'
 // ========== End of To-Do List ==========
diff --git a/src/locales/ru-RU/clusters.ts b/src/locales/ru-RU/clusters.ts
@@ -89,8 +89,10 @@ export default {
   'clusters.button.genToken':
     'Need to create a new token? Click <a href="{link}" target="_blank">here</a>.',
   'clusters.addworker.amdNotes-01': `If the <span class="bold-text">/opt/rocm</span> directory does not exist, please create a symbolic link pointing to the ROCm installed path: <span class="bold-text">ln -s /path/to/rocm /opt/rocm</span>.`,
-  'clusters.addworker.message.success':
-    '{count} workers have been added to the cluster.',
+  'clusters.addworker.message.success_single':
+    '{count} new worker has been added to the cluster.',
+  'clusters.addworker.message.success_multiple':
+    '{count} new workers have been added to the cluster.',
   'clusters.create.serverUrl': 'Server URL',
   'clusters.create.workerConfig': 'Worker Configuration',
   'clusters.addworker.containerName': 'Worker Container Name',
@@ -110,13 +112,14 @@ export default {
 // 2. 'clusters.button.genToken': 'Need to create a new token? Click <a href="{link}" target="_blank">here</a>.',
 // 3. 'clusters.addworker.cacheVolume': 'Model Cache Volume Mount',
 // 4. 'clusters.addworker.cacheVolume.tips': 'If you want to customize the model cache directory, you can specify the path to mount it.',
-// 5. 'clusters.addworker.message.success': '{count} workers have been added to the cluster.',
-// 6. 'clusters.create.serverUrl': 'Server URL',
-// 7. 'clusters.create.workerConfig': 'Worker Configuration'
-// 6. 'clusters.addworker.containerName': 'Worker Container Name',
-// 7. 'clusters.addworker.containerName.tips':'Specify a name for the worker container.',
-// 8. 'clusters.addworker.dataVolume': 'GPUStack Data Volume',
-// 9. 'clusters.addworker.dataVolume.tips': 'Specify a data storage path for GPUStack.',
+// 5. 'clusters.addworker.message.success_single': '{count} new worker has been added to the cluster.',
+// 6. 'clusters.addworker.message.success_multiple': '{count} new workers have been added to the cluster.',
+// 7. 'clusters.create.serverUrl': 'Server URL',
+// 8. 'clusters.create.workerConfig': 'Worker Configuration'
+// 9. 'clusters.addworker.containerName': 'Worker Container Name',
+// 10. 'clusters.addworker.containerName.tips':'Specify a name for the worker container.',
+// 11. 'clusters.addworker.dataVolume': 'GPUStack Data Volume',
+// 12. 'clusters.addworker.dataVolume.tips': 'Specify a data storage path for GPUStack.',
 // 10. 'clusters.table.ip.internal': 'Internal',
 // 11. 'clusters.table.ip.external': 'External',
 // 12. 'clusters.form.serverUrl.tips': 'Specify the server URL accessible from your cloud provider.'
diff --git a/src/locales/zh-CN/backends.ts b/src/locales/zh-CN/backends.ts
@@ -31,5 +31,9 @@ export default {
   'backend.version.no.tips': '内置后端自定义版本名称必须以 "-custom" 结尾。',
   'backend.backend.rules.custom': '自定义后端名称须以 "-custom" 结尾。',
   'backend.quickConfig': '快速配置',
-  'backend.version.default.not.exists': '默认版本不存在于 {versions}。'
+  'backend.version.default.not.exists': '默认版本不存在于 {versions}。',
+  'backend.replaceEntrypoint': '覆盖镜像入口命令',
+  'backend.entrypoint': '镜像入口命令',
+  'backend.entrypoint.tips':
+    '如指定，镜像中定义的 ENTRYPOINT 将被忽略，下面的命令将作为容器启动入口命令使用。'
 };
diff --git a/src/locales/zh-CN/clusters.ts b/src/locales/zh-CN/clusters.ts
@@ -88,7 +88,10 @@ export default {
     '需要创建令牌？点击<a href="{link}" target="_blank">这里</a>。',
   'clusters.addworker.amdNotes-01':
     '如果 <span class="bold-text">/opt/rocm</span> 目录不存在，请创建一个指向已安装 ROCm 路径的符号链接：<span class="bold-text">ln -s /path/to/rocm /opt/rocm</span>。',
-  'clusters.addworker.message.success': '已将 {count} 个工作节点添加到集群中。',
+  'clusters.addworker.message.success_single':
+    '已将 {count} 个新节点添加到集群中。',
+  'clusters.addworker.message.success_multiple':
+    '已将 {count} 个新节点添加到集群中。',
   'clusters.create.serverUrl': '服务器地址',
   'clusters.create.workerConfig': '节点配置',
   'clusters.addworker.containerName': '节点容器名称',
diff --git a/src/pages/backends/components/add-modal.tsx b/src/pages/backends/components/add-modal.tsx
@@ -84,7 +84,8 @@ const AddModal: React.FC<AddModalProps> = (props) => {
           acc[curr.version_no] = {
             custom_framework: curr.custom_framework,
             image_name: curr.image_name,
-            run_command: curr.run_command
+            run_command: curr.run_command,
+            entrypoint: curr.entrypoint
           };
         }
         return acc;
diff --git a/src/pages/backends/config/types.ts b/src/pages/backends/config/types.ts
@@ -4,6 +4,7 @@ export interface VersionConfigs {
   is_default: boolean;
   built_in_frameworks?: string[];
   custom_framework?: string;
+  entrypoint?: string;
   version_no?: string;
   is_built_in?: boolean;
 }
diff --git a/src/pages/backends/forms/versions-config.tsx b/src/pages/backends/forms/versions-config.tsx
@@ -2,6 +2,7 @@ import CollapsibleContainer from '@/components/collapse-container';
 import BaseSelect from '@/components/seal-form/base/select';
 import SealInput from '@/components/seal-form/seal-input';
 import SealSelect from '@/components/seal-form/seal-select';
+import SealTextArea from '@/components/seal-form/seal-textarea';
 import { PageActionType } from '@/config/types';
 import useAppUtils from '@/hooks/use-app-utils';
 import { MinusOutlined, PlusOutlined } from '@ant-design/icons';
@@ -342,14 +343,36 @@ const VersionsForm: React.FC<AddModalProps> = ({
                       required
                     />
                   </Form.Item>
+                  <Form.Item name={[name, 'entrypoint']}>
+                    <SealInput.TextArea
+                      allowClear
+                      description={intl.formatMessage({
+                        id: 'backend.entrypoint.tips'
+                      })}
+                      label={intl.formatMessage({
+                        id: 'backend.replaceEntrypoint'
+                      })}
+                    ></SealInput.TextArea>
+                  </Form.Item>
                   <Form.Item
                     name={[name, 'run_command']}
                     style={{ marginBottom: 0 }}
                   >
-                    <SealInput.TextArea
+                    <SealTextArea
                       allowClear
+                      alwaysFocus={true}
+                      description={intl.formatMessage({
+                        id: 'backend.form.defaultExecuteCommand.tips'
+                      })}
+                      placeholder={intl.formatMessage(
+                        { id: 'common.help.eg' },
+                        {
+                          content:
+                            'vllm serve {{model_path}} --port {{port}} --host {{worker_ip}} --served-model-name {{model_name}}'
+                        }
+                      )}
                       label={intl.formatMessage({ id: 'backend.runCommand' })}
-                    ></SealInput.TextArea>
+                    ></SealTextArea>
                   </Form.Item>
                 </CollapsibleContainer>
               </div>
diff --git a/src/pages/cluster-management/components/add-worker/add-worker-context.ts b/src/pages/cluster-management/components/add-worker/add-worker-context.ts
@@ -8,6 +8,8 @@ interface AddWorkerContextProps {
   clusterLoading?: boolean;
   provider: ProviderType;
   stepList: string[];
+  actionSource?: 'modal' | 'page';
+  onCancel?: () => void;
   onClusterChange?: (value: number, row?: any) => void;
   collapseKey: Set<string>;
   onToggle: (open: boolean, key: string) => void;
diff --git a/src/pages/cluster-management/components/add-worker/add-worker-step.tsx b/src/pages/cluster-management/components/add-worker/add-worker-step.tsx
diff --git a/src/pages/cluster-management/components/add-worker/index.tsx b/src/pages/cluster-management/components/add-worker/index.tsx
diff --git a/src/pages/cluster-management/components/add-worker/step-collapse.tsx b/src/pages/cluster-management/components/add-worker/step-collapse.tsx
diff --git a/src/pages/cluster-management/step-forms/advance-config.tsx b/src/pages/cluster-management/step-forms/advance-config.tsx
diff --git a/src/pages/llmodels/components/compatible-alert.tsx b/src/pages/llmodels/components/compatible-alert.tsx

Original file line number	Diff line number	Diff line change
`@@ -203,7 +203,7 @@ body {`
`203`	`203`
`204`	`204`	`// form item help`
`205`	`205`	`.ant-form-item-with-help .ant-form-item-explain {`
`206`		`- padding-left: 16px;`
	`206`	`+ // padding-left: 16px;`
`207`	`207`	`}`
`208`	`208`
`209`	`209`	`// icon`