diff --git a/kafka-ui-react-app/README.md b/kafka-ui-react-app/README.md
index 43af77d4f5a..dfd8e75dfe3 100644
--- a/kafka-ui-react-app/README.md
+++ b/kafka-ui-react-app/README.md
@@ -1,7 +1,9 @@
 # UI for Apache Kafka
 UI for Apache Kafka management
 
-[![Quality Gate Status](https://sonarcloud.io/api/project_badges/measure?project=provectus_kafka-ui_frontend&metric=alert_status)](https://sonarcloud.io/dashboard?id=provectus_kafka-ui_frontend)
+[![Quality Gate Status](https://sonarcloud.io/api/project_badges/measure?project=com.provectus%3Akafka-ui_frontend&metric=alert_status)](https://sonarcloud.io/summary/new_code?id=com.provectus%3Akafka-ui_frontend)
+[![Security Rating](https://sonarcloud.io/api/project_badges/measure?project=com.provectus%3Akafka-ui_frontend&metric=security_rating)](https://sonarcloud.io/summary/new_code?id=com.provectus%3Akafka-ui_frontend)
+[![Coverage](https://sonarcloud.io/api/project_badges/measure?project=com.provectus%3Akafka-ui_frontend&metric=coverage)](https://sonarcloud.io/summary/new_code?id=com.provectus%3Akafka-ui_frontend)
 
 ## Table of contents
 - [Requirements](#requirements)
diff --git a/kafka-ui-react-app/src/components/Brokers/Brokers.tsx b/kafka-ui-react-app/src/components/Brokers/Brokers.tsx
index 6d20911714f..bb8f40f290f 100644
--- a/kafka-ui-react-app/src/components/Brokers/Brokers.tsx
+++ b/kafka-ui-react-app/src/components/Brokers/Brokers.tsx
@@ -32,7 +32,7 @@ const Brokers: React.FC = () => {
 
   const replicas = inSyncReplicasCount ?? 0 + (outOfSyncReplicasCount ?? 0);
   const areAllInSync = inSyncReplicasCount && replicas === inSyncReplicasCount;
-
+  const partitionIsOffline = offlinePartitionCount && offlinePartitionCount > 0;
   React.useEffect(() => {
     dispatch(fetchClusterStats(clusterName));
     dispatch(fetchBrokers(clusterName));
@@ -60,13 +60,9 @@ const Brokers: React.FC = () => {
           <Metrics.Indicator
             label="Online"
             isAlert
-            alertType={
-              offlinePartitionCount && offlinePartitionCount > 0
-                ? 'error'
-                : 'success'
-            }
+            alertType={partitionIsOffline ? 'error' : 'success'}
           >
-            {offlinePartitionCount && offlinePartitionCount > 0 ? (
+            {partitionIsOffline ? (
               <Metrics.RedText>{onlinePartitionCount}</Metrics.RedText>
             ) : (
               onlinePartitionCount
@@ -80,11 +76,9 @@ const Brokers: React.FC = () => {
             label="URP"
             title="Under replicated partitions"
             isAlert
-            alertType={
-              underReplicatedPartitionCount === 0 ? 'success' : 'error'
-            }
+            alertType={!underReplicatedPartitionCount ? 'success' : 'error'}
           >
-            {underReplicatedPartitionCount === 0 ? (
+            {!underReplicatedPartitionCount ? (
               <Metrics.LightText>
                 {underReplicatedPartitionCount}
               </Metrics.LightText>
diff --git a/kafka-ui-react-app/src/components/Connect/Details/Tasks/ListItem/ListItemContainer.ts b/kafka-ui-react-app/src/components/Connect/Details/Tasks/ListItem/ListItemContainer.ts
index 5cc302d0048..df16bbac130 100644
--- a/kafka-ui-react-app/src/components/Connect/Details/Tasks/ListItem/ListItemContainer.ts
+++ b/kafka-ui-react-app/src/components/Connect/Details/Tasks/ListItem/ListItemContainer.ts
@@ -10,7 +10,7 @@ interface OwnProps extends RouteComponentProps {
   task: Task;
 }
 
-const mapStateToProps = (state: RootState, { task }: OwnProps) => ({
+const mapStateToProps = (_state: RootState, { task }: OwnProps) => ({
   task,
 });
 
diff --git a/kafka-ui-react-app/src/components/Topics/List/List.tsx b/kafka-ui-react-app/src/components/Topics/List/List.tsx
index 362010d1fc7..7431dabf633 100644
--- a/kafka-ui-react-app/src/components/Topics/List/List.tsx
+++ b/kafka-ui-react-app/src/components/Topics/List/List.tsx
@@ -149,6 +149,8 @@ const List: React.FC<TopicsListProps> = ({
     '' | 'deleteTopics' | 'purgeMessages'
   >('');
 
+  const [confirmationModalText, setConfirmationModalText] =
+    React.useState<string>('');
   const closeConfirmationModal = () => {
     setConfirmationModal('');
   };
@@ -157,22 +159,6 @@ const List: React.FC<TopicsListProps> = ({
     tableState.toggleSelection(false);
   }, [tableState]);
 
-  const deleteTopicsHandler = React.useCallback(() => {
-    deleteTopics(clusterName, Array.from(tableState.selectedIds));
-    closeConfirmationModal();
-    clearSelectedTopics();
-  }, [clearSelectedTopics, clusterName, deleteTopics, tableState.selectedIds]);
-  const purgeMessagesHandler = React.useCallback(() => {
-    clearTopicsMessages(clusterName, Array.from(tableState.selectedIds));
-    closeConfirmationModal();
-    clearSelectedTopics();
-  }, [
-    clearSelectedTopics,
-    clearTopicsMessages,
-    clusterName,
-    tableState.selectedIds,
-  ]);
-
   const searchHandler = React.useCallback(
     (searchString: string) => {
       setTopicsSearch(searchString);
@@ -187,6 +173,23 @@ const List: React.FC<TopicsListProps> = ({
     },
     [setTopicsSearch, history, pathname, perPage, page]
   );
+  const deleteOrPurgeConfirmationHandler = React.useCallback(() => {
+    const selectedIds = Array.from(tableState.selectedIds);
+    if (confirmationModal === 'deleteTopics') {
+      deleteTopics(clusterName, selectedIds);
+    } else {
+      clearTopicsMessages(clusterName, selectedIds);
+    }
+    closeConfirmationModal();
+    clearSelectedTopics();
+  }, [
+    confirmationModal,
+    clearSelectedTopics,
+    clusterName,
+    deleteTopics,
+    clearTopicsMessages,
+    tableState.selectedIds,
+  ]);
 
   const ActionsCell = React.memo<TableCellProps<TopicWithDetailedInfo, string>>(
     ({ hovered, dataItem: { internal, cleanUpPolicy, name } }) => {
@@ -306,6 +309,9 @@ const List: React.FC<TopicsListProps> = ({
                   buttonType="secondary"
                   onClick={() => {
                     setConfirmationModal('deleteTopics');
+                    setConfirmationModalText(
+                      'Are you sure you want to remove selected topics?'
+                    );
                   }}
                 >
                   Delete selected topics
@@ -329,6 +335,9 @@ const List: React.FC<TopicsListProps> = ({
                   buttonType="secondary"
                   onClick={() => {
                     setConfirmationModal('purgeMessages');
+                    setConfirmationModalText(
+                      'Are you sure you want to purge messages of selected topics?'
+                    );
                   }}
                 >
                   Purge messages of selected topics
@@ -337,15 +346,9 @@ const List: React.FC<TopicsListProps> = ({
               <ConfirmationModal
                 isOpen={confirmationModal !== ''}
                 onCancel={closeConfirmationModal}
-                onConfirm={
-                  confirmationModal === 'deleteTopics'
-                    ? deleteTopicsHandler
-                    : purgeMessagesHandler
-                }
+                onConfirm={deleteOrPurgeConfirmationHandler}
               >
-                {confirmationModal === 'deleteTopics'
-                  ? 'Are you sure you want to remove selected topics?'
-                  : 'Are you sure you want to purge messages of selected topics?'}
+                {confirmationModalText}
               </ConfirmationModal>
             </>
           )}
diff --git a/kafka-ui-react-app/src/components/Topics/Topic/Details/Messages/Filters/AddEditFilterContainer.tsx b/kafka-ui-react-app/src/components/Topics/Topic/Details/Messages/Filters/AddEditFilterContainer.tsx
index 8f710cb8f54..fcb0da429d1 100644
--- a/kafka-ui-react-app/src/components/Topics/Topic/Details/Messages/Filters/AddEditFilterContainer.tsx
+++ b/kafka-ui-react-app/src/components/Topics/Topic/Details/Messages/Filters/AddEditFilterContainer.tsx
@@ -2,12 +2,12 @@ import React from 'react';
 import * as S from 'components/Topics/Topic/Details/Messages/Filters/Filters.styled';
 import { InputLabel } from 'components/common/Input/InputLabel.styled';
 import Input from 'components/common/Input/Input';
-import { Textarea } from 'components/common/Textbox/Textarea.styled';
 import { FormProvider, Controller, useForm } from 'react-hook-form';
 import { ErrorMessage } from '@hookform/error-message';
 import { Button } from 'components/common/Button/Button';
 import { FormError } from 'components/common/Input/Input.styled';
 import { AddMessageFilters } from 'components/Topics/Topic/Details/Messages/Filters/AddFilter';
+import Editor from 'components/common/Editor/Editor';
 import { yupResolver } from '@hookform/resolvers/yup';
 import yup from 'lib/yupExtended';
 
@@ -66,8 +66,16 @@ const AddEditFilterContainer: React.FC<AddEditFilterContainerProps> = ({
             control={control}
             name="code"
             defaultValue={inputCodeDefaultValue}
-            render={({ field: { onChange, ref } }) => (
-              <Textarea ref={ref} onChange={onChange} />
+            render={({ field: { onChange, value } }) => (
+              <Editor
+                value={value}
+                minLines={5}
+                maxLines={28}
+                onChange={onChange}
+                setOptions={{
+                  showLineNumbers: false,
+                }}
+              />
             )}
           />
         </div>
diff --git a/kafka-ui-react-app/src/components/Topics/Topic/Details/Messages/Filters/__tests__/AddEditFilterContainer.spec.tsx b/kafka-ui-react-app/src/components/Topics/Topic/Details/Messages/Filters/__tests__/AddEditFilterContainer.spec.tsx
index 2760dc25854..dddfb61876d 100644
--- a/kafka-ui-react-app/src/components/Topics/Topic/Details/Messages/Filters/__tests__/AddEditFilterContainer.spec.tsx
+++ b/kafka-ui-react-app/src/components/Topics/Topic/Details/Messages/Filters/__tests__/AddEditFilterContainer.spec.tsx
@@ -41,8 +41,8 @@ describe('AddEditFilterContainer component', () => {
 
       const inputs = screen.getAllByRole('textbox');
 
-      const textAreaElement = inputs[0];
-      userEvent.type(textAreaElement, 'Hello World With TextArea');
+      const textAreaElement = inputs[0] as HTMLTextAreaElement;
+      userEvent.paste(textAreaElement, 'Hello World With TextArea');
 
       const inputNameElement = inputs[1];
       userEvent.type(inputNameElement, 'Hello World!');
@@ -61,8 +61,8 @@ describe('AddEditFilterContainer component', () => {
     it('should view the error message after typing and clearing the input', async () => {
       const inputs = screen.getAllByRole('textbox');
 
-      const textAreaElement = inputs[0];
-      userEvent.type(textAreaElement, 'Hello World With TextArea');
+      const textAreaElement = inputs[0] as HTMLTextAreaElement;
+      userEvent.paste(textAreaElement, 'Hello World With TextArea');
 
       const inputNameElement = inputs[1];
       userEvent.type(inputNameElement, 'Hello World!');
@@ -71,26 +71,25 @@ describe('AddEditFilterContainer component', () => {
       userEvent.clear(textAreaElement);
 
       await waitFor(() => {
-        const requiredFieldTextElements =
-          screen.getAllByText(/required field/i);
-        expect(requiredFieldTextElements).toHaveLength(2);
+        const requiredFieldTextElements = screen.getByText(/required field/i);
+        expect(requiredFieldTextElements).toBeInTheDocument();
       });
     });
   });
 
   describe('Custom setup for the component', () => {
-    it('should render the input with default data if they are passed', () => {
+    it('should render the input with default data if they are passed', async () => {
       setupComponent({
         inputDisplayNameDefaultValue: mockData.name,
         inputCodeDefaultValue: mockData.code,
       });
-
       const inputs = screen.getAllByRole('textbox');
-      const textAreaElement = inputs[0];
+      const textAreaElement = inputs[0] as HTMLTextAreaElement;
       const inputNameElement = inputs[1];
-
-      expect(inputNameElement).toHaveValue(mockData.name);
-      expect(textAreaElement).toHaveValue(mockData.code);
+      await waitFor(() => {
+        expect(inputNameElement).toHaveValue(mockData.name);
+        expect(textAreaElement.value).toEqual('');
+      });
     });
 
     it('should test whether the cancel callback is being called', async () => {
@@ -111,8 +110,8 @@ describe('AddEditFilterContainer component', () => {
 
       const inputs = screen.getAllByRole('textbox');
 
-      const textAreaElement = inputs[0];
-      userEvent.type(textAreaElement, 'Hello World With TextArea');
+      const textAreaElement = inputs[0] as HTMLTextAreaElement;
+      userEvent.paste(textAreaElement, 'Hello World With TextArea');
 
       const inputNameElement = inputs[1];
       userEvent.type(inputNameElement, 'Hello World!');
diff --git a/kafka-ui-react-app/src/components/Topics/Topic/Details/Messages/Filters/__tests__/AddFilter.spec.tsx b/kafka-ui-react-app/src/components/Topics/Topic/Details/Messages/Filters/__tests__/AddFilter.spec.tsx
index 8ed5eb8efe0..db15ddb98ad 100644
--- a/kafka-ui-react-app/src/components/Topics/Topic/Details/Messages/Filters/__tests__/AddFilter.spec.tsx
+++ b/kafka-ui-react-app/src/components/Topics/Topic/Details/Messages/Filters/__tests__/AddFilter.spec.tsx
@@ -58,32 +58,34 @@ describe('AddFilter component', () => {
       const nameValue = 'filter name';
       const textBoxes = screen.getAllByRole('textbox');
 
-      const codeTextBox = textBoxes[0];
+      const codeTextBox = textBoxes[0] as HTMLTextAreaElement;
       const nameTextBox = textBoxes[1];
 
       const addFilterBtn = screen.getByRole('button', { name: /Add filter/i });
       expect(addFilterBtn).toBeDisabled();
       expect(screen.getByPlaceholderText('Enter Name')).toBeInTheDocument();
       await waitFor(() => {
-        userEvent.type(codeTextBox, codeValue);
+        userEvent.paste(codeTextBox, codeValue);
         userEvent.type(nameTextBox, nameValue);
       });
       expect(addFilterBtn).toBeEnabled();
-      expect(codeTextBox).toHaveValue(codeValue);
+      expect(codeTextBox.value).toEqual(`${codeValue}\n\n`);
       expect(nameTextBox).toHaveValue(nameValue);
     });
 
     it('should check unSaved filter without name', async () => {
-      const codeTextBox = screen.getAllByRole('textbox')[0];
+      const codeTextBox = screen.getAllByRole(
+        'textbox'
+      )[0] as HTMLTextAreaElement;
       const code = 'filter code';
       const addFilterBtn = screen.getByRole('button', { name: /Add filter/i });
       expect(addFilterBtn).toBeDisabled();
       expect(screen.getByPlaceholderText('Enter Name')).toBeInTheDocument();
       await waitFor(() => {
-        userEvent.type(codeTextBox, code);
+        userEvent.paste(codeTextBox, code);
       });
       expect(addFilterBtn).toBeEnabled();
-      expect(codeTextBox).toHaveValue(code);
+      expect(codeTextBox).toHaveValue(`${code}\n\n`);
     });
 
     it('calls editFilter when edit button is clicked in saved filters', () => {
@@ -122,11 +124,6 @@ describe('AddFilter component', () => {
         activeFilterHandler: activeFilterHandlerMock,
         toggleIsOpen: toggleModelMock,
       });
-
-      await waitFor(() => {
-        userEvent.type(screen.getAllByRole('textbox')[0], codeValue);
-        userEvent.type(screen.getAllByRole('textbox')[1], nameValue);
-      });
     });
 
     afterEach(() => {
@@ -135,90 +132,113 @@ describe('AddFilter component', () => {
       toggleModelMock.mockClear();
     });
 
-    it('OnSubmit condition with checkbox off functionality', async () => {
-      // since both values are in it
-      const addFilterBtn = screen.getByRole('button', { name: /Add filter/i });
-      expect(addFilterBtn).toBeEnabled();
-      userEvent.click(addFilterBtn);
-
-      await waitFor(() => {
-        expect(activeFilterHandlerMock).toHaveBeenCalled();
-        expect(addFilterMock).not.toHaveBeenCalled();
+    describe('OnSubmit conditions with codeValue and nameValue in fields', () => {
+      beforeEach(async () => {
+        await waitFor(() => {
+          userEvent.paste(
+            screen.getAllByRole('textbox')[0] as HTMLTextAreaElement,
+            codeValue
+          );
+          userEvent.type(screen.getAllByRole('textbox')[1], nameValue);
+        });
       });
-    });
 
-    it('OnSubmit condition with checkbox on functionality', async () => {
-      userEvent.click(screen.getByRole('checkbox'));
+      it('OnSubmit condition with checkbox off functionality', async () => {
+        // since both values are in it
+        const addFilterBtn = screen.getByRole('button', {
+          name: /Add filter/i,
+        });
+        expect(addFilterBtn).toBeEnabled();
+        userEvent.click(addFilterBtn);
 
-      userEvent.click(screen.getAllByRole('button')[1]);
-      await waitFor(() => {
-        expect(activeFilterHandlerMock).not.toHaveBeenCalled();
-        expect(addFilterMock).toHaveBeenCalled();
-        expect(toggleModelMock).not.toHaveBeenCalled();
+        await waitFor(() => {
+          expect(activeFilterHandlerMock).toHaveBeenCalled();
+          expect(addFilterMock).not.toHaveBeenCalled();
+        });
       });
-    });
-
-    it('should check the state submit button when checkbox state changes so is name input value', async () => {
-      const checkbox = screen.getByRole('checkbox');
-      const codeTextBox = screen.getAllByRole('textbox')[0];
-      const nameTextBox = screen.getAllByRole('textbox')[1];
-      const addFilterBtn = screen.getByRole('button', { name: /Add filter/i });
 
-      userEvent.clear(nameTextBox);
-      expect(nameTextBox).toHaveValue('');
+      it('OnSubmit condition with checkbox on functionality', async () => {
+        userEvent.click(screen.getByRole('checkbox'));
 
-      userEvent.click(addFilterBtn);
-      await waitFor(() => {
-        expect(activeFilterHandlerMock).toHaveBeenCalledTimes(1);
-        expect(activeFilterHandlerMock).toHaveBeenCalledWith(
-          {
-            name: codeValue,
-            code: codeValue,
-            saveFilter: false,
-          },
-          -1
-        );
-        // get reset-ed
-        expect(codeTextBox).toHaveValue('');
-        expect(toggleModelMock).toHaveBeenCalled();
+        userEvent.click(screen.getAllByRole('button')[1]);
+        await waitFor(() => {
+          expect(activeFilterHandlerMock).not.toHaveBeenCalled();
+          expect(addFilterMock).toHaveBeenCalled();
+          expect(toggleModelMock).not.toHaveBeenCalled();
+        });
       });
 
-      userEvent.type(codeTextBox, codeValue);
-      expect(codeTextBox).toHaveValue(codeValue);
+      it('should check the state submit button when checkbox state changes so is name input value', async () => {
+        const checkbox = screen.getByRole('checkbox');
+        const codeTextBox = screen.getAllByRole(
+          'textbox'
+        )[0] as HTMLTextAreaElement;
+        const nameTextBox = screen.getAllByRole('textbox')[1];
+        const addFilterBtn = screen.getByRole('button', {
+          name: /Add filter/i,
+        });
 
-      userEvent.click(checkbox);
-      expect(addFilterBtn).toBeDisabled();
+        userEvent.clear(nameTextBox);
+        expect(nameTextBox).toHaveValue('');
+
+        userEvent.click(addFilterBtn);
+        await waitFor(() => {
+          expect(activeFilterHandlerMock).toHaveBeenCalledTimes(1);
+          expect(activeFilterHandlerMock).toHaveBeenCalledWith(
+            {
+              name: codeValue,
+              code: codeValue,
+              saveFilter: false,
+            },
+            -1
+          );
+          // get reset-ed
+          expect(codeTextBox.value).toEqual(``);
+          expect(toggleModelMock).toHaveBeenCalled();
+        });
 
-      userEvent.type(nameTextBox, nameValue);
-      expect(nameTextBox).toHaveValue(nameValue);
+        userEvent.paste(codeTextBox, codeValue);
+        expect(codeTextBox).toHaveValue(`${codeValue}\n\n`);
 
-      await waitFor(() => {
-        expect(addFilterBtn).toBeEnabled();
-      });
+        userEvent.click(checkbox);
+        expect(addFilterBtn).toBeDisabled();
 
-      userEvent.click(addFilterBtn);
+        userEvent.type(nameTextBox, nameValue);
+        expect(nameTextBox).toHaveValue(nameValue);
 
-      await waitFor(() => {
-        expect(activeFilterHandlerMock).toHaveBeenCalledTimes(1);
-        expect(addFilterMock).toHaveBeenCalledWith({
-          name: nameValue,
-          code: codeValue,
-          saveFilter: true,
+        await waitFor(() => {
+          expect(addFilterBtn).toBeEnabled();
+        });
+
+        userEvent.click(addFilterBtn);
+
+        await waitFor(() => {
+          expect(activeFilterHandlerMock).toHaveBeenCalledTimes(1);
+          expect(addFilterMock).toHaveBeenCalledWith({
+            name: nameValue,
+            code: codeValue,
+            saveFilter: true,
+          });
         });
       });
     });
 
     it('should use sliced code as the filter name if filter name is empty', async () => {
-      const codeTextBox = screen.getAllByRole('textbox')[0];
+      const codeTextBox = screen.getAllByRole(
+        'textbox'
+      )[0] as HTMLTextAreaElement;
       const nameTextBox = screen.getAllByRole('textbox')[1];
       const addFilterBtn = screen.getByRole('button', { name: /Add filter/i });
 
       userEvent.clear(nameTextBox);
       userEvent.clear(codeTextBox);
-      userEvent.paste(codeTextBox, longCodeValue);
+
+      await waitFor(() => {
+        userEvent.paste(codeTextBox, longCodeValue);
+      });
 
       expect(nameTextBox).toHaveValue('');
-      expect(codeTextBox).toHaveValue(longCodeValue);
+      expect(codeTextBox).toHaveValue(`${longCodeValue}\n\n`);
 
       userEvent.click(addFilterBtn);
 
@@ -234,7 +254,7 @@ describe('AddFilter component', () => {
           },
           -1
         );
-        expect(codeTextBox).toHaveValue('');
+        expect(codeTextBox.value).toEqual('');
         expect(toggleModelMock).toHaveBeenCalled();
       });
     });
diff --git a/kafka-ui-react-app/src/components/Topics/Topic/Details/Messages/Filters/__tests__/EditFilter.spec.tsx b/kafka-ui-react-app/src/components/Topics/Topic/Details/Messages/Filters/__tests__/EditFilter.spec.tsx
index aff12f129d4..e11efb89347 100644
--- a/kafka-ui-react-app/src/components/Topics/Topic/Details/Messages/Filters/__tests__/EditFilter.spec.tsx
+++ b/kafka-ui-react-app/src/components/Topics/Topic/Details/Messages/Filters/__tests__/EditFilter.spec.tsx
@@ -3,13 +3,13 @@ import EditFilter, {
   EditFilterProps,
 } from 'components/Topics/Topic/Details/Messages/Filters/EditFilter';
 import { render } from 'lib/testHelpers';
-import { screen, waitFor, fireEvent } from '@testing-library/react';
+import { screen, waitFor, fireEvent, within } from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
 import { FilterEdit } from 'components/Topics/Topic/Details/Messages/Filters/FilterModal';
 
 const editFilter: FilterEdit = {
   index: 0,
-  filter: { name: 'name', code: 'code' },
+  filter: { name: 'name', code: '' },
 };
 
 const setupComponent = (props?: Partial<EditFilterProps>) =>
@@ -39,6 +39,11 @@ describe('EditFilter component', () => {
     const toggleEditModal = jest.fn();
     const editSavedFilter = jest.fn();
     setupComponent({ toggleEditModal, editSavedFilter });
+    const inputs = screen.getAllByRole('textbox');
+    const textAreaElement = inputs[0] as HTMLTextAreaElement;
+    const inputNameElement = inputs[1];
+    userEvent.paste(textAreaElement, 'edited code');
+    userEvent.type(inputNameElement, 'edited name');
     await waitFor(() => fireEvent.submit(screen.getByRole('form')));
     expect(toggleEditModal).toHaveBeenCalledTimes(1);
     expect(editSavedFilter).toHaveBeenCalledTimes(1);
@@ -46,11 +51,11 @@ describe('EditFilter component', () => {
 
   it('checks input values to match', () => {
     setupComponent();
-    expect(screen.getAllByRole('textbox')[0]).toHaveValue(
-      editFilter.filter.code
-    );
-    expect(screen.getAllByRole('textbox')[1]).toHaveValue(
-      editFilter.filter.name
-    );
+    const inputs = screen.getAllByRole('textbox');
+    const textAreaElement = inputs[0] as HTMLTextAreaElement;
+    const inputNameElement = inputs[1];
+    const span = within(textAreaElement).getByText(editFilter.filter.code);
+    expect(span).toHaveValue(editFilter.filter.code);
+    expect(inputNameElement).toHaveValue(editFilter.filter.name);
   });
 });
diff --git a/kafka-ui-react-app/src/components/Topics/Topic/Details/Messages/Filters/__tests__/Filters.spec.tsx b/kafka-ui-react-app/src/components/Topics/Topic/Details/Messages/Filters/__tests__/Filters.spec.tsx
index 0b925134645..5bb84634edd 100644
--- a/kafka-ui-react-app/src/components/Topics/Topic/Details/Messages/Filters/__tests__/Filters.spec.tsx
+++ b/kafka-ui-react-app/src/components/Topics/Topic/Details/Messages/Filters/__tests__/Filters.spec.tsx
@@ -171,16 +171,18 @@ describe('Filters component', () => {
 
       const messageFilterModal = screen.getByTestId('messageFilterModal');
 
-      await waitFor(() => {
-        const textBoxElements =
-          within(messageFilterModal).getAllByRole('textbox');
-        userEvent.type(textBoxElements[0], filterName);
-        userEvent.type(textBoxElements[1], filterCode);
-      });
       const textBoxElements =
         within(messageFilterModal).getAllByRole('textbox');
-      expect(textBoxElements[0]).toHaveValue(filterName);
-      expect(textBoxElements[1]).toHaveValue(filterCode);
+
+      const textAreaElement = textBoxElements[0] as HTMLTextAreaElement;
+      const inputNameElement = textBoxElements[1];
+      await waitFor(() => {
+        userEvent.paste(textAreaElement, filterName);
+        userEvent.type(inputNameElement, filterCode);
+      });
+
+      expect(textAreaElement.value).toEqual(`${filterName}\n\n`);
+      expect(inputNameElement).toHaveValue(filterCode);
 
       await waitFor(() => {
         return userEvent.click(
diff --git a/kafka-ui-react-app/src/components/Topics/shared/Form/CustomParams/CustomParamsContainer.tsx b/kafka-ui-react-app/src/components/Topics/shared/Form/CustomParams/CustomParamsContainer.tsx
index 4d5065e6731..5806d11e928 100644
--- a/kafka-ui-react-app/src/components/Topics/shared/Form/CustomParams/CustomParamsContainer.tsx
+++ b/kafka-ui-react-app/src/components/Topics/shared/Form/CustomParams/CustomParamsContainer.tsx
@@ -10,7 +10,7 @@ interface OwnProps extends RouteComponentProps {
 }
 
 const mapStateToProps = (
-  state: RootState,
+  _state: RootState,
   { isSubmitting, config }: OwnProps
 ) => ({
   isSubmitting,
diff --git a/kafka-ui-react-app/src/components/common/SmartTable/SmartTable.tsx b/kafka-ui-react-app/src/components/common/SmartTable/SmartTable.tsx
index 0b04279dbf8..575db21b9cc 100644
--- a/kafka-ui-react-app/src/components/common/SmartTable/SmartTable.tsx
+++ b/kafka-ui-react-app/src/components/common/SmartTable/SmartTable.tsx
@@ -48,10 +48,9 @@ export const SmartTable = <T, TId extends IdType, OT = never>({
 
       const { headerCell, title, orderValue } = child.props;
 
-      const HeaderCell = headerCell as
-        | React.FC<TableHeaderCellProps<T, TId, OT>>
-        | undefined;
-
+      const HeaderCell = headerCell as React.FC<
+        TableHeaderCellProps<T, TId, OT>
+      >;
       return HeaderCell ? (
         <S.TableHeaderCell>
           <HeaderCell