No error displayed in case of wrong header submitting with Message producing 
**Describe the bug**
User should be notified about filled wrong value/format for Headers within Message produce form

**Steps to Reproduce**
Steps to reproduce the behavior:

1. Login too system
2. Navigate t Topic's profile
3. Turn to Messages tab
4. Produce Meesage
5. Enter wrong value/format within Headers
6. Press Send

**Expected behavior**
Should display error message about wrong header 

**Screenshots**

https://user-images.githubusercontent.com/104780608/169745897-4b200628-a29c-4646-b095-4d49e0eaffea.mov






kafka-ui-react-app/src/components/Topics/Topic/SendMessage/SendMessage.tsx
kafka-ui-react-app/src/components/Topics/Topic/SendMessage/SendMessage.tsx
diff --git a/kafka-ui-react-app/src/components/Topics/Topic/SendMessage/SendMessage.tsx b/kafka-ui-react-app/src/components/Topics/Topic/SendMessage/SendMessage.tsx
index a4087a36cf5..35894e9bfb9 100644
--- a/kafka-ui-react-app/src/components/Topics/Topic/SendMessage/SendMessage.tsx
+++ b/kafka-ui-react-app/src/components/Topics/Topic/SendMessage/SendMessage.tsx
@@ -102,8 +102,14 @@ const SendMessage: React.FC = () => {
   }) => {
     if (messageSchema) {
       const { partition, key, content } = data;
-      const headers = data.headers ? JSON.parse(data.headers) : undefined;
       const errors = validateMessage(key, content, messageSchema);
+      if (data.headers) {
+        try {
+          JSON.parse(data.headers);
+        } catch (error) {
+          errors.push('Wrong header format');
+        }
+      }
       if (errors.length > 0) {
         const errorsHtml = errors.map((e) => `<li>${e}</li>`).join('');
         dispatch(
@@ -117,7 +123,7 @@ const SendMessage: React.FC = () => {
         );
         return;
       }
-
+      const headers = data.headers ? JSON.parse(data.headers) : undefined;
       try {
         await messagesApiClient.sendTopicMessages({
           clusterName,
