[FE] Fix deleting a consumer hangs the page (#3116)

remove getIsConsumerGroupDeleted from consumerGroupsSlice.ts

Co-authored-by: davitbejanyan <dbejanyan@provectus.com>

kafka-ui-react-app/src/components/ConsumerGroups/Details/Details.tsx

@@ -18,10 +18,9 @@ import TableHeaderCell from 'components/common/table/TableHeaderCell/TableHeader
 import { useAppDispatch, useAppSelector } from 'lib/hooks/redux';
 import {
   deleteConsumerGroup,
+  selectById,
   fetchConsumerGroupDetails,
   getAreConsumerGroupDetailsFulfilled,
-  getIsConsumerGroupDeleted,
-  selectById,
 } from 'redux/reducers/consumerGroups/consumerGroupsSlice';
 import getTagColor from 'components/common/Tag/getTagColor';
 import { Dropdown } from 'components/common/Dropdown';
@@ -41,23 +40,19 @@ const Details: React.FC = () => {
   const consumerGroup = useAppSelector((state) =>
     selectById(state, consumerGroupID)
   );
-  const isDeleted = useAppSelector(getIsConsumerGroupDeleted);
   const isFetched = useAppSelector(getAreConsumerGroupDetailsFulfilled);
 
   React.useEffect(() => {
     dispatch(fetchConsumerGroupDetails({ clusterName, consumerGroupID }));
   }, [clusterName, consumerGroupID, dispatch]);
 
-  const onDelete = () => {
-    dispatch(deleteConsumerGroup({ clusterName, consumerGroupID }));
+  const onDelete = async () => {
+    const res = await dispatch(
+      deleteConsumerGroup({ clusterName, consumerGroupID })
+    ).unwrap();
+    if (res) navigate('../');
   };
 
-  React.useEffect(() => {
-    if (isDeleted) {
-      navigate('../');
-    }
-  }, [clusterName, navigate, isDeleted]);
-
   const onResetOffsets = () => {
     navigate(clusterConsumerGroupResetRelativePath);
   };

kafka-ui-react-app/src/redux/reducers/consumerGroups/consumerGroupsSlice.ts

@@ -195,11 +195,6 @@ export const getAreConsumerGroupsPagedFulfilled = createSelector(
   (status) => status === AsyncRequestStatus.fulfilled
 );
 
-export const getIsConsumerGroupDeleted = createSelector(
-  createFetchingSelector('consumerGroups/deleteConsumerGroup'),
-  (status) => status === AsyncRequestStatus.fulfilled
-);
-
 export const getAreConsumerGroupDetailsFulfilled = createSelector(
   createFetchingSelector('consumerGroups/fetchConsumerGroupDetails'),
   (status) => status === AsyncRequestStatus.fulfilled