diff --git a/kafka-ui-react-app/src/components/Brokers/Brokers.tsx b/kafka-ui-react-app/src/components/Brokers/Brokers.tsx index 3a6466f0b5..4449077404 100644 --- a/kafka-ui-react-app/src/components/Brokers/Brokers.tsx +++ b/kafka-ui-react-app/src/components/Brokers/Brokers.tsx @@ -10,6 +10,7 @@ import PageHeading from 'components/common/PageHeading/PageHeading'; import * as Metrics from 'components/common/Metrics'; import { useAppDispatch, useAppSelector } from 'lib/hooks/redux'; import { + fetchBrokers, fetchClusterStats, selectStats, } from 'redux/reducers/brokers/brokersSlice'; @@ -28,6 +29,7 @@ const Brokers: React.FC = () => { underReplicatedPartitionCount, diskUsage, version, + items, } = useAppSelector(selectStats); let replicas = inSyncReplicasCount ?? 0; @@ -35,14 +37,15 @@ const Brokers: React.FC = () => { React.useEffect(() => { dispatch(fetchClusterStats(clusterName)); - }, [clusterName, dispatch]); + dispatch(fetchBrokers(clusterName)); + }, [fetchClusterStats, fetchBrokers, clusterName, dispatch]); useInterval(() => { fetchClusterStats(clusterName); + fetchBrokers(clusterName); }, 5000); const zkOnline = zooKeeperStatus === ZooKeeperStatus.online; - return ( <> @@ -122,6 +125,8 @@ const Brokers: React.FC = () => { + + @@ -133,6 +138,8 @@ const Brokers: React.FC = () => { {segmentCount} + {items && items[brokerId]?.port} + {items && items[brokerId]?.host} )) ) : (