From c951cd08704155e3bc069fcbf33c998169704477 Mon Sep 17 00:00:00 2001 From: amlannandy <amlannandy5@gmail.com> Date: Thu, 19 Dec 2024 12:32:06 +0530 Subject: [PATCH] chore: styling changes --- .../InfraMonitoringK8s/Nodes/K8sNodesList.tsx | 24 +++++++++---------- .../InfraMonitoringK8s/Nodes/utils.tsx | 20 +++++++++------- 2 files changed, 24 insertions(+), 20 deletions(-) diff --git a/frontend/src/container/InfraMonitoringK8s/Nodes/K8sNodesList.tsx b/frontend/src/container/InfraMonitoringK8s/Nodes/K8sNodesList.tsx index 9bd4672a90d..c6d35848ded 100644 --- a/frontend/src/container/InfraMonitoringK8s/Nodes/K8sNodesList.tsx +++ b/frontend/src/container/InfraMonitoringK8s/Nodes/K8sNodesList.tsx @@ -307,18 +307,18 @@ function K8sNodesList({ /> {groupedByRowData?.payload?.data?.total && - groupedByRowData?.payload?.data?.total > 10 && ( - <div className="expanded-table-footer"> - <Button - type="default" - size="small" - className="periscope-btn secondary" - onClick={handleExpandedRowViewAllClick} - > - View All - </Button> - </div> - )} + groupedByRowData?.payload?.data?.total > 10 ? ( + <div className="expanded-table-footer"> + <Button + type="default" + size="small" + className="periscope-btn secondary" + onClick={handleExpandedRowViewAllClick} + > + View All + </Button> + </div> + ) : null} </div> )} </div> diff --git a/frontend/src/container/InfraMonitoringK8s/Nodes/utils.tsx b/frontend/src/container/InfraMonitoringK8s/Nodes/utils.tsx index 5485f329161..810f70fd028 100644 --- a/frontend/src/container/InfraMonitoringK8s/Nodes/utils.tsx +++ b/frontend/src/container/InfraMonitoringK8s/Nodes/utils.tsx @@ -1,4 +1,4 @@ -import { Tag } from 'antd'; +import { Tag, Tooltip } from 'antd'; import { ColumnType } from 'antd/es/table'; import { K8sNodesData, @@ -88,7 +88,7 @@ const columnsConfig = [ dataIndex: 'nodeName', key: 'nodeName', ellipsis: true, - width: 150, + width: 120, sorter: true, align: 'left', }, @@ -97,7 +97,7 @@ const columnsConfig = [ dataIndex: 'clusterName', key: 'clusterName', ellipsis: true, - width: 150, + width: 120, sorter: true, align: 'left', }, @@ -179,14 +179,18 @@ export const formatDataForTable = ( nodeUID: node.nodeUID || '', nodeName: ( <div className="pod-name-container"> - <div className="pod-name">{node.meta.k8s_node_name || ''}</div> + <Tooltip title={node.meta.k8s_node_name}> + <div className="pod-name">{node.meta.k8s_node_name || ''}</div> + </Tooltip> </div> ), clusterName: node.meta.k8s_cluster_name, - cpuUtilization: node.nodeCPUUsage, - memoryUtilization: node.nodeMemoryUsage, - cpuAllocatable: node.nodeCPUAllocatable, - memoryAllocatable: node.nodeMemoryAllocatable, + cpuUtilization: node.nodeCPUUsage === -1 ? '-' : node.nodeCPUUsage, + memoryUtilization: node.nodeMemoryUsage === -1 ? '-' : node.nodeMemoryUsage, + cpuAllocatable: + node.nodeCPUAllocatable === -1 ? '-' : node.nodeCPUAllocatable, + memoryAllocatable: + node.nodeMemoryAllocatable === -1 ? '-' : node.nodeMemoryAllocatable, nodeGroup: getGroupByEle(node, groupBy), meta: node.meta, ...node.meta,