Repository: provectus/kafka-ui
Issue: In case of editing Partition number of Topic update is available only after refreshing 
Labels: type/bug
good first issue
scope/frontend
status/accepted
status/confirmed

**Describe the bug**
Partition count update is not available at once with edit, it's updating only after refreshing Topics

**Steps to Reproduce**
Steps to reproduce the behavior:

1. Login to System
2. Navigate to Topics
3. Open the Topic
4. Press 'Edit Settings'
5. Change the 'Number of partitions *'
6. Press 'Submit'
7. Turn back to Topic
8. Open the Settings to check the count of Partitions

**Expected behavior**

- Should be displayed Success message about update 
- Update should be available without refreshing the Topics

**Screenshots**


https://user-images.githubusercontent.com/104780608/170209809-f89ab523-e760-4174-982c-91778aa4ae94.mov





Issue comments:

Pull request review comments:
isn't return; same as return undefined ?
not in this case, we need to write return value otherwise it throws error like this in catch block that 'Async arrow function expected no return value.'

Patch that resolved the issue:
diff --git a/kafka-ui-react-app/src/redux/reducers/topics/__test__/reducer.spec.ts b/kafka-ui-react-app/src/redux/reducers/topics/__test__/reducer.spec.ts
index 997b88e0f2e..c81eb696e18 100644
--- a/kafka-ui-react-app/src/redux/reducers/topics/__test__/reducer.spec.ts
+++ b/kafka-ui-react-app/src/redux/reducers/topics/__test__/reducer.spec.ts
@@ -29,6 +29,10 @@ import { consumerGroupPayload } from 'redux/reducers/consumerGroups/__test__/fix
 import fetchMock from 'fetch-mock-jest';
 import mockStoreCreator from 'redux/store/configureStore/mockStoreCreator';
 import { getTypeAndPayload } from 'lib/testHelpers';
+import {
+  alertAdded,
+  showSuccessAlert,
+} from 'redux/reducers/alerts/alertsSlice';
 
 const topic = {
   name: 'topic',
@@ -658,6 +662,17 @@ describe('topics Slice', () => {
       });
     });
     describe('updateTopicPartitionsCount', () => {
+      const RealDate = Date.now;
+
+      beforeAll(() => {
+        global.Date.now = jest.fn(() =>
+          new Date('2019-04-07T10:20:30Z').getTime()
+        );
+      });
+
+      afterAll(() => {
+        global.Date.now = RealDate;
+      });
       it('updateTopicPartitionsCount/fulfilled', async () => {
         fetchMock.patchOnce(
           `/api/clusters/${clusterName}/topics/${topicName}/partitions`,
@@ -670,9 +685,21 @@ describe('topics Slice', () => {
             partitions: 1,
           })
         );
-
         expect(getTypeAndPayload(store)).toEqual([
           { type: updateTopicPartitionsCount.pending.type },
+          { type: showSuccessAlert.pending.type },
+          {
+            type: alertAdded.type,
+            payload: {
+              id: 'message-topic-local-1',
+              title: '',
+              type: 'success',
+              createdAt: global.Date.now(),
+              message: 'Number of partitions successfully increased!',
+            },
+          },
+          { type: fetchTopicDetails.pending.type },
+          { type: showSuccessAlert.fulfilled.type },
           {
             type: updateTopicPartitionsCount.fulfilled.type,
           },
diff --git a/kafka-ui-react-app/src/redux/reducers/topics/topicsSlice.ts b/kafka-ui-react-app/src/redux/reducers/topics/topicsSlice.ts
index 9aac1079b42..3a35cc3d0ee 100644
--- a/kafka-ui-react-app/src/redux/reducers/topics/topicsSlice.ts
+++ b/kafka-ui-react-app/src/redux/reducers/topics/topicsSlice.ts
@@ -33,6 +33,7 @@ import {
 import { BASE_PARAMS } from 'lib/constants';
 import { getResponse } from 'lib/errorHandling';
 import { clearTopicMessages } from 'redux/reducers/topicMessages/topicMessagesSlice';
+import { showSuccessAlert } from 'redux/reducers/alerts/alertsSlice';
 
 const apiClientConf = new Configuration(BASE_PARAMS);
 const topicsApiClient = new TopicsApi(apiClientConf);
@@ -243,21 +244,30 @@ export const updateTopicPartitionsCount = createAsyncThunk<
     topicName: TopicName;
     partitions: number;
   }
->('topic/updateTopicPartitionsCount', async (payload, { rejectWithValue }) => {
-  try {
-    const { clusterName, topicName, partitions } = payload;
-
-    await topicsApiClient.increaseTopicPartitions({
-      clusterName,
-      topicName,
-      partitionsIncrease: { totalPartitionsCount: partitions },
-    });
+>(
+  'topic/updateTopicPartitionsCount',
+  async (payload, { rejectWithValue, dispatch }) => {
+    try {
+      const { clusterName, topicName, partitions } = payload;
 
-    return undefined;
-  } catch (err) {
-    return rejectWithValue(await getResponse(err as Response));
+      await topicsApiClient.increaseTopicPartitions({
+        clusterName,
+        topicName,
+        partitionsIncrease: { totalPartitionsCount: partitions },
+      });
+      dispatch(
+        showSuccessAlert({
+          id: `message-${topicName}-${clusterName}-${partitions}`,
+          message: 'Number of partitions successfully increased!',
+        })
+      );
+      dispatch(fetchTopicDetails({ clusterName, topicName }));
+      return undefined;
+    } catch (err) {
+      return rejectWithValue(await getResponse(err as Response));
+    }
   }
-});
+);
 
 export const updateTopicReplicationFactor = createAsyncThunk<
   undefined,


Test patch: