Fix consumer groups page (#891)

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

@@ -2,6 +2,7 @@ import React from 'react';
 import { ConsumerGroupTopicPartition } from 'generated-sources';
 import { NavLink } from 'react-router-dom';
 import { ClusterName } from 'redux/interfaces/cluster';
+import { clusterTopicPath } from 'lib/paths';
 
 interface Props {
   clusterName: ClusterName;
@@ -16,7 +17,7 @@ const ListItem: React.FC<Props> = ({ clusterName, consumer }) => {
       <td>
         <NavLink
           exact
-          to={`/clusters/${clusterName}/topics/${consumer.topic}`}
+          to={clusterTopicPath(clusterName, consumer.topic)}
           activeClassName="is-active"
           className="title is-6"
         >

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

@@ -40,6 +40,7 @@ export interface Props {
       partitions: number[];
     }
   ): void;
+  resetResettingStatus: () => void;
 }
 
 interface FormType {
@@ -57,6 +58,7 @@ const ResetOffsets: React.FC<Props> = ({
   IsOffsetReset,
   fetchConsumerGroupDetails,
   resetConsumerGroupOffsets,
+  resetResettingStatus,
 }) => {
   React.useEffect(() => {
     fetchConsumerGroupDetails(clusterName, consumerGroupID);
@@ -158,6 +160,7 @@ const ResetOffsets: React.FC<Props> = ({
   const history = useHistory();
   React.useEffect(() => {
     if (IsOffsetReset) {
+      resetResettingStatus();
       history.push(
         clusterConsumerGroupDetailsPath(clusterName, consumerGroupID)
       );

kafka-ui-react-app/src/components/ConsumerGroups/Details/ResetOffsets/ResetOffsetsContainer.ts

@@ -9,6 +9,7 @@ import {
 import {
   fetchConsumerGroupDetails,
   resetConsumerGroupOffsets,
+  resetConsumerGroupOffsetsAction,
 } from 'redux/actions';
 
 import ResetOffsets from './ResetOffsets';
@@ -38,6 +39,7 @@ const mapStateToProps = (
 const mapDispatchToProps = {
   fetchConsumerGroupDetails,
   resetConsumerGroupOffsets,
+  resetResettingStatus: resetConsumerGroupOffsetsAction.cancel,
 };
 
 export default withRouter(

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

@@ -68,6 +68,7 @@ const setupWrapper = (props?: Partial<Props>) => (
       IsOffsetReset={false}
       fetchConsumerGroupDetails={jest.fn()}
       resetConsumerGroupOffsets={jest.fn()}
+      resetResettingStatus={jest.fn()}
       {...props}
     />
   </StaticRouter>

kafka-ui-react-app/src/redux/actions/actions.ts

@@ -321,5 +321,6 @@ export const resetExecutionResult = createAction('RESET_EXECUTE_KSQL')();
 export const resetConsumerGroupOffsetsAction = createAsyncAction(
   'RESET_OFFSETS__REQUEST',
   'RESET_OFFSETS__SUCCESS',
-  'RESET_OFFSETS__FAILURE'
-)<undefined, undefined, { alert?: FailurePayload }>();
+  'RESET_OFFSETS__FAILURE',
+  'RESET_OFFSETS__CANCEL'
+)<undefined, undefined, { alert?: FailurePayload }, undefined>();