chore: fix issues in nodes

frontend/src/container/InfraMonitoringK8s/Nodes/K8sNodesList.styles.scss

@@ -0,0 +1,17 @@
+.infra-monitoring-container {
+	.nodes-list-table {
+		.expanded-table-container {
+			padding-left: 40px;
+		}
+
+		.ant-table-cell {
+			min-width: 223px !important;
+			max-width: 223px !important;
+		}
+
+		.ant-table-row-expand-icon-cell {
+			min-width: 30px !important;
+			max-width: 30px !important;
+		}
+	}
+}

frontend/src/container/InfraMonitoringK8s/Nodes/K8sNodesList.tsx

@@ -1,6 +1,7 @@
 /* eslint-disable no-restricted-syntax */
 /* eslint-disable @typescript-eslint/explicit-function-return-type */
 import '../InfraMonitoringK8s.styles.scss';
+import './K8sNodesList.styles.scss';
 
 import { LoadingOutlined } from '@ant-design/icons';
 import {
@@ -28,7 +29,6 @@ import { GlobalReducer } from 'types/reducer/globalTime';
 import { K8sCategory } from '../constants';
 import K8sHeader from '../K8sHeader';
 import LoadingContainer from '../LoadingContainer';
-import { dummyColumnConfig } from '../utils';
 import NodeDetails from './NodeDetails';
 import {
 	defaultAddedColumns,
@@ -275,10 +275,7 @@ function K8sNodesList({
 		});
 	};
 
-	const nestedColumns = useMemo(() => {
-		const nestedColumns = getK8sNodesListColumns([]);
-		return [dummyColumnConfig, ...nestedColumns];
-	}, []);
+	const nestedColumns = useMemo(() => getK8sNodesListColumns([]), []);
 
 	const isGroupedByAttribute = groupBy.length > 0;
 
@@ -458,7 +455,7 @@ function K8sNodesList({
 
 			{showsNodesTable && (
 				<Table
-					className="k8s-list-table"
+					className="k8s-list-table nodes-list-table"
 					dataSource={isFetching || isLoading ? [] : formattedNodesData}
 					columns={columns}
 					pagination={{

frontend/src/container/InfraMonitoringK8s/Nodes/NodeDetails/Events/NodeEvents.tsx

@@ -77,6 +77,7 @@ export default function Events({
 						aggregateAttribute: {
 							...currentQuery.builder.queryData[0].aggregateAttribute,
 						},
+						filters: [] as any,
 					},
 				],
 			},

frontend/src/container/InfraMonitoringK8s/Nodes/NodeDetails/Logs/NodeLogsDetailedView.tsx

@@ -50,6 +50,7 @@ function NodeLogsDetailedView({
 						aggregateAttribute: {
 							...currentQuery.builder.queryData[0].aggregateAttribute,
 						},
+						filters: [] as any,
 					},
 				],
 			},

frontend/src/container/InfraMonitoringK8s/Nodes/NodeDetails/Metrics/constants.ts

@@ -18,11 +18,11 @@ export const nodeWidgetInfo = [
 	},
 	{
 		title: 'CPU Usage (%)',
-		yAxisUnit: 'percent',
+		yAxisUnit: 'percentunit',
 	},
 	{
 		title: 'Memory Usage (%)',
-		yAxisUnit: 'percent',
+		yAxisUnit: 'percentunit',
 	},
 	{
 		title: 'Pods by CPU (top 10)',
@@ -46,7 +46,7 @@ export const nodeWidgetInfo = [
 	},
 	{
 		title: 'Filesystem usage (%)',
-		yAxisUnit: 'percent',
+		yAxisUnit: 'percentunit',
 	},
 ];
 

frontend/src/container/InfraMonitoringK8s/Nodes/NodeDetails/NodeDetails.tsx

@@ -95,9 +95,22 @@ function NodeDetails({
 					op: '=',
 					value: node?.meta.k8s_node_name || '',
 				},
+				{
+					id: uuidv4(),
+					key: {
+						key: QUERY_KEYS.K8S_CLUSTER_NAME,
+						dataType: DataTypes.String,
+						type: 'resource',
+						isColumn: false,
+						isJSON: false,
+						id: 'k8s_node_name--string--resource--false',
+					},
+					op: '=',
+					value: node?.meta.k8s_cluster_name || '',
+				},
 			],
 		}),
-		[node?.meta.k8s_node_name],
+		[node?.meta.k8s_node_name, node?.meta.k8s_cluster_name],
 	);
 
 	const initialEventsFilters = useMemo(

frontend/src/container/InfraMonitoringK8s/Nodes/NodeDetails/Traces/NodeTraces.tsx

@@ -67,6 +67,7 @@ function NodeTraces({
 						aggregateAttribute: {
 							...currentQuery.builder.queryData[0].aggregateAttribute,
 						},
+						filters: [] as any,
 					},
 				],
 			},

frontend/src/container/InfraMonitoringK8s/Nodes/NodeDetails/constants.ts

@@ -16,4 +16,5 @@ export const QUERY_KEYS = {
 	K8S_OBJECT_KIND: 'k8s.object.kind',
 	K8S_OBJECT_NAME: 'k8s.object.name',
 	K8S_NODE_NAME: 'k8s.node.name',
+	K8S_CLUSTER_NAME: 'k8s.cluster.name',
 };

frontend/src/container/InfraMonitoringK8s/Nodes/utils.tsx

@@ -24,25 +24,25 @@ export const defaultAddedColumns: IEntityColumn[] = [
 		canRemove: false,
 	},
 	{
-		label: 'CPU Utilization (cores)',
+		label: 'CPU Usage (cores)',
 		value: 'cpu',
 		id: 'cpu',
 		canRemove: false,
 	},
 	{
-		label: 'CPU Allocatable (cores)',
+		label: 'CPU Alloc (cores)',
 		value: 'cpu_allocatable',
 		id: 'cpu_allocatable',
 		canRemove: false,
 	},
 	{
-		label: 'Memory Utilization (bytes)',
+		label: 'Memory Usage (bytes)',
 		value: 'memory',
 		id: 'memory',
 		canRemove: false,
 	},
 	{
-		label: 'Memory Allocatable (bytes)',
+		label: 'Memory Alloc (bytes)',
 		value: 'memory_allocatable',
 		id: 'memory_allocatable',
 		canRemove: false,
@@ -89,45 +89,45 @@ const columnsConfig = [
 		dataIndex: 'nodeName',
 		key: 'nodeName',
 		ellipsis: true,
-		width: 120,
-		sorter: true,
+		width: 80,
+		sorter: false,
 		align: 'left',
 	},
 	{
 		title: <div className="column-header-left">Cluster Name</div>,
 		dataIndex: 'clusterName',
 		key: 'clusterName',
 		ellipsis: true,
-		width: 120,
-		sorter: true,
+		width: 80,
+		sorter: false,
 		align: 'left',
 	},
 	{
-		title: <div className="column-header-left">CPU Utilization (cores)</div>,
+		title: <div className="column-header-left">CPU Usage (cores)</div>,
 		dataIndex: 'cpu',
 		key: 'cpu',
 		width: 80,
 		sorter: true,
 		align: 'left',
 	},
 	{
-		title: <div className="column-header-left">CPU Allocatable (cores)</div>,
+		title: <div className="column-header-left">CPU Alloc (cores)</div>,
 		dataIndex: 'cpu_allocatable',
 		key: 'cpu_allocatable',
 		width: 80,
 		sorter: true,
 		align: 'left',
 	},
 	{
-		title: <div className="column-header-left">Memory Utilization (bytes)</div>,
+		title: <div className="column-header-left">Memory Usage (bytes)</div>,
 		dataIndex: 'memory',
 		key: 'memory',
 		width: 80,
 		sorter: true,
 		align: 'left',
 	},
 	{
-		title: <div className="column-header-left">Memory Allocatable (bytes)</div>,
+		title: <div className="column-header-left">Memory Alloc (bytes)</div>,
 		dataIndex: 'memory_allocatable',
 		key: 'memory_allocatable',
 		width: 80,
@@ -179,11 +179,9 @@ export const formatDataForTable = (
 		key: `${node.nodeUID}-${index}`,
 		nodeUID: node.nodeUID || '',
 		nodeName: (
-			<div className="pod-name-container">
-				<Tooltip title={node.meta.k8s_node_name}>
-					<div className="pod-name">{node.meta.k8s_node_name || ''}</div>
-				</Tooltip>
-			</div>
+			<Tooltip title={node.meta.k8s_node_name}>
+				{node.meta.k8s_node_name || ''}
+			</Tooltip>
 		),
 		clusterName: node.meta.k8s_cluster_name,
 		cpu: (

frontend/src/container/InfraMonitoringK8s/constants.ts

@@ -157,14 +157,13 @@ export const PodsQuickFiltersConfig: IQuickFiltersConfig[] = [
 export const NodesQuickFiltersConfig: IQuickFiltersConfig[] = [
 	{
 		type: FiltersType.CHECKBOX,
-		title: 'Node',
+		title: 'Node Name',
 		attributeKey: {
 			key: 'k8s_node_name',
 			dataType: DataTypes.String,
 			type: 'resource',
 			isColumn: false,
 			isJSON: false,
-			// id: 'k8s_pod_name--string--tag--true',
 		},
 		aggregateOperator: 'noop',
 		aggregateAttribute: 'k8s_pod_cpu_utilization',