feat: layout redesign

packages/bruno-app/src/components/RequestPane/HttpRequestPane/index.js

@@ -7,6 +7,8 @@ import QueryParams from 'components/RequestPane/QueryParams';
 import RequestHeaders from 'components/RequestPane/RequestHeaders';
 import RequestBody from 'components/RequestPane/RequestBody';
 import RequestBodyMode from 'components/RequestPane/RequestBody/RequestBodyMode';
+import QueryUrl from 'components/RequestPane/QueryUrl';
+import { sendRequest } from 'providers/ReduxStore/slices/collections';
 import StyledWrapper from './StyledWrapper';
 
 const HttpRequestPane = ({item, collection, leftPaneWidth}) => {
@@ -14,6 +16,8 @@ const HttpRequestPane = ({item, collection, leftPaneWidth}) => {
   const tabs = useSelector((state) => state.tabs.tabs);
   const activeTabUid = useSelector((state) => state.tabs.activeTabUid);
 
+  const sendNetworkRequest =  async () => dispatch(sendRequest(item, collection.uid));
+
   const selectTab = (tab) => {
     dispatch(updateRequestPaneTab({
       uid: item.uid,
@@ -59,6 +63,13 @@ const HttpRequestPane = ({item, collection, leftPaneWidth}) => {
 
   return (
     <StyledWrapper className="flex flex-col h-full relativ">
+      <div className="pt-2 pb-3">
+        <QueryUrl
+          item = {item}
+          collection={collection}
+          handleRun={sendNetworkRequest}
+        />
+      </div>
       <div className="flex items-center tabs" role="tablist">
         <div className={getTabClassname('params')} role="tab" onClick={() => selectTab('params')}>Params</div>
         <div className={getTabClassname('body')} role="tab" onClick={() => selectTab('body')}>Body</div>