kafka-ui/kafka-ui-react-app/src/components/Brokers/BrokersContainer.ts

import { connect } from 'react-redux';
import {
  fetchBrokers,
  fetchBrokerMetrics,
} from 'redux/actions';
import Brokers from './Brokers';
import * as brokerSelectors from 'redux/reducers/brokers/selectors';
import { RootState, ClusterName } from 'redux/interfaces';
import { RouteComponentProps } from 'react-router-dom';

interface RouteProps {
  clusterName: ClusterName;
}

interface OwnProps extends RouteComponentProps<RouteProps> { }

const mapStateToProps = (state: RootState, { match: { params: { clusterName } }}: OwnProps) => ({
  isFetched: brokerSelectors.getIsBrokerListFetched(state),
  clusterName,
  brokerCount: brokerSelectors.getBrokerCount(state),
  zooKeeperStatus: brokerSelectors.getZooKeeperStatus(state),
  activeControllers: brokerSelectors.getActiveControllers(state),
  onlinePartitionCount: brokerSelectors.getOnlinePartitionCount(state),
  offlinePartitionCount: brokerSelectors.getOfflinePartitionCount(state),
  underReplicatedPartitionCount: brokerSelectors.getUnderReplicatedPartitionCount(state)
});

const mapDispatchToProps = {
  fetchBrokers: (clusterName: ClusterName) => fetchBrokers(clusterName),
  fetchBrokerMetrics: (clusterName: ClusterName) => fetchBrokerMetrics(clusterName),
};

export default connect(mapStateToProps, mapDispatchToProps)(Brokers);