Repository: provectus/kafka-ui
Issue: Get rid of zookeeper
Labels: type/enhancement
good first issue
scope/backend
scope/frontend
status/accepted
type/chore


Issue comments:
@Mgrdich need to get rid of zk status badge in UI

Pull request review comments:

Patch that resolved the issue:
diff --git a/kafka-ui-react-app/src/components/Brokers/Brokers.tsx b/kafka-ui-react-app/src/components/Brokers/Brokers.tsx
index fb2087d3213..506856d14af 100644
--- a/kafka-ui-react-app/src/components/Brokers/Brokers.tsx
+++ b/kafka-ui-react-app/src/components/Brokers/Brokers.tsx
@@ -1,9 +1,8 @@
 import React from 'react';
-import { ClusterName, ZooKeeperStatus } from 'redux/interfaces';
+import { ClusterName } from 'redux/interfaces';
 import useInterval from 'lib/hooks/useInterval';
 import BytesFormatted from 'components/common/BytesFormatted/BytesFormatted';
 import { useParams } from 'react-router';
-import { Tag } from 'components/common/Tag/Tag.styled';
 import TableHeaderCell from 'components/common/table/TableHeaderCell/TableHeaderCell';
 import { Table } from 'components/common/table/Table/Table.styled';
 import PageHeading from 'components/common/PageHeading/PageHeading';
@@ -21,7 +20,6 @@ const Brokers: React.FC = () => {
   const {
     brokerCount,
     activeControllers,
-    zooKeeperStatus,
     onlinePartitionCount,
     offlinePartitionCount,
     inSyncReplicasCount,
@@ -45,7 +43,6 @@ const Brokers: React.FC = () => {
     fetchBrokers(clusterName);
   }, 5000);
 
-  const zkOnline = zooKeeperStatus === ZooKeeperStatus.online;
   return (
     <>
       <PageHeading text="Brokers" />
@@ -57,11 +54,6 @@ const Brokers: React.FC = () => {
           <Metrics.Indicator label="Active Controllers">
             {activeControllers}
           </Metrics.Indicator>
-          <Metrics.Indicator label="Zookeeper Status">
-            <Tag color={zkOnline ? 'green' : 'gray'}>
-              {zkOnline ? 'online' : 'offline'}
-            </Tag>
-          </Metrics.Indicator>
           <Metrics.Indicator label="Version">{version}</Metrics.Indicator>
         </Metrics.Section>
         <Metrics.Section title="Partitions">
diff --git a/kafka-ui-react-app/src/redux/actions/__test__/fixtures.ts b/kafka-ui-react-app/src/redux/actions/__test__/fixtures.ts
index d4a007aaaa9..c7aaff49682 100644
--- a/kafka-ui-react-app/src/redux/actions/__test__/fixtures.ts
+++ b/kafka-ui-react-app/src/redux/actions/__test__/fixtures.ts
@@ -9,7 +9,6 @@ import {
 
 export const clusterStats: ClusterStats = {
   brokerCount: 1,
-  zooKeeperStatus: 1,
   activeControllers: 1,
   onlinePartitionCount: 6,
   offlinePartitionCount: 0,
diff --git a/kafka-ui-react-app/src/redux/interfaces/broker.ts b/kafka-ui-react-app/src/redux/interfaces/broker.ts
index a0bf9ceae6d..b9dfa7d30d8 100644
--- a/kafka-ui-react-app/src/redux/interfaces/broker.ts
+++ b/kafka-ui-react-app/src/redux/interfaces/broker.ts
@@ -2,11 +2,6 @@ import { ClusterStats, Broker } from 'generated-sources';
 
 export type BrokerId = Broker['id'];
 
-export enum ZooKeeperStatus {
-  offline,
-  online,
-}
-
 export interface BrokersState extends ClusterStats {
   items: Broker[];
 }
diff --git a/kafka-ui-react-app/src/redux/reducers/brokers/__test__/fixtures.ts b/kafka-ui-react-app/src/redux/reducers/brokers/__test__/fixtures.ts
index b3ddb147ad4..b5b953e6696 100644
--- a/kafka-ui-react-app/src/redux/reducers/brokers/__test__/fixtures.ts
+++ b/kafka-ui-react-app/src/redux/reducers/brokers/__test__/fixtures.ts
@@ -5,7 +5,6 @@ export const brokersPayload = [
 
 export const clusterStatsPayload = {
   brokerCount: 2,
-  zooKeeperStatus: 1,
   activeControllers: 1,
   onlinePartitionCount: 138,
   offlinePartitionCount: 0,
@@ -22,7 +21,6 @@ export const clusterStatsPayload = {
 export const initialBrokersReducerState = {
   items: brokersPayload,
   brokerCount: 2,
-  zooKeeperStatus: 1,
   activeControllers: 1,
   onlinePartitionCount: 138,
   offlinePartitionCount: 0,
@@ -39,7 +37,6 @@ export const initialBrokersReducerState = {
 export const updatedBrokersReducerState = {
   items: brokersPayload,
   brokerCount: 2,
-  zooKeeperStatus: 1,
   activeControllers: 1,
   onlinePartitionCount: 138,
   offlinePartitionCount: 0,
diff --git a/kafka-ui-react-app/src/redux/reducers/brokers/__test__/selectors.spec.ts b/kafka-ui-react-app/src/redux/reducers/brokers/__test__/selectors.spec.ts
index ec652138b58..119d984cf6a 100644
--- a/kafka-ui-react-app/src/redux/reducers/brokers/__test__/selectors.spec.ts
+++ b/kafka-ui-react-app/src/redux/reducers/brokers/__test__/selectors.spec.ts
@@ -14,9 +14,6 @@ describe('Brokers selectors', () => {
     it('returns broker count', () => {
       expect(selectors.getBrokerCount(getState())).toEqual(0);
     });
-    it('returns zooKeeper status', () => {
-      expect(selectors.getZooKeeperStatus(getState())).toEqual(0);
-    });
     it('returns active controllers', () => {
       expect(selectors.getActiveControllers(getState())).toEqual(0);
     });
@@ -55,9 +52,6 @@ describe('Brokers selectors', () => {
     it('returns broker count', () => {
       expect(selectors.getBrokerCount(getState())).toEqual(2);
     });
-    it('returns zooKeeper status', () => {
-      expect(selectors.getZooKeeperStatus(getState())).toEqual(1);
-    });
     it('returns active controllers', () => {
       expect(selectors.getActiveControllers(getState())).toEqual(1);
     });
diff --git a/kafka-ui-react-app/src/redux/reducers/brokers/brokersSlice.ts b/kafka-ui-react-app/src/redux/reducers/brokers/brokersSlice.ts
index c6d353cc520..d7c762e4a62 100644
--- a/kafka-ui-react-app/src/redux/reducers/brokers/brokersSlice.ts
+++ b/kafka-ui-react-app/src/redux/reducers/brokers/brokersSlice.ts
@@ -1,10 +1,5 @@
 import { BrokersApi, ClustersApi, Configuration } from 'generated-sources';
-import {
-  BrokersState,
-  ClusterName,
-  RootState,
-  ZooKeeperStatus,
-} from 'redux/interfaces';
+import { BrokersState, ClusterName, RootState } from 'redux/interfaces';
 import { createAsyncThunk, createSlice } from '@reduxjs/toolkit';
 import { BASE_PARAMS } from 'lib/constants';
 
@@ -26,7 +21,6 @@ export const fetchClusterStats = createAsyncThunk(
 export const initialState: BrokersState = {
   items: [],
   brokerCount: 0,
-  zooKeeperStatus: ZooKeeperStatus.offline,
   activeControllers: 0,
   onlinePartitionCount: 0,
   offlinePartitionCount: 0,
diff --git a/kafka-ui-react-app/src/redux/reducers/brokers/selectors.ts b/kafka-ui-react-app/src/redux/reducers/brokers/selectors.ts
index c6038a09b3f..31654a70d83 100644
--- a/kafka-ui-react-app/src/redux/reducers/brokers/selectors.ts
+++ b/kafka-ui-react-app/src/redux/reducers/brokers/selectors.ts
@@ -7,10 +7,6 @@ export const getBrokerCount = createSelector(
   brokersState,
   ({ brokerCount }) => brokerCount
 );
-export const getZooKeeperStatus = createSelector(
-  brokersState,
-  ({ zooKeeperStatus }) => zooKeeperStatus
-);
 export const getActiveControllers = createSelector(
   brokersState,
   ({ activeControllers }) => activeControllers


Test patch: