diff --git a/.gitignore b/.gitignore index 833f4389c..572bd2a21 100644 --- a/.gitignore +++ b/.gitignore @@ -27,5 +27,6 @@ yarn-error.log* .env.production.local # next.js +/renderer /renderer/.next/ /renderer/out/ diff --git a/packages/bruno-app/public/send.svg b/packages/bruno-app/public/send.svg new file mode 100644 index 000000000..64123806d --- /dev/null +++ b/packages/bruno-app/public/send.svg @@ -0,0 +1,4 @@ + + + + diff --git a/packages/bruno-app/src/components/RequestPane/HttpRequestPane/index.js b/packages/bruno-app/src/components/RequestPane/HttpRequestPane/index.js index d5ea6337a..c4f592b25 100644 --- a/packages/bruno-app/src/components/RequestPane/HttpRequestPane/index.js +++ b/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 ( +
+ +
selectTab('params')}>Params
selectTab('body')}>Body
diff --git a/packages/bruno-app/src/components/RequestPane/QueryUrl/StyledWrapper.js b/packages/bruno-app/src/components/RequestPane/QueryUrl/StyledWrapper.js index 93dcd7d3c..a5abce2b7 100644 --- a/packages/bruno-app/src/components/RequestPane/QueryUrl/StyledWrapper.js +++ b/packages/bruno-app/src/components/RequestPane/QueryUrl/StyledWrapper.js @@ -4,15 +4,12 @@ const Wrapper = styled.div` height: 2.3rem; div.method-selector-container { - border: solid 1px var(--color-layout-border); - border-right: none; background-color: var(--color-sidebar-background); border-top-left-radius: 3px; border-bottom-left-radius: 3px; } div.input-container { - border: solid 1px var(--color-layout-border); background-color: var(--color-sidebar-background); border-top-right-radius: 3px; border-bottom-right-radius: 3px; diff --git a/packages/bruno-app/src/components/RequestPane/QueryUrl/index.js b/packages/bruno-app/src/components/RequestPane/QueryUrl/index.js index 874c0f2fb..1c5c2befe 100644 --- a/packages/bruno-app/src/components/RequestPane/QueryUrl/index.js +++ b/packages/bruno-app/src/components/RequestPane/QueryUrl/index.js @@ -38,14 +38,10 @@ const QueryUrl = ({item, collection, handleRun}) => { autoComplete="off" autoCorrect="off" autoCapitalize="off" spellCheck="false" onChange={(event) => onUrlChange(event.target.value)} /> +
+ +
- ) }; diff --git a/packages/bruno-app/src/components/RequestTabPanel/index.js b/packages/bruno-app/src/components/RequestTabPanel/index.js index 2ec5f9202..693a01549 100644 --- a/packages/bruno-app/src/components/RequestTabPanel/index.js +++ b/packages/bruno-app/src/components/RequestTabPanel/index.js @@ -1,13 +1,11 @@ import React, { useState, useEffect } from 'react'; import find from 'lodash/find'; import { useSelector, useDispatch } from 'react-redux'; -import QueryUrl from 'components/RequestPane/QueryUrl'; import GraphQLRequestPane from 'components/RequestPane/GraphQLRequestPane'; import HttpRequestPane from 'components/RequestPane/HttpRequestPane'; import ResponsePane from 'components/ResponsePane'; import Welcome from 'components/Welcome'; import { findItemInCollection } from 'utils/collections'; -import { sendRequest } from 'providers/ReduxStore/slices/collections'; import { updateRequestPaneTabWidth } from 'providers/ReduxStore/slices/tabs'; import RequestNotFound from './RequestNotFound'; import useGraphqlSchema from '../../hooks/useGraphqlSchema'; @@ -104,22 +102,9 @@ const RequestTabPanel = () => { const onGraphqlQueryChange = (value) => {}; const runQuery = async () => {}; - const sendNetworkRequest = async () => dispatch(sendRequest(item, collection.uid)); return ( -
- -
{ + try { + // make axios work in node using form data + // reference: https://github.com/axios/axios/issues/1006#issuecomment-320165427 + if(request.headers && request.headers['content-type'] === 'multipart/form-data') { + const form = new FormData(); + forOwn(request.data, (value, key) => { + form.append(key, value); + }); + extend(request.headers, form.getHeaders()); + request.data = form; + } + + const result = await axios(request); + + return { + status: result.status, + headers: result.headers, + data: result.data + }; + } catch (error) { + if(error.response) { + return { + status: error.response.status, + headers: error.response.headers, + data: error.response.data + }; + } + + return { + status: -1, + headers: [], + data: null + }; + } +}; \ No newline at end of file diff --git a/packages/bruno-app/src/utils/network/index.js b/packages/bruno-app/src/utils/network/index.js index 9617be345..5d3d4a291 100644 --- a/packages/bruno-app/src/utils/network/index.js +++ b/packages/bruno-app/src/utils/network/index.js @@ -2,6 +2,7 @@ import each from 'lodash/each'; import filter from 'lodash/filter'; import qs from 'qs'; import { rawRequest, gql } from 'graphql-request'; +import { sendHttpRequestInBrowser } from './browser'; const sendNetworkRequest = async (item) => { return new Promise((resolve, reject) => { @@ -79,10 +80,15 @@ const sendHttpRequest = async (request) => { console.log('>>> Sending Request'); console.log(options); - ipcRenderer - .invoke('send-http-request', options) + // Todo: Choose based on platform (web/desktop) + sendHttpRequestInBrowser(options) .then(resolve) .catch(reject); + + // ipcRenderer + // .invoke('send-http-request', options) + // .then(resolve) + // .catch(reject); }); };