fix(frontend): fix empty body and headers in trigger tab

web/src/components/CodeBlock/CodeBlock.tsx

@@ -15,7 +15,11 @@ const getInitialLang = (mimeType: string): LanguageName | undefined =>
 const formatValue = (value: string, lang: LanguageName | undefined): string => {
   switch (lang) {
     case 'json':
-      return JSON.stringify(JSON.parse(value), null, 2);
+      try {
+        return JSON.stringify(JSON.parse(value), null, 2);
+      } catch (error) {
+        return '';
+      }
 
     default:
       return value;

web/src/components/RunDetailTriggerResponse/ResponseBody.tsx

@@ -1,12 +1,15 @@
+import {isRunStateFinished} from 'models/TestRun.model';
+import {TTestRunState} from 'types/TestRun.types';
 import SkeletonResponse from './SkeletonResponse';
 import CodeBlock from '../CodeBlock';
 
 interface IProps {
   body?: string;
   bodyMimeType?: string;
+  state: TTestRunState;
 }
 
-const ResponseBody = ({body = '', bodyMimeType = ''}: IProps) =>
-  !body ? <SkeletonResponse /> : <CodeBlock value={body} mimeType={bodyMimeType} />;
+const ResponseBody = ({body = '', bodyMimeType = '', state}: IProps) =>
+  isRunStateFinished(state) || !!body ? <CodeBlock value={body} mimeType={bodyMimeType} /> : <SkeletonResponse />;
 
 export default ResponseBody;

web/src/components/RunDetailTriggerResponse/ResponseHeaders.tsx

@@ -1,22 +1,20 @@
-import {THeader} from 'types/Test.types';
 import HeaderRow from 'components/HeaderRow';
+import {isRunStateFinished} from 'models/TestRun.model';
+import {THeader} from 'types/Test.types';
+import {TTestRunState} from 'types/TestRun.types';
 import SkeletonResponse from './SkeletonResponse';
 import * as S from './RunDetailTriggerResponse.styled';
 
 interface IProps {
   headers?: THeader[];
+  state: TTestRunState;
 }
 
-const ResponseHeaders = ({headers}: IProps) => {
-  return !headers ? (
-    <SkeletonResponse />
+const ResponseHeaders = ({headers, state}: IProps) =>
+  isRunStateFinished(state) || !!headers ? (
+    <S.HeadersList>{headers && headers.map(header => <HeaderRow header={header} key={header.key} />)}</S.HeadersList>
   ) : (
-    <S.HeadersList>
-      {headers.map(header => (
-        <HeaderRow header={header} key={header.key} />
-      ))}
-    </S.HeadersList>
+    <SkeletonResponse />
   );
-};
 
 export default ResponseHeaders;

web/src/components/RunDetailTriggerResponse/RunDetailTriggerResponse.tsx

@@ -55,10 +55,10 @@ const RunDetailTriggerResponse = ({
           }}
         >
           <Tabs.TabPane key={TabsKeys.Body} tab="Body">
-            <ResponseBody body={body} bodyMimeType={bodyMimeType} />
+            <ResponseBody body={body} bodyMimeType={bodyMimeType} state={state} />
           </Tabs.TabPane>
           <Tabs.TabPane key={TabsKeys.Headers} tab="Headers">
-            <ResponseHeaders headers={headers} />
+            <ResponseHeaders headers={headers} state={state} />
           </Tabs.TabPane>
           <Tabs.TabPane key={TabsKeys.Environment} tab="Environment">
             <ResponseEnvironment />