fix: require ConnectStatus only for network table (#2510)

Author: artemmufazalov

src/components/NetworkTable/columns.tsx

@@ -5,7 +5,7 @@ import {
     getConnectionsColumn,
     getCpuColumn,
     getDataCenterColumn,
-    getHostColumn,
+    getNetworkHostColumn,
     getNetworkUtilizationColumn,
     getNodeIdColumn,
     getPingTimeColumn,
@@ -21,7 +21,7 @@ import type {GetNodesColumnsParams} from '../nodesColumns/types';
 export function getNetworkTableNodesColumns(params: GetNodesColumnsParams) {
     const columns: Column<NodesPreparedEntity>[] = [
         getNodeIdColumn(),
-        getHostColumn(params, {statusForIcon: 'ConnectStatus'}),
+        getNetworkHostColumn(params),
         getDataCenterColumn(),
         getRackColumn(),
         getUptimeColumn(),

src/components/NodeHostWrapper/NodeHostWrapper.tsx

@@ -16,20 +16,18 @@ export type NodeHostData = NodeAddress &
         TenantName?: string;
     };
 
-export type StatusForIcon = 'SystemState' | 'ConnectStatus';
-
 interface NodeHostWrapperProps {
     node: NodeHostData;
     getNodeRef?: GetNodeRefFunc;
     database?: string;
-    statusForIcon?: StatusForIcon;
+    statusForIcon?: 'SystemState' | 'ConnectStatus';
 }
 
 export const NodeHostWrapper = ({
     node,
     getNodeRef,
     database,
-    statusForIcon,
+    statusForIcon = 'SystemState',
 }: NodeHostWrapperProps) => {
     if (!node.Host) {
         return <span>—</span>;

src/components/nodesColumns/columns.tsx

@@ -17,7 +17,7 @@ import {bytesToSpeed, isNumeric} from '../../utils/utils';
 import {CellWithPopover} from '../CellWithPopover/CellWithPopover';
 import {MemoryViewer} from '../MemoryViewer/MemoryViewer';
 import {NodeHostWrapper} from '../NodeHostWrapper/NodeHostWrapper';
-import type {NodeHostData, StatusForIcon} from '../NodeHostWrapper/NodeHostWrapper';
+import type {NodeHostData} from '../NodeHostWrapper/NodeHostWrapper';
 import {PoolsGraph} from '../PoolsGraph/PoolsGraph';
 import {ProgressViewer} from '../ProgressViewer/ProgressViewer';
 import {TabletsStatistic} from '../TabletsStatistic';
@@ -44,20 +44,38 @@ export function getNodeIdColumn<T extends {NodeId?: string | number}>(): Column<
         align: DataTable.RIGHT,
     };
 }
-export function getHostColumn<T extends NodeHostData>(
-    {getNodeRef, database}: GetNodesColumnsParams,
-    {statusForIcon = 'SystemState'}: {statusForIcon?: StatusForIcon} = {},
-): Column<T> {
+export function getHostColumn<T extends NodeHostData>({
+    getNodeRef,
+    database,
+}: GetNodesColumnsParams): Column<T> {
     return {
         name: NODES_COLUMNS_IDS.Host,
         header: NODES_COLUMNS_TITLES.Host,
+        render: ({row}) => {
+            return <NodeHostWrapper node={row} getNodeRef={getNodeRef} database={database} />;
+        },
+        width: 350,
+        align: DataTable.LEFT,
+    };
+}
+
+// Different column for different set of required fields
+// ConnectStatus is required here, it makes handler to return network stats
+// On versions before 25-1-2 ConnectStatus also makes handler to return peers - it can significantly increase response size
+export function getNetworkHostColumn<T extends NodeHostData>({
+    getNodeRef,
+    database,
+}: GetNodesColumnsParams): Column<T> {
+    return {
+        name: NODES_COLUMNS_IDS.NetworkHost,
+        header: NODES_COLUMNS_TITLES.NetworkHost,
         render: ({row}) => {
             return (
                 <NodeHostWrapper
                     node={row}
                     getNodeRef={getNodeRef}
                     database={database}
-                    statusForIcon={statusForIcon}
+                    statusForIcon={'ConnectStatus'}
                 />
             );
         },

src/components/nodesColumns/constants.ts

@@ -8,6 +8,7 @@ export const NODES_COLUMNS_WIDTH_LS_KEY = 'nodesTableColumnsWidth';
 export const NODES_COLUMNS_IDS = {
     NodeId: 'NodeId',
     Host: 'Host',
+    NetworkHost: 'NetworkHost',
     Database: 'Database',
     NodeName: 'NodeName',
     DC: 'DC',
@@ -51,6 +52,9 @@ export const NODES_COLUMNS_TITLES = {
     get Host() {
         return i18n('host');
     },
+    get NetworkHost() {
+        return i18n('host');
+    },
     get Database() {
         return i18n('database');
     },
@@ -178,7 +182,8 @@ export function getNodesGroupByFieldTitle(groupByField: NodesGroupByField) {
 // Also for some columns we may use more than one field
 export const NODES_COLUMNS_TO_DATA_FIELDS: Record<NodesColumnId, NodesRequiredField[]> = {
     NodeId: ['NodeId'],
-    Host: ['Host', 'Rack', 'Database', 'SystemState', 'ConnectStatus'],
+    Host: ['Host', 'Rack', 'Database', 'SystemState'],
+    NetworkHost: ['Host', 'Rack', 'Database', 'SystemState', 'ConnectStatus'],
     Database: ['Database'],
     NodeName: ['NodeName'],
     DC: ['DC'],
@@ -207,6 +212,7 @@ export const NODES_COLUMNS_TO_DATA_FIELDS: Record<NodesColumnId, NodesRequiredFi
 const NODES_COLUMNS_TO_SORT_FIELDS: Record<NodesColumnId, NodesSortValue | undefined> = {
     NodeId: 'NodeId',
     Host: 'Host',
+    NetworkHost: 'Host',
     Database: 'Database',
     NodeName: 'NodeName',
     DC: 'DC',