fix: editor incompatibility with firefox79

.eslintrc.js

@@ -11,5 +11,5 @@ module.exports = {
     Global: 'readonly',
     React: 'readonly'
   },
-  ignorePatterns: ['public/static/']
+  ignorePatterns: ['public/static/', 'public/vs/**']
 };

.github/workflows/ci.yml

@@ -13,7 +13,7 @@ on:
       - 'v*-dev'
 
 env:
-  NODE_VERSION: '21'
+  NODE_VERSION: '22'
 
 jobs:
   deps:
@@ -32,7 +32,7 @@ jobs:
       - name: Setup Node
         uses: actions/setup-node@v4
         with:
-          node-version: '${{ env.NODE_VERSION }}'
+          node-version-file: '.nvmrc'
           cache: 'pnpm'
       - name: Deps
         run: scripts/deps

.lintstagedrc

@@ -5,6 +5,7 @@
     "max lint --fix --stylelint-only",
     "prettier --cache --write"
   ],
+  "!public/vs/**": [],
   "*.ts?(x)": [
     "max lint --fix --eslint-only",
     "prettier --cache --parser=typescript --write"

.nvmrc

@@ -0,0 +1 @@
+22.21.1

.prettierignore

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

.stylelintrc.js

@@ -3,5 +3,5 @@ module.exports = {
   rules: {
     'selector-class-pattern': null
   },
-  ignoreFiles: ['public/static/*.css']
+  ignoreFiles: ['public/static/*.css', 'public/vs/**/*.css']
 };

config/config.ts

@@ -29,7 +29,7 @@ export default defineConfig({
     defaultSizes: 'parsed' // stat  // gzip
   },
   mfsu: {
-    exclude: ['lodash', 'ml-pca', 'monaco-editor']
+    exclude: ['lodash', 'ml-pca']
   },
   base: process.env.npm_config_base || '/',
   ...(isProduction
@@ -81,6 +81,17 @@ export default defineConfig({
   routePrefetch: {
     defaultPrefetch: 'intent'
   },
+  // fastRefresh: false,
+  targets: {
+    firefox: 79
+  },
+  extraBabelIncludes: [
+    /node_modules\/react-error-overlay/,
+    /node_modules\/@umijs/,
+    /node_modules\/strip-ansi/,
+    /node_modules\/antd/,
+    /node_modules\/rc-/
+  ],
   keepalive: keepAlive,
   locale: {
     antd: true,

config/plugins.ts

@@ -13,7 +13,7 @@ export function monacoPluginConfig(config: any) {
             entry: 'monaco-yaml',
             worker: {
               id: 'monaco-yaml/yamlWorker',
-              entry: 'monaco-yaml/yaml.worker'
+              entry: 'monaco-yaml/yaml.worker.js'
             }
           }
         ]

config/routes.ts

@@ -199,16 +199,6 @@ export default [
         hideInMenu: true,
         component: './cluster-management/cluster-detail'
       },
-      // {
-      //   name: 'clusterCreate',
-      //   path: '/cluster-management/clusters/create',
-      //   key: 'clusterCreate',
-      //   icon: 'icon-cluster2-outline',
-      //   selectedIcon: 'icon-cluster2-filled',
-      //   defaultIcon: 'icon-cluster2-outline',
-      //   hideInMenu: true,
-      //   component: './cluster-management/cluster-create'
-      // },
       {
         name: 'credentials',
         path: '/cluster-management/credentials',

package.json

@@ -55,12 +55,11 @@
     "lodash": "^4.17.21",
     "mammoth": "^1.8.0",
     "marked": "^14.1.0",
-    "minimatch": "^10.0.3",
+    "minimatch": "^3.1.2",
     "ml-dataset-iris": "^1.2.1",
     "ml-pca": "^4.1.1",
-    "monaco-editor": "^0.53.0",
+    "monaco-editor": "^0.30.1",
-    "monaco-editor-webpack-plugin": "^7.1.0",
+    "monaco-yaml": "^4.0.0",
-    "monaco-yaml": "^5.4.0",
     "numeral": "^2.0.6",
     "overlayscrollbars": "^2.10.0",
     "overlayscrollbars-react": "^0.5.6",
@@ -87,6 +86,7 @@
     "xlsx": "https://cdn.sheetjs.com/xlsx-0.20.3/xlsx-0.20.3.tgz"
   },
   "devDependencies": {
+    "@types/node": "^25.0.3",
     "@types/react": "^18.3.1",
     "@types/react-dom": "^18.3.0",
     "@types/semver": "^7.7.1",
@@ -104,6 +104,7 @@
     "less-loader": "^12.2.0",
     "lint-staged": "^15.2.2",
     "mini-css-extract-plugin": "^2.9.0",
+    "monaco-editor-webpack-plugin": "^4.2.0",
     "prettier": "^3.2.5",
     "prettier-plugin-organize-imports": "^3.2.4",
     "prettier-plugin-packagejson": "^2.5.0",
@@ -118,5 +119,8 @@
     "overrides": {
       "elliptic": "^6.6.1"
     }
+  },
+  "engines": {
+    "node": "16.20.2"
   }
 }

public/vs/basic-languages/yaml/yaml.js

@@ -0,0 +1,163 @@
+/*!-----------------------------------------------------------------------------
+ * Copyright (c) Microsoft Corporation. All rights reserved.
+ * monaco-languages version: 0.30.1(5a7ba61be909ae9e4889768a3453ebb0dec392e2)
+ * Released under the MIT license
+ * https://github.com/Microsoft/monaco-languages/blob/master/LICENSE.md
+ *-----------------------------------------------------------------------------*/
+define('vs/basic-languages/yaml/yaml', ['require', 'exports'], function (e, n) {
+  'use strict';
+  (Object.defineProperty(n, '__esModule', { value: !0 }),
+    (n.language = n.conf = void 0),
+    (n.conf = {
+      comments: { lineComment: '#' },
+      brackets: [
+        ['{', '}'],
+        ['[', ']'],
+        ['(', ')']
+      ],
+      autoClosingPairs: [
+        { open: '{', close: '}' },
+        { open: '[', close: ']' },
+        { open: '(', close: ')' },
+        { open: '"', close: '"' },
+        { open: "'", close: "'" }
+      ],
+      surroundingPairs: [
+        { open: '{', close: '}' },
+        { open: '[', close: ']' },
+        { open: '(', close: ')' },
+        { open: '"', close: '"' },
+        { open: "'", close: "'" }
+      ],
+      folding: { offSide: !0 }
+    }),
+    (n.language = {
+      tokenPostfix: '.yaml',
+      brackets: [
+        { token: 'delimiter.bracket', open: '{', close: '}' },
+        { token: 'delimiter.square', open: '[', close: ']' }
+      ],
+      keywords: [
+        'true',
+        'True',
+        'TRUE',
+        'false',
+        'False',
+        'FALSE',
+        'null',
+        'Null',
+        'Null',
+        '~'
+      ],
+      numberInteger: /(?:0|[+-]?[0-9]+)/,
+      numberFloat: /(?:0|[+-]?[0-9]+)(?:\.[0-9]+)?(?:e[-+][1-9][0-9]*)?/,
+      numberOctal: /0o[0-7]+/,
+      numberHex: /0x[0-9a-fA-F]+/,
+      numberInfinity: /[+-]?\.(?:inf|Inf|INF)/,
+      numberNaN: /\.(?:nan|Nan|NAN)/,
+      numberDate:
+        /\d{4}-\d\d-\d\d([Tt ]\d\d:\d\d:\d\d(\.\d+)?(( ?[+-]\d\d?(:\d\d)?)|Z)?)?/,
+      escapes: /\\(?:[btnfr\\"']|[0-7][0-7]?|[0-3][0-7]{2})/,
+      tokenizer: {
+        root: [
+          { include: '@whitespace' },
+          { include: '@comment' },
+          [/%[^ ]+.*$/, 'meta.directive'],
+          [/---/, 'operators.directivesEnd'],
+          [/\.{3}/, 'operators.documentEnd'],
+          [/[-?:](?= )/, 'operators'],
+          { include: '@anchor' },
+          { include: '@tagHandle' },
+          { include: '@flowCollections' },
+          { include: '@blockStyle' },
+          [/@numberInteger(?![ \t]*\S+)/, 'number'],
+          [/@numberFloat(?![ \t]*\S+)/, 'number.float'],
+          [/@numberOctal(?![ \t]*\S+)/, 'number.octal'],
+          [/@numberHex(?![ \t]*\S+)/, 'number.hex'],
+          [/@numberInfinity(?![ \t]*\S+)/, 'number.infinity'],
+          [/@numberNaN(?![ \t]*\S+)/, 'number.nan'],
+          [/@numberDate(?![ \t]*\S+)/, 'number.date'],
+          [
+            /(".*?"|'.*?'|.*?)([ \t]*)(:)( |$)/,
+            ['type', 'white', 'operators', 'white']
+          ],
+          { include: '@flowScalars' },
+          [/[^#]+/, { cases: { '@keywords': 'keyword', '@default': 'string' } }]
+        ],
+        object: [
+          { include: '@whitespace' },
+          { include: '@comment' },
+          [/\}/, '@brackets', '@pop'],
+          [/,/, 'delimiter.comma'],
+          [/:(?= )/, 'operators'],
+          [/(?:".*?"|'.*?'|[^,\{\[]+?)(?=: )/, 'type'],
+          { include: '@flowCollections' },
+          { include: '@flowScalars' },
+          { include: '@tagHandle' },
+          { include: '@anchor' },
+          { include: '@flowNumber' },
+          [
+            /[^\},]+/,
+            { cases: { '@keywords': 'keyword', '@default': 'string' } }
+          ]
+        ],
+        array: [
+          { include: '@whitespace' },
+          { include: '@comment' },
+          [/\]/, '@brackets', '@pop'],
+          [/,/, 'delimiter.comma'],
+          { include: '@flowCollections' },
+          { include: '@flowScalars' },
+          { include: '@tagHandle' },
+          { include: '@anchor' },
+          { include: '@flowNumber' },
+          [
+            /[^\],]+/,
+            { cases: { '@keywords': 'keyword', '@default': 'string' } }
+          ]
+        ],
+        multiString: [[/^( +).+$/, 'string', '@multiStringContinued.$1']],
+        multiStringContinued: [
+          [
+            /^( *).+$/,
+            {
+              cases: {
+                '$1==$S2': 'string',
+                '@default': { token: '@rematch', next: '@popall' }
+              }
+            }
+          ]
+        ],
+        whitespace: [[/[ \t\r\n]+/, 'white']],
+        comment: [[/#.*$/, 'comment']],
+        flowCollections: [
+          [/\[/, '@brackets', '@array'],
+          [/\{/, '@brackets', '@object']
+        ],
+        flowScalars: [
+          [/"([^"\\]|\\.)*$/, 'string.invalid'],
+          [/'([^'\\]|\\.)*$/, 'string.invalid'],
+          [/'[^']*'/, 'string'],
+          [/"/, 'string', '@doubleQuotedString']
+        ],
+        doubleQuotedString: [
+          [/[^\\"]+/, 'string'],
+          [/@escapes/, 'string.escape'],
+          [/\\./, 'string.escape.invalid'],
+          [/"/, 'string', '@pop']
+        ],
+        blockStyle: [[/[>|][0-9]*[+-]?$/, 'operators', '@multiString']],
+        flowNumber: [
+          [/@numberInteger(?=[ \t]*[,\]\}])/, 'number'],
+          [/@numberFloat(?=[ \t]*[,\]\}])/, 'number.float'],
+          [/@numberOctal(?=[ \t]*[,\]\}])/, 'number.octal'],
+          [/@numberHex(?=[ \t]*[,\]\}])/, 'number.hex'],
+          [/@numberInfinity(?=[ \t]*[,\]\}])/, 'number.infinity'],
+          [/@numberNaN(?=[ \t]*[,\]\}])/, 'number.nan'],
+          [/@numberDate(?=[ \t]*[,\]\}])/, 'number.date']
+        ],
+        tagHandle: [[/\![^ ]*/, 'tag']],
+        anchor: [[/[&*][^ ]+/, 'namespace']]
+      }
+    }));
+});

src/global.less

@@ -103,7 +103,7 @@ html[data-theme='realDark'] {
   --color-spotlight-bg: #3e3e3e;
   --color-esc-hint-bg: rgba(150, 150, 150, 75%);
 
-  background: #292929;
+  background: #141414;
 
   .ant-result-image {
     opacity: 0.9;

src/layouts/sider-menu.tsx

@@ -1,7 +1,7 @@
 import IconFont from '@/components/icon-font';
 import { CaretDownOutlined } from '@ant-design/icons';
 import { Link, useLocation } from '@umijs/max';
-import { Divider, Tooltip } from 'antd';
+import { Tooltip } from 'antd';
 import { createStyles } from 'antd-style';
 import React, { useMemo, useState } from 'react';
 
@@ -67,6 +67,7 @@ const useStyles = createStyles(({ css, token }) => {
         height: 1px;
         padding-block: 0;
         padding-inline: 0;
+        justify-content: center;
       }
     `,
     menuItemContent: css`
@@ -118,6 +119,14 @@ const useStyles = createStyles(({ css, token }) => {
       &.menu-item-group-hidden {
         display: none;
       }
+    `,
+    line: css`
+      height: 1px;
+      margin-block: 6px;
+      background-color: ${token.colorSplit};
+      position: absolute;
+      left: 6px;
+      right: 6px;
     `
   };
 });
@@ -228,7 +237,7 @@ const SiderMenu: React.FC<SiderMenuProps> = (props) => {
                     ></CaretDownOutlined>
                   </span>
                 ) : is_admin ? (
-                  <Divider style={dividerStyles} />
+                  <span className={styles.line}></span>
                 ) : null}
               </div>
               <div

src/locales/en-US/models.ts

@@ -219,7 +219,7 @@ export default {
   'models.mymodels.status.degrade': 'Not Ready',
   'models.mymodels.status.active': 'Ready',
   'models.form.kvCache.tips':
-    'Extended KV cache and speculative decoding are only available with built-in backends (vLLM / SGLang), Please switch the backend in the <span class="bold-text">Advanced</span> settings to enable them.',
+    'Extended KV cache and speculative decoding are only available with built-in backends (vLLM / SGLang), Please switch the backend to enable them.',
   'models.form.kvCache.tips2':
     'Only supported when using built-in inference backends (vLLM or SGLang).',
   'models.form.scheduling': 'Scheduling',

src/locales/ja-JP/models.ts

@@ -219,7 +219,7 @@ export default {
   'models.mymodels.status.degrade': 'Not Ready',
   'models.mymodels.status.active': 'Ready',
   'models.form.kvCache.tips':
-    'Extended KV cache and speculative decoding are only available with built-in backends (vLLM / SGLang), Please switch the backend in the <span class="bold-text">Advanced</span> settings to enable them.',
+    'Extended KV cache and speculative decoding are only available with built-in backends (vLLM / SGLang), Please switch the backend to enable them.',
   'models.form.kvCache.tips2':
     'Only supported when using built-in inference backends (vLLM or SGLang).',
   'models.form.scheduling': 'Scheduling',
@@ -318,7 +318,7 @@ export default {
 // 41.  'models.mymodels.status.degrade': 'Not Ready',
 // 42.  'models.mymodels.status.active': 'Ready',
 // 43. 'models.form.remoteURL.tips': 'Refer to the <a href="https://docs.lmcache.ai/api_reference/configurations.html" target="_blank">configuration documentation</a> for details.',
-// 44.  'models.form.kvCache.tips': 'Extended KV cache and speculative decoding are only available with built-in backends (vLLM / SGLang), Please switch the backend in the <span class="bold-text">Advanced</span> settings to enable them.',
+// 44.  'models.form.kvCache.tips': 'Extended KV cache and speculative decoding are only available with built-in backends (vLLM / SGLang), Please switch the backend to enable them.',
 // 45. 'models.form.kvCache.tips2': 'Only supported when using built-in inference backends (vLLM or SGLang).',
 // 46. 'models.form.scheduling': 'Scheduling',
 // 47. 'models.form.ramRatio': 'RAM-to-VRAM Ratio',

src/locales/ru-RU/models.ts

@@ -223,7 +223,7 @@ export default {
   'models.mymodels.status.degrade': 'Не готов',
   'models.mymodels.status.active': 'Готов',
   'models.form.kvCache.tips':
-    'Расширенный KV-кэш и спекулятивное декодирование доступны только со встроенными бэкендами (vLLM / SGLang). Переключите бэкенд в <span class="bold-text">Расширенных</span> настройках, чтобы включить их.',
+    'Расширенный KV-кэш и спекулятивное декодирование доступны только для встроенных бэкендов (vLLM / SGLang). Пожалуйста, переключите бэкенд, чтобы включить их.',
   'models.form.kvCache.tips2':
     'Поддерживается только при использовании встроенных бэкендов вывода (vLLM или SGLang).',
   'models.form.scheduling': 'Планирование',

src/locales/zh-CN/models.ts

@@ -208,7 +208,7 @@ export default {
   'models.mymodels.status.degrade': '异常',
   'models.mymodels.status.active': '可用',
   'models.form.kvCache.tips':
-    '扩展 KV 缓存和推测解码仅在内置后端（vLLM / SGLang）可用，请在<span class="bold-text">高级</span>配置中切换后端以启用。',
+    '扩展 KV 缓存和推测解码仅在内置后端（vLLM / SGLang）可用，请切换后端以启用。',
   'models.form.kvCache.tips2': '仅在使用内置推理后端（vLLM 或 SGLang）时支持。',
   'models.form.scheduling': '调度',
   'models.form.ramRatio': '内存与显存比例',

src/pages/_components/yaml-editor/editor.tsx

@@ -1,8 +1,7 @@
 import EditorWrap from '@/components/editor-wrap';
 import { LoadingOutlined } from '@ant-design/icons';
 import Editor, { loader } from '@monaco-editor/react';
-import * as monaco from 'monaco-editor';
+import { yamlDefaults } from 'monaco-yaml';
-import { configureMonacoYaml } from 'monaco-yaml';
 import React, {
   forwardRef,
   useEffect,
@@ -10,7 +9,9 @@ import React, {
   useRef
 } from 'react';
 
-loader.config({ monaco });
+loader.config({
+  paths: { vs: '/vs' }
+});
 
 interface ViewerProps {
   ref?: any;
@@ -45,7 +46,9 @@ const EditorInner: React.FC<ViewerProps> = forwardRef((props, ref) => {
   const handleBeforeMount = (monaco: any) => {
     const yamlUri = monaco.Uri.parse(path);
 
-    configureMonacoYaml(monaco, {
+    yamlDefaults.setDiagnosticsOptions({
+      validate: false,
+      enableSchemaRequest: true,
       hover: false,
       schemas: [
         {

src/pages/cluster-management/cluster-detail.tsx

@@ -1,13 +1,13 @@
+import WorkerList from '@/pages/resources/components/workers';
 import { useIntl, useNavigate, useSearchParams } from '@umijs/max';
 import { PageContainerInner } from '../_components/page-box';
 import PageBreadcrumb from '../_components/page-breadcrumb';
-import ClusterMetrics from './components/cluster-metrics';
 
 const ClusterDetailModal = () => {
   const navigate = useNavigate();
   const intl = useIntl();
   const [searchParams] = useSearchParams();
-  const provider = searchParams.get('provider');
+  const id = searchParams.get('id');
   const clusterName = searchParams.get('name');
 
   const breadcrumbItems = [
@@ -26,7 +26,13 @@ const ClusterDetailModal = () => {
         title: <PageBreadcrumb items={breadcrumbItems} />
       }}
     >
-      <ClusterMetrics />
+      <WorkerList
+        clusterId={id}
+        showAddButton={false}
+        showSelect={false}
+        widths={{ input: 360 }}
+        sourceType="cluster"
+      />
     </PageContainerInner>
   );
 };

src/pages/cluster-management/cluster-workers-modal.tsx

@@ -1,60 +0,0 @@
-import WorkerList from '@/pages/resources/components/workers';
-import { useIntl } from '@umijs/max';
-import React from 'react';
-import styled from 'styled-components';
-import FormDrawer from '../_components/form-drawer';
-import { ClusterListItem } from './config/types';
-
-const Content = styled.div`
-  .ant-pagination {
-    position: fixed;
-    bottom: 8px;
-    right: 24px;
-    z-index: 100;
-  }
-  .page-tools {
-    position: sticky;
-    top: 0;
-  }
-`;
-
-interface ClusterWorkersModalProps {
-  cluster: ClusterListItem;
-  open: boolean;
-  onClose: () => void;
-}
-
-const ClusterWorkersModal: React.FC<ClusterWorkersModalProps> = ({
-  open,
-  onClose,
-  cluster
-}) => {
-  const intl = useIntl();
-  return (
-    <FormDrawer
-      title={`${intl.formatMessage({ id: 'clusters.title' })}: ${cluster.name}`}
-      open={open}
-      onCancel={onClose}
-      footer={
-        <div
-          style={{
-            height: 56
-          }}
-        ></div>
-      }
-      width={'calc(100vw - 220px)'}
-    >
-      <Content>
-        <WorkerList
-          cluster={cluster}
-          showAddButton={false}
-          showSelect={false}
-          widths={{ input: 360 }}
-          sourceType="cluster"
-        />
-      </Content>
-    </FormDrawer>
-  );
-};
-
-export default ClusterWorkersModal;

src/pages/cluster-management/clusters.tsx

@@ -11,7 +11,7 @@ import type { PageActionType } from '@/config/types';
 import useExpandedRowKeys from '@/hooks/use-expanded-row-keys';
 import useTableFetch from '@/hooks/use-table-fetch';
 import useWatchList from '@/hooks/use-watch-list';
-import { useIntl } from '@umijs/max';
+import { useIntl, useNavigate } from '@umijs/max';
 import { useMemoizedFn } from 'ahooks';
 import { message } from 'antd';
 import { useAtom } from 'jotai';
@@ -31,7 +31,6 @@ import {
   WORKER_POOLS_API
 } from './apis';
 import ClusterModal from './cluster-modal';
-import ClusterWorkersModal from './cluster-workers-modal';
 import AddCluster from './components/add-cluster';
 import AddPool from './components/add-pool';
 import {
@@ -49,7 +48,6 @@ import {
 } from './config/types';
 import useAddWorker from './hooks/use-add-worker';
 import useClusterColumns from './hooks/use-cluster-columns';
-import { useClusterWorkers } from './hooks/use-cluster-workers';
 import useCreateCluster from './hooks/use-create-cluster';
 
 const Clusters: React.FC = () => {
@@ -72,6 +70,7 @@ const Clusters: React.FC = () => {
     API: CLUSTERS_API,
     contentForDelete: 'menu.clusterManagement.clusters'
   });
+  const navigate = useNavigate();
   const { watchDataList: allWorkerPoolList } = useWatchList(WORKER_POOLS_API);
   const [expandAtom] = useAtom(expandKeysAtom);
   const [clusterSession, setClusterSession] = useAtom(clusterSessionAtom);
@@ -84,12 +83,6 @@ const Clusters: React.FC = () => {
     useCreateCluster({
       refresh: handleSearch
     });
-  const {
-    clusterWorkersModalStatus,
-    openClusterWorkersModal,
-    closeClusterWorkersModal
-  } = useClusterWorkers();
-
   const [openAddModal, setOpenAddModal] = useState<{
     open: boolean;
     action: PageActionType;
@@ -206,7 +199,9 @@ const Clusters: React.FC = () => {
     }
   });
 
-  const handleOnToggleExpandAll = () => {};
+  const handleOnToggleExpandAll = () => {
+    // do nothing
+  };
 
   const handleToggleExpandAll = useMemoizedFn((expanded: boolean) => {
     const keys = dataSource.dataList?.map((item) => item.id);
@@ -256,6 +251,14 @@ const Clusters: React.FC = () => {
     );
   };
 
+  const handleOnCell = useMemoizedFn((record: ClusterListItem, dataIndex) => {
+    if (dataIndex === 'name') {
+      navigate(
+        `/cluster-management/clusters/detail?id=${record.id}&name=${record.name}`
+      );
+    }
+  });
+
   useEffect(() => {
     const fetchCredentialList = async () => {
       const data = await queryCredentialList({ page: -1 });
@@ -318,7 +321,7 @@ const Clusters: React.FC = () => {
     );
   };
 
-  const columns = useClusterColumns(handleSelect, openClusterWorkersModal);
+  const columns = useClusterColumns(handleSelect, handleOnCell);
 
   return (
     <>
@@ -423,11 +426,6 @@ const Clusters: React.FC = () => {
         open={clusterModalStatus.open}
         onClose={closeClusterModal}
       ></ClusterModal>
-      <ClusterWorkersModal
-        open={clusterWorkersModalStatus.open}
-        onClose={closeClusterWorkersModal}
-        cluster={clusterWorkersModalStatus.cluster}
-      ></ClusterWorkersModal>
       {AddWorkerModal}
     </>
   );

src/pages/cluster-management/hooks/use-cluster-columns.tsx

@@ -6,7 +6,7 @@ import StatusTag from '@/components/status-tag';
 import { tableSorter } from '@/config/settings';
 import { StarFilled } from '@ant-design/icons';
 import { useIntl } from '@umijs/max';
-import { Tooltip, Typography } from 'antd';
+import { Tooltip } from 'antd';
 import dayjs from 'dayjs';
 import { useMemo } from 'react';
 import {
@@ -28,7 +28,7 @@ const setActionsItems = (row: ClusterListItem) => {
 
 const useClusterColumns = (
   handleSelect: (val: string, record: ClusterListItem) => void,
-  onViewWorkers: (record: ClusterListItem) => void
+  onCellClick?: (record: ClusterListItem, dataIndex: string) => void
 ): SealColumnProps[] => {
   const intl = useIntl();
 
@@ -42,13 +42,7 @@ const useClusterColumns = (
         render: (text: string, record: ClusterListItem) => (
           <>
             <AutoTooltip ghost title={text}>
-              {record.workers > 0 ? (
+              {text}
-                <Typography.Link onClick={() => onViewWorkers(record)}>
-                  {record.name}
-                </Typography.Link>
-              ) : (
-                text
-              )}
             </AutoTooltip>
             {record.is_default && (
               <Tooltip
@@ -136,7 +130,7 @@ const useClusterColumns = (
         )
       }
     ];
-  }, [handleSelect, onViewWorkers]);
+  }, [handleSelect, onCellClick]);
 };
 
 export default useClusterColumns;

src/pages/cluster-management/hooks/use-cluster-workers.ts

@@ -1,32 +0,0 @@
-import { useState } from 'react';
-import { ClusterListItem } from '../config/types';
-
-export const useClusterWorkers = () => {
-  const [clusterWorkersModalStatus, setClusterWorkersModalStatus] = useState<{
-    open: boolean;
-    cluster: ClusterListItem;
-  }>({
-    open: false,
-    cluster: {} as ClusterListItem
-  });
-
-  const openClusterWorkersModal = (cluster: ClusterListItem) => {
-    setClusterWorkersModalStatus({
-      open: true,
-      cluster
-    });
-  };
-
-  const closeClusterWorkersModal = () => {
-    setClusterWorkersModalStatus({
-      open: false,
-      cluster: {} as ClusterListItem
-    });
-  };
-
-  return {
-    clusterWorkersModalStatus,
-    openClusterWorkersModal,
-    closeClusterWorkersModal
-  };
-};

src/pages/cluster-management/step-forms/advance-config.tsx

@@ -5,7 +5,7 @@ import YamlEditor from '@/pages/_components/yaml-editor';
 import { useIntl } from '@umijs/max';
 import { Button, Form } from 'antd';
 import React, { forwardRef, useImperativeHandle } from 'react';
-import { ProviderType, ProviderValueMap } from '../config';
+import { ProviderType } from '../config';
 import { ClusterFormData as FormData } from '../config/types';
 import schema from '../config/worker-config.json';
 import yamlTemplate from '../config/yaml-template';
@@ -32,26 +32,6 @@ const ClusterAdvanceConfig: React.FC<{
 
   return (
     <>
-      {provider !== ProviderValueMap.DigitalOcean && (
-        <Form.Item<FormData>
-          name="server_url"
-          rules={[
-            {
-              required: false,
-              message: ''
-            }
-          ]}
-        >
-          <SealInput.Input
-            description={intl.formatMessage({
-              id: 'clusters.form.serverUrl.tips'
-            })}
-            label={intl.formatMessage({ id: 'clusters.create.serverUrl' })}
-            required={false}
-            trim={true}
-          ></SealInput.Input>
-        </Form.Item>
-      )}
       <Form.Item<FormData>
         hidden
         name="worker_config"

src/pages/resources/components/workers.tsx

@@ -27,13 +27,13 @@ import UpdateLabels from './update-labels';
 import WorkerDetailModal from './worker-detail-modal';
 
 const Workers: React.FC<{
-  cluster: ClusterListItem;
+  clusterId: string | number | null;
   showSelect?: boolean;
   showAddButton?: boolean;
   widths?: { input: number };
   sourceType?: string;
 }> = ({
-  cluster,
+  clusterId,
   showSelect = true,
   showAddButton = true,
   widths = { input: 200 },
@@ -62,7 +62,7 @@ const Workers: React.FC<{
     watch: true,
     API: WORKERS_API,
     defaultQueryParams: {
-      cluster_id: cluster?.id || undefined
+      cluster_id: clusterId
     }
   });
   const { TerminalPanel, terminals, handleAddTerminal } = useTerminalTabs();

typings.d.ts

@@ -28,5 +28,6 @@ declare module 'lamejs';
 declare module 'file-saver';
 declare module 'tinycolor2';
 declare module 'js-yaml';
+declare module 'minimatch';
 
 declare const REACT_APP_ENV: 'test' | 'dev' | 'pre' | false;