diff --git a/packages/bruno-app/src/components/ResponsePane/QueryResult/index.js b/packages/bruno-app/src/components/ResponsePane/QueryResult/index.js
index 8e11174c3..6a7d37445 100644
--- a/packages/bruno-app/src/components/ResponsePane/QueryResult/index.js
+++ b/packages/bruno-app/src/components/ResponsePane/QueryResult/index.js
@@ -11,7 +11,7 @@ import StyledWrapper from './StyledWrapper';
 import { useState } from 'react';
 import { useMemo } from 'react';
 
-const QueryResult = ({ item, collection, data, width, disableRunEventListener, headers }) => {
+const QueryResult = ({ item, collection, data, width, disableRunEventListener, headers, error }) => {
   const { storedTheme } = useTheme();
   const [tab, setTab] = useState('preview');
   const dispatch = useDispatch();
@@ -119,7 +119,7 @@ const QueryResult = ({ item, collection, data, width, disableRunEventListener, h
       <div className="flex justify-end gap-2 text-xs" role="tablist">
         {getTabs()}
       </div>
-      {activeResult}
+      {error ? <span className="text-red-500">{error}</span> : activeResult}
     </StyledWrapper>
   );
 };
diff --git a/packages/bruno-app/src/components/ResponsePane/index.js b/packages/bruno-app/src/components/ResponsePane/index.js
index 481c6ac16..e1cfab2ca 100644
--- a/packages/bruno-app/src/components/ResponsePane/index.js
+++ b/packages/bruno-app/src/components/ResponsePane/index.js
@@ -42,6 +42,7 @@ const ResponsePane = ({ rightPaneWidth, item, collection }) => {
             width={rightPaneWidth}
             data={response.data}
             headers={response.headers}
+            error={response.error}
           />
         );
       }
diff --git a/packages/bruno-app/src/providers/ReduxStore/slices/collections/actions.js b/packages/bruno-app/src/providers/ReduxStore/slices/collections/actions.js
index fbe404584..fb384c523 100644
--- a/packages/bruno-app/src/providers/ReduxStore/slices/collections/actions.js
+++ b/packages/bruno-app/src/providers/ReduxStore/slices/collections/actions.js
@@ -142,22 +142,28 @@ export const sendRequest = (item, collectionUid) => (dispatch, getState) => {
       })
       .then(resolve)
       .catch((err) => {
-        dispatch(
-          responseReceived({
-            itemUid: item.uid,
-            collectionUid: collectionUid,
-            response: null
-          })
-        );
-
         if (err && err.message === "Error invoking remote method 'send-http-request': Error: Request cancelled") {
           console.log('>> request cancelled');
           return;
         }
 
-        console.log('>> sending request failed');
-        console.log(err);
-        toast.error(err ? err.message : 'Something went wrong!');
+        const errorMessage = err.message ?? 'Something went wrong';
+
+        const errorResponse = {
+          status: 'Error',
+          isError: true,
+          error: errorMessage,
+          size: '0',
+          duration: '0'
+        };
+
+        dispatch(
+          responseReceived({
+            itemUid: item.uid,
+            collectionUid: collectionUid,
+            response: errorResponse
+          })
+        );
       });
   });
 };