terminate a rebuilding index, fix #477 (#511)

Signed-off-by: ryjiang <[email protected]>
zilliztech · May 24, 2024 · ac2285a · ac2285a
1 parent a7b9503
commit ac2285a
Show file tree

Hide file tree

Showing 3 changed files with 43 additions and 27 deletions.
diff --git a/client/src/i18n/cn/index.ts b/client/src/i18n/cn/index.ts
@@ -12,6 +12,7 @@ const indexTrans = {
  metric: '度量类型',
  createSuccess: '开始创建索引',
  deleteWarning: '您正在尝试删除一个索引。此操作无法撤销。',
+ cancelCreate: '取消创建索引',
 };
 
 export default indexTrans;
diff --git a/client/src/i18n/en/index.ts b/client/src/i18n/en/index.ts
@@ -13,6 +13,7 @@ const indexTrans = {
  createSuccess: 'Start creating index',
  deleteWarning:
  'You are trying to delete an index. This action cannot be undone.',
+ cancelCreate: 'Cancel Index Creation',
 };
 
 export default indexTrans;
diff --git a/client/src/pages/databases/collections/overview/IndexTypeElement.tsx b/client/src/pages/databases/collections/overview/IndexTypeElement.tsx
@@ -150,6 +150,37 @@ const IndexTypeElement: FC<{
  });
  };
 
+ const chipComp = (
+ text = field.index.indexType,
+ icon = <Icons.delete classes={{ root: 'icon' }} />,
+ tooltip = ''
+ ) => {
+ const IndexElem = () => (
+ <Chip
+ label={text}
+ classes={{ root: classes.chip, label: classes.chipLabel }}
+ deleteIcon={icon}
+ onDelete={handleDelete}
+ disabled={disabled}
+ onClick={e => {
+ e.stopPropagation();
+ handleDelete();
+ }}
+ size="small"
+ />
+ );
+
+ return tooltip ? (
+ <Tooltip interactive arrow title={tooltip} placement="top">
+ <div>
+ <IndexElem />
+ </div>
+ </Tooltip>
+ ) : (
+ <IndexElem />
+ );
+ };
+
  const generateElement = () => {
  if (
  field.is_primary_key ||
@@ -176,38 +207,21 @@ const IndexTypeElement: FC<{
  switch (field.index.indexType) {
  default: {
  if (field.index.state === IndexState.InProgress) {
- return <StatusIcon type={LoadingType.CREATING} />;
+ return (
+ <>
+ {chipComp(
+ field.index.indexType,
+ <StatusIcon type={LoadingType.CREATING} />,
+ indexTrans('cancelCreate')
+ )}
+ </>
+ );
  }
 
- const chipComp = () => (
- <Chip
- label={field.index.indexType}
- classes={{ root: classes.chip, label: classes.chipLabel }}
- deleteIcon={<Icons.delete classes={{ root: 'icon' }} />}
- onDelete={handleDelete}
- disabled={disabled}
- onClick={(e: MouseEvent<HTMLDivElement>) => {
- e.stopPropagation();
- handleDelete();
- }}
- size="small"
- />
- );
  /**
  * if creating finished, show chip that contains index type
  */
- return disabled ? (
- <Tooltip
- interactive
- arrow
- title={disabledTooltip ?? ''}
- placement={'top'}
- >
- <div>{chipComp()}</div>
- </Tooltip>
- ) : (
- <div>{chipComp()}</div>
- );
+ return chipComp(field.index.indexType);
  }
  }
  };