feat: show error in execution step

packages/backend/src/graphql/schema.graphql

@@ -188,6 +188,7 @@ type ExecutionStep {
   status: String
   dataIn: JSONObject
   dataOut: JSONObject
+  errorDetails: JSONObject
   createdAt: String
   updatedAt: String
 }

packages/types/index.d.ts

@@ -26,6 +26,7 @@ export interface IExecutionStep {
   step: IStep;
   dataIn: IJSONObject;
   dataOut: IJSONObject;
+  errorDetails: IJSONObject;
   status: string;
   createdAt: string;
   updatedAt: string;

packages/web/src/components/ExecutionStep/index.tsx

@@ -73,6 +73,7 @@ export default function ExecutionStep(props: ExecutionStepProps): React.ReactEle
           <Tabs value={activeTabIndex} onChange={(event, tabIndex) => setActiveTabIndex(tabIndex)}>
             <Tab label="Data in" />
             <Tab label="Data out" />
+            <Tab label="Error" />
             <Tab label="Execution step" />
           </Tabs>
         </Box>
@@ -86,6 +87,10 @@ export default function ExecutionStep(props: ExecutionStepProps): React.ReactEle
         </TabPanel>
 
         <TabPanel value={activeTabIndex} index={2}>
+          <JSONViewer data={executionStep.errorDetails} />
+        </TabPanel>
+
+        <TabPanel value={activeTabIndex} index={3}>
           <JSONViewer data={(executionStep as unknown) as IJSONObject} />
         </TabPanel>
       </Content>

packages/web/src/graphql/queries/get-execution-steps.ts

@@ -14,6 +14,7 @@ export const GET_EXECUTION_STEPS = gql`
           status
           dataIn
           dataOut
+          errorDetails
           createdAt
           updatedAt
           step {