diff --git a/packages/bruno-app/src/components/RequestPane/Auth/AuthMode/StyledWrapper.js b/packages/bruno-app/src/components/RequestPane/Auth/AuthMode/StyledWrapper.js
index 6613dd1f3..e1d0530c6 100644
--- a/packages/bruno-app/src/components/RequestPane/Auth/AuthMode/StyledWrapper.js
+++ b/packages/bruno-app/src/components/RequestPane/Auth/AuthMode/StyledWrapper.js
@@ -4,8 +4,7 @@ const Wrapper = styled.div`
font-size: 0.8125rem;
.auth-mode-selector {
- background: ${(props) => props.theme.requestTabPanel.bodyModeSelect.color};
- border-radius: 3px;
+ background: transparent;
.dropdown-item {
padding: 0.2rem 0.6rem !important;
diff --git a/packages/bruno-app/src/components/RequestPane/Auth/AuthMode/index.js b/packages/bruno-app/src/components/RequestPane/Auth/AuthMode/index.js
index 3ad80ce13..f1d2e443f 100644
--- a/packages/bruno-app/src/components/RequestPane/Auth/AuthMode/index.js
+++ b/packages/bruno-app/src/components/RequestPane/Auth/AuthMode/index.js
@@ -15,8 +15,8 @@ const AuthMode = ({ item, collection }) => {
const Icon = forwardRef((props, ref) => {
return (
-
- {humanizeRequestAuthMode(authMode)}
+
+ {humanizeRequestAuthMode(authMode)}
);
});
diff --git a/packages/bruno-app/src/components/RequestPane/Auth/BearerAuth/StyledWrapper.js b/packages/bruno-app/src/components/RequestPane/Auth/BearerAuth/StyledWrapper.js
new file mode 100644
index 000000000..71d3bdf1d
--- /dev/null
+++ b/packages/bruno-app/src/components/RequestPane/Auth/BearerAuth/StyledWrapper.js
@@ -0,0 +1,10 @@
+import styled from 'styled-components';
+
+const Wrapper = styled.div`
+ .single-line-editor-wrapper {
+ padding: 0.15rem 0.4rem;
+ border: ${(props) => props.theme.sidebar.search.border};
+ }
+`;
+
+export default Wrapper;
diff --git a/packages/bruno-app/src/components/RequestPane/Auth/BearerAuth/index.js b/packages/bruno-app/src/components/RequestPane/Auth/BearerAuth/index.js
new file mode 100644
index 000000000..90347dc5a
--- /dev/null
+++ b/packages/bruno-app/src/components/RequestPane/Auth/BearerAuth/index.js
@@ -0,0 +1,52 @@
+import React, { useState } from 'react';
+import get from 'lodash/get';
+import { useTheme } from 'providers/Theme';
+import { useDispatch } from 'react-redux';
+import SingleLineEditor from 'components/SingleLineEditor';
+import { updateBearerToken } from 'providers/ReduxStore/slices/collections';
+import { sendRequest, saveRequest } from 'providers/ReduxStore/slices/collections/actions';
+import StyledWrapper from './StyledWrapper';
+
+const BearerAuth = ({ onTokenChange, item, collection }) => {
+ const dispatch = useDispatch();
+ const { storedTheme } = useTheme();
+
+ const bearerToken = item.draft
+ ? get(item, 'draft.request.auth.bearer.token')
+ : get(item, 'request.auth.bearer.token');
+
+ const handleRun = () => dispatch(sendRequest(item, collection.uid));
+ const handleSave = () => dispatch(saveRequest(item.uid, collection.uid));
+
+ const handleTokenChange = (token) => {
+ dispatch(
+ updateBearerToken({
+ collectionUid: collection.uid,
+ itemUid: item.uid,
+ content: {
+ token: token
+ }
+ })
+ );
+ };
+
+ return (
+
+
+
+ handleTokenChange(val)}
+ onRun={handleRun}
+ collection={collection}
+ />
+
+
+ );
+};
+
+export default BearerAuth;
diff --git a/packages/bruno-app/src/components/RequestPane/Auth/index.js b/packages/bruno-app/src/components/RequestPane/Auth/index.js
index e2f345d23..1210b0251 100644
--- a/packages/bruno-app/src/components/RequestPane/Auth/index.js
+++ b/packages/bruno-app/src/components/RequestPane/Auth/index.js
@@ -1,32 +1,30 @@
import React from 'react';
import get from 'lodash/get';
-import { useDispatch } from 'react-redux';
-import { updateRequestBody } from 'providers/ReduxStore/slices/collections';
-import { sendRequest, saveRequest } from 'providers/ReduxStore/slices/collections/actions';
+import AuthMode from './AuthMode';
+import BearerAuth from './BearerAuth';
import StyledWrapper from './StyledWrapper';
-const RequestBody = ({ item, collection }) => {
- const dispatch = useDispatch();
+const Auth = ({ item, collection }) => {
const authMode = item.draft ? get(item, 'draft.request.auth.mode') : get(item, 'request.auth.mode');
- const onEdit = (value) => {
- // dispatch(
- // updateRequestBody({
- // content: value,
- // itemUid: item.uid,
- // collectionUid: collection.uid
- // })
- // );
+ const getAuthView = () => {
+ switch (authMode) {
+ case 'basic': {
+ return
Basic Auth
;
+ }
+ case 'bearer': {
+ return
;
+ }
+ }
};
- if (authMode === 'basic') {
- return
Basic Auth
;
- }
-
- if (authMode === 'bearer') {
- return
Bearer Token
;
- }
-
- return
No Auth;
+ return (
+
+
+ {getAuthView()}
+
+ );
};
-export default RequestBody;
+export default Auth;
diff --git a/packages/bruno-app/src/components/RequestPane/HttpRequestPane/index.js b/packages/bruno-app/src/components/RequestPane/HttpRequestPane/index.js
index 652414a62..ec20514fe 100644
--- a/packages/bruno-app/src/components/RequestPane/HttpRequestPane/index.js
+++ b/packages/bruno-app/src/components/RequestPane/HttpRequestPane/index.js
@@ -108,13 +108,10 @@ const HttpRequestPane = ({ item, collection, leftPaneWidth }) => {
) : null}
- {focusedTab.requestPaneTab === 'auth' ? (
-