diff --git a/docs/content.en/docs/release-notes/_index.md b/docs/content.en/docs/release-notes/_index.md
index 934868f7..936ca5df 100644
--- a/docs/content.en/docs/release-notes/_index.md
+++ b/docs/content.en/docs/release-notes/_index.md
@@ -12,11 +12,14 @@ Information about release notes of INFINI Console is provided here.
### Breaking changes
### Features
+- add allocation to activities if is cluster health change and changed to red.
### Bug fix
- fix: query thread pool metrics when cluster uuid is empty
### Improvements
+- Optimize UI of agent list when its columns are overflow.
+- add loading to each row in overview table.
## 1.27.0 (2024-12-09)
diff --git a/web/src/pages/Platform/Overview/Cluster/Table/index.jsx b/web/src/pages/Platform/Overview/Cluster/Table/index.jsx
index 7ce235f7..69d0c49d 100644
--- a/web/src/pages/Platform/Overview/Cluster/Table/index.jsx
+++ b/web/src/pages/Platform/Overview/Cluster/Table/index.jsx
@@ -1,5 +1,5 @@
import React, { useState, useEffect, useMemo } from "react";
-import { Table, Tooltip, Progress } from "antd";
+import { Table, Tooltip, Progress, Spin } from "antd";
import { formatter } from "@/utils/format";
import { formatMessage } from "umi/locale";
import { SearchEngineIcon } from "@/lib/search_engines";
@@ -18,36 +18,39 @@ export default (props) => {
dataIndex: "name",
render: (text, record) => {
return (
-
- Host: {record.metadata?.host}
-
- Provider:{" "}
- {formatMessage({
- id: `cluster.providers.${record.metadata?.location
- ?.provider ?? Providers.OnPremises}`,
- })}
-
- Region: {record.metadata?.location?.region ?? ""}
-
- Version: {record.metadata?.version ?? ""}
-
- Tags:{" "}
- {record.metadata?.tags ? record.metadata.tags.toString() : ""}
-
- }
- >
-
-
- {record.metadata?.name}
-
-
+ <>
+
+ Host: {record.metadata?.host}
+
+ Provider:{" "}
+ {formatMessage({
+ id: `cluster.providers.${record.metadata?.location
+ ?.provider ?? Providers.OnPremises}`,
+ })}
+
+ Region: {record.metadata?.location?.region ?? ""}
+
+ Version: {record.metadata?.version ?? ""}
+
+ Tags:{" "}
+ {record.metadata?.tags ? record.metadata.tags.toString() : ""}
+
+ }
+ >
+
+
+ {record.metadata?.name}
+
+
+
+
);
},
},
diff --git a/web/src/pages/Platform/Overview/Indices/Table/index.jsx b/web/src/pages/Platform/Overview/Indices/Table/index.jsx
index 2e1f777f..d1d31a03 100644
--- a/web/src/pages/Platform/Overview/Indices/Table/index.jsx
+++ b/web/src/pages/Platform/Overview/Indices/Table/index.jsx
@@ -1,5 +1,5 @@
import React, { useState, useEffect, useMemo } from "react";
-import { Tooltip, Progress, Icon } from "antd";
+import { Tooltip, Progress, Icon, Spin } from "antd";
import { formatter } from "@/utils/format";
import { formatUtcTimeToLocal } from "@/utils/utils";
import { formatMessage } from "umi/locale";
@@ -18,25 +18,28 @@ export default (props) => {
dataIndex: "name",
render: (text, record) => {
return (
-
- Cluster: {record.metadata?.cluster_name}
-
- Aliases: {record.metadata?.aliases?.join(",")}
-
- Timestamp: {record.timestamp}
-
- }
- >
-
-
-
-
- {record.metadata?.index_name}
-
-
+ <>
+
+ Cluster: {record.metadata?.cluster_name}
+
+ Aliases: {record.metadata?.aliases?.join(",")}
+
+ Timestamp: {record.timestamp}
+
+ }
+ >
+
+
+
+
+ {record.metadata?.index_name}
+
+
+
+
);
},
},
diff --git a/web/src/pages/Platform/Overview/Node/Table/index.jsx b/web/src/pages/Platform/Overview/Node/Table/index.jsx
index 375a5bf3..5410f3dc 100644
--- a/web/src/pages/Platform/Overview/Node/Table/index.jsx
+++ b/web/src/pages/Platform/Overview/Node/Table/index.jsx
@@ -1,5 +1,5 @@
import React, { useState, useEffect, useMemo } from "react";
-import { Tooltip, Progress, Icon } from "antd";
+import { Tooltip, Progress, Icon, Spin } from "antd";
import { formatter } from "@/utils/format";
import { HealthStatusView } from "@/components/infini/health_status_view";
import { StatusBlockGroup } from "@/components/infini/status_block";
@@ -15,35 +15,38 @@ export default (props) => {
dataIndex: "name",
render: (text, record) => {
return (
-
- Transport Address:{" "}
- {record.metadata?.labels?.transport_address}
-
- Cluster: {record.metadata?.cluster_name ?? ""}
-
- Version: {record.metadata?.labels?.version ?? ""}
-
- Roles:{" "}
- {record.metadata?.labels?.roles
- ? record.metadata?.labels?.roles?.toString()
- : ""}
-
- }
- >
-
-
- {record.summary?.is_master_node ? (
-
- ) : (
-
- )}
-
- {record.metadata?.node_name}
-
-
+ <>
+
+ Transport Address:{" "}
+ {record.metadata?.labels?.transport_address}
+
+ Cluster: {record.metadata?.cluster_name ?? ""}
+
+ Version: {record.metadata?.labels?.version ?? ""}
+
+ Roles:{" "}
+ {record.metadata?.labels?.roles
+ ? record.metadata?.labels?.roles?.toString()
+ : ""}
+
+ }
+ >
+
+
+ {record.summary?.is_master_node ? (
+
+ ) : (
+
+ )}
+
+ {record.metadata?.node_name}
+
+
+
+
);
},
},
diff --git a/web/src/pages/Platform/Overview/components/CommonTable/index.jsx b/web/src/pages/Platform/Overview/components/CommonTable/index.jsx
index 3d141935..49266099 100644
--- a/web/src/pages/Platform/Overview/components/CommonTable/index.jsx
+++ b/web/src/pages/Platform/Overview/components/CommonTable/index.jsx
@@ -27,24 +27,31 @@ export default (props) => {
} = props;
const [infos, setInfos] = useState({});
+ const [loadings, setLoadings] = useState({});
const fetchListInfo = async (data) => {
- const res = await Promise.all(data?.map((item) => request(infoAction, {
- method: "POST",
- body: [item.id],
- }, false, false)));
- if (res) {
- let newInfos = {}
- res.forEach((item) => {
- if (item && !item.error) {
- newInfos = {
- ...newInfos,
- ...item
- }
+ data?.forEach((item) => {
+ setLoadings((loadings) => ({
+ ...loadings,
+ [item.id]: true
+ }))
+ request(infoAction, {
+ method: "POST",
+ body: [item.id],
+ }, false, false).then((res) => {
+ if (res && !res.error) {
+ setInfos((infos) => ({
+ ...infos,
+ ...res
+ }));
}
+ }).finally(() => {
+ setLoadings((loadings) => ({
+ ...loadings,
+ [item.id]: false
+ }))
})
- setInfos(newInfos);
- }
+ })
};
useEffect(() => {
@@ -84,7 +91,7 @@ export default (props) => {
},
};
}}
- rowClassName={() => styles.rowPointer}
+ rowClassName={(record) => `${styles.rowPointer} ${loadings[record.id] && !parentLoading ? styles.loading : ''}`}
/>
);
diff --git a/web/src/pages/Platform/Overview/components/CommonTable/index.less b/web/src/pages/Platform/Overview/components/CommonTable/index.less
index cdb1794f..5c508966 100644
--- a/web/src/pages/Platform/Overview/components/CommonTable/index.less
+++ b/web/src/pages/Platform/Overview/components/CommonTable/index.less
@@ -1,3 +1,28 @@
.rowPointer {
cursor: pointer;
+ :global {
+ .ant-spin-spinning {
+ display: none;
+ }
+ }
+}
+
+.loading {
+ position: relative;
+ cursor: default;
+ pointer-events: none;
+ opacity: 0.5;
+ :global {
+ .ant-spin-spinning {
+ position: absolute;
+ left: 0;
+ top: 0;
+ width: 100%;
+ height: 100%;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ z-index: 1;
+ }
+ }
}
\ No newline at end of file