fix: add worker ux when only DO cluster

This commit is contained in:
jialin
2026-01-08 09:26:55 +08:00
parent d35bd16543
commit ba4f277863
12 changed files with 55 additions and 38 deletions
+1 -1
View File
@@ -39,7 +39,7 @@ const useStyles = createStyles(({ css, token }) => {
return {
title: css`
font-weight: 400;
height: 56px;
min-height: 56px;
font-size: var(--font-size-base);
display: flex;
justify-content: space-between;
+2 -2
View File
@@ -62,7 +62,7 @@ export default {
'If device detection fails, try removing <span class="bold-text">--env ROCM_SMI_LIB_PATH=/opt/hyhal/lib</span>.',
'clusters.addworker.selectCluster': 'Select Cluster',
'clusters.addworker.selectCluster.tips':
'For non-Docker clusters, please register clusters or manage worker pools from the Clusters page.',
'For <span class="bold-text">non-Docker</span> clusters, please register clusters or manage worker pools from the Clusters page.',
'clusters.addworker.selectGPU': 'Select GPU Vendor',
'clusters.addworker.checkEnv': 'Check Environment',
'clusters.addworker.specifyArgs': 'Specify Arguments',
@@ -116,7 +116,7 @@ export default {
'Specify the server URL accessible from your cloud provider.',
'clusters.form.setDefault': 'Set as Default',
'clusters.form.setDefault.tips': 'Default for deployment.',
'clusters.addworker.noClusters': 'No available clusters',
'clusters.addworker.noClusters': 'No available Docker clusters found',
'clusters.create.steps.complete.tips': 'Cluster created successfully!',
'clusters.create.steps.complete': 'Complete',
'clusters.create.steps.configure': 'Configure',
+4 -4
View File
@@ -62,7 +62,7 @@ export default {
'If device detection fails, try removing <span class="bold-text">--env ROCM_SMI_LIB_PATH=/opt/hyhal/lib</span>.',
'clusters.addworker.selectCluster': 'Select Cluster',
'clusters.addworker.selectCluster.tips':
'For non-Docker clusters, please register clusters or manage worker pools from the Clusters page.',
'For <span class="bold-text">non-Docker</span> clusters, please register clusters or manage worker pools from the Clusters page.',
'clusters.addworker.selectGPU': 'Select GPU Vendor',
'clusters.addworker.checkEnv': 'Check Environment',
'clusters.addworker.specifyArgs': 'Specify Arguments',
@@ -116,7 +116,7 @@ export default {
'Specify the server URL accessible from your cloud provider.',
'clusters.form.setDefault': 'Set as Default',
'clusters.form.setDefault.tips': 'Default for deployment.',
'clusters.addworker.noClusters': 'No available clusters',
'clusters.addworker.noClusters': 'No available Docker clusters found',
'clusters.create.steps.complete.tips': 'Cluster created successfully!',
'clusters.create.steps.complete': 'Complete',
'clusters.create.steps.configure': 'Configure',
@@ -180,7 +180,7 @@ export default {
// 49. 'clusters.addworker.cambriconNotes': 'If the <span class="bold-text">/usr/local/neuware</span> directory does not exist, create a symbolic link to the Cambricon installation path: <span class="bold-text">ln -s /path/to/neuware /usr/local/neuware</span>.'
// 50. 'clusters.addworker.hygonNotes-02': 'If device detection fails, try removing <span class="bold-text">--env ROCM_SMI_LIB_PATH=/opt/hyhal/lib</span>.',
// 51. 'clusters.addworker.selectCluster': 'Select Cluster',
// 52. 'clusters.addworker.selectCluster.tips': 'For non-Docker clusters, please register clusters or manage worker pools from the Clusters page.',
// 52. 'clusters.addworker.selectCluster.tips': 'For <span class="bold-text">non-Docker</span> clusters, please register clusters or manage worker pools from the Clusters page.',
// 53. 'clusters.addworker.selectGPU': 'Select GPU Vendor',
// 54. 'clusters.addworker.checkEnv': 'Check Environment',
// 55. 'clusters.addworker.specifyArgs': 'Specify Arguments',
@@ -219,7 +219,7 @@ export default {
// 84. 'clusters.form.setDefault.tips': 'Default for deployment',
// 85. 'clusters.addworker.enterWorkerAddress': 'Enter worker external address',
// 86. 'clusters.addworker.enterWorkerAddress.error': 'Please enter the worker external address.',
// 87. 'clusters.addworker.noClusters': 'No available clusters',
// 87. 'clusters.addworker.noClusters': 'No available Docker clusters found',
// 88. 'clusters.create.steps.complete.tips': 'Cluster created successfully!',
// 89. 'clusters.create.steps.complete': 'Complete',
// 90. 'clusters.create.dockerTips1': 'Next, add worker to this cluster.',
+3 -3
View File
@@ -62,7 +62,7 @@ export default {
'Если не удается обнаружить устройства, попробуйте удалить <span class="bold-text">--env ROCM_SMI_LIB_PATH=/opt/hyhal/lib</span>.',
'clusters.addworker.selectCluster': 'Выбрать кластер',
'clusters.addworker.selectCluster.tips':
'Для не-Docker кластеров, пожалуйста, регистрируйте кластеры или управляйте пулами воркеров на странице Кластеры.',
'Для <span class="bold-text">не-Docker</span> кластеров, пожалуйста, регистрируйте кластеры или управляйте пулами воркеров на странице Кластеры.',
'clusters.addworker.selectGPU': 'Выбрать производителя GPU',
'clusters.addworker.checkEnv': 'Проверить окружение',
'clusters.addworker.specifyArgs': 'Указать аргументы',
@@ -117,7 +117,7 @@ export default {
'clusters.form.setDefault': 'Установить по умолчанию',
'clusters.form.setDefault.tips':
'Использовать по умолчанию для развертывания.',
'clusters.addworker.noClusters': 'No available clusters',
'clusters.addworker.noClusters': 'No available Docker clusters found',
'clusters.create.steps.complete.tips': 'Cluster created successfully!',
'clusters.create.steps.complete': 'Complete',
'clusters.create.steps.configure': 'Configure',
@@ -131,7 +131,7 @@ export default {
// ========== To-Do: Translate Keys (Remove After Translation) ==========
// 1. 'clusters.addworker.hygonNotes': `If <span class="bold-text">/opt/hyhal</span> or <span class="bold-text">/opt/dtk</span> does not exist, create symbolic links pointing to the corresponding Hygon installation paths, for example: <span class="desc-fill">ln -s /path/to/hyhal /opt/hyhal</span> <span class="desc-fill">ln -s /path/to/dtk /opt/dtk</span>.`,
// 2. 'clusters.addworker.noClusters': 'No available clusters',
// 2. 'clusters.addworker.noClusters': 'No available Docker clusters found',
// 3. 'clusters.create.steps.complete.tips': 'Cluster created successfully!',
// 4. 'clusters.create.steps.complete': 'Complete',
// 5. 'clusters.create.dockerTips1': 'Next, add worker to this cluster.',
+2 -2
View File
@@ -62,7 +62,7 @@ export default {
'如果未能检测到设备,请尝试移除 <span class="bold-text">--env ROCM_SMI_LIB_PATH=/opt/hyhal/lib</span>。',
'clusters.addworker.selectCluster': '选择集群',
'clusters.addworker.selectCluster.tips':
'非 Docker 集群请前往集群页面注册集群或管理节点池。',
'<span class="bold-text">非 Docker</span> 集群请前往集群页面注册集群或管理节点池。',
'clusters.addworker.selectGPU': '选择 GPU 厂商',
'clusters.addworker.checkEnv': '检查环境',
'clusters.addworker.specifyArgs': '指定参数',
@@ -113,7 +113,7 @@ export default {
'clusters.form.serverUrl.tips': '指定可从您的云服务提供商访问的服务器地址。',
'clusters.form.setDefault': '设为默认',
'clusters.form.setDefault.tips': '部署时的默认集群。',
'clusters.addworker.noClusters': '无可用集群',
'clusters.addworker.noClusters': '无可用的 Docker 集群',
'clusters.create.steps.complete.tips': '集群创建成功!',
'clusters.create.steps.complete': '完成',
'clusters.create.steps.configure': '配置',
@@ -236,8 +236,12 @@ const ClusterCreate: React.FC<{
// add worker or cluster registration step
const handleAddWorker = () => {
const currentTitle =
extraData.provider === ProviderValueMap.Docker
? 'resources.button.create'
: 'clusters.button.register';
setIsAddWorkerStep(true);
setCurrentTitle?.(intl.formatMessage({ id: 'resources.button.create' }));
setCurrentTitle?.(intl.formatMessage({ id: currentTitle }));
onNext();
};
@@ -32,7 +32,7 @@ const ClusterModal: React.FC<ClusterModalProps> = ({
body: {
paddingBlock: 0
},
wrapper: { width: 700 }
wrapper: { width: 710 }
}}
footer={false}
>
@@ -52,7 +52,7 @@ const AddCluster: React.FC<AddModalProps> = ({
open={open}
onCancel={handleCancel}
onSubmit={handleSubmit}
width={700}
width={710}
>
<ClusterForm
ref={form}
@@ -1,6 +1,4 @@
import AlertBlockInfo from '@/components/alert-info/block';
import useAddWorkerMessage from '@/pages/cluster-management/hooks/use-add-worker-message';
import { ExclamationCircleFilled } from '@ant-design/icons';
import { useIntl } from '@umijs/max';
import { Alert } from 'antd';
import React, { useMemo } from 'react';
@@ -135,18 +133,6 @@ const AddWorkerSteps: React.FC<AddWorkerProps> = (props) => {
{stepList.includes(StepNamesMap.SelectCluster) && (
<SelectCluster disabled={disabled}></SelectCluster>
)}
{stepList.includes(StepNamesMap.SelectCluster) &&
!clusterList?.length && (
<AlertBlockInfo
maxHeight={200}
style={{ marginBottom: 8 }}
type="warning"
icon={<ExclamationCircleFilled />}
message={intl.formatMessage({
id: 'resources.worker.noCluster.tips'
})}
></AlertBlockInfo>
)}
{/* render the steps only when there is at least one cluster available or cluster selection is not required */}
{((clusterList && clusterList.length > 0) ||
!stepList.includes(StepNamesMap.SelectCluster)) && (
@@ -131,7 +131,7 @@ const AddWorker: React.FC<AddWorkerProps> = (props) => {
body: {
paddingBlock: 0
},
wrapper: { width: 700 }
wrapper: { width: 710 }
}}
footer={false}
>
@@ -50,11 +50,24 @@ const SelectCluster: React.FC<AddWorkerStepProps> = ({ disabled }) => {
{stepIndex}.{' '}
{intl.formatMessage({ id: 'clusters.addworker.selectCluster' })}
</Title>
<span style={{ color: 'var(--ant-color-text-tertiary)' }}>
{intl.formatMessage({
id: 'clusters.addworker.selectCluster.tips'
})}
</span>
<Typography.Paragraph
type="secondary"
style={{
marginBottom: 0,
whiteSpace: 'pre-wrap',
lineHeight: 1.2,
paddingBlock: 4
}}
ellipsis={{ rows: 2 }}
>
<span
dangerouslySetInnerHTML={{
__html: intl.formatMessage({
id: 'clusters.addworker.selectCluster.tips'
})
}}
></span>
</Typography.Paragraph>
</div>
}
>
@@ -69,15 +69,29 @@ const useAddWorker = (props: {
item.provider !== ProviderValueMap.Docker
};
})
.filter((item) => item.state === ClusterStatusValueMap.Ready);
.filter(
(item) =>
item.state === ClusterStatusValueMap.Ready &&
item.provider === ProviderValueMap.Docker
);
}, [clusterList]);
/**
* Add Worker only for Docker clusters, for k8s and digitalocean do something in the cluster list page.
* @param clusterList
* @param includeDigitalOcean
* @returns
*/
const checkDefaultCluster = (
clusterList: Global.BaseOption<number, ClusterListItem>[]
clusterList: Global.BaseOption<number, ClusterListItem>[],
includeDigitalOcean?: boolean
) => {
// select default and ready cluster first, digitalocean no READY state
let currentData = clusterList.find(
(item) => item.is_default && item.state === ClusterStatusValueMap.Ready
(item) =>
item.is_default &&
item.state === ClusterStatusValueMap.Ready &&
item.provider === ProviderValueMap.Docker
);
if (!currentData) {