From 349932152058328feebf1a4e7ec10357414cd087 Mon Sep 17 00:00:00 2001 From: Mateusz Pietryga Date: Sat, 25 May 2024 00:09:05 +0200 Subject: [PATCH] feat: Implement OAuth 1.0 --- packages/bruno-app/package.json | 1 + .../RequestPane/Auth/AuthMode/index.js | 2 +- .../RequestPane/Auth/OAuth1/StyledWrapper.js | 16 ++ .../RequestPane/Auth/OAuth1/index.js | 82 +++++++++ .../RequestPane/Auth/OAuth1/inputsConfig.js | 59 ++++++ .../src/components/RequestPane/Auth/index.js | 10 +- .../ReduxStore/slices/collections/index.js | 4 + .../bruno-app/src/utils/collections/index.js | 18 ++ .../bruno-electron/src/ipc/network/index.js | 5 + .../src/ipc/network/interpolate-vars.js | 4 + .../src/ipc/network/oauth1-helper.js | 174 ++++++++++++++++++ .../src/ipc/network/prepare-request.js | 14 ++ packages/bruno-lang/v2/src/bruToJson.js | 32 +++- .../bruno-lang/v2/src/collectionBruToJson.js | 32 +++- packages/bruno-lang/v2/src/jsonToBru.js | 16 ++ .../bruno-lang/v2/src/jsonToCollectionBru.js | 17 ++ .../bruno-schema/src/collections/index.js | 18 +- 17 files changed, 497 insertions(+), 7 deletions(-) create mode 100644 packages/bruno-app/src/components/RequestPane/Auth/OAuth1/StyledWrapper.js create mode 100644 packages/bruno-app/src/components/RequestPane/Auth/OAuth1/index.js create mode 100644 packages/bruno-app/src/components/RequestPane/Auth/OAuth1/inputsConfig.js create mode 100644 packages/bruno-electron/src/ipc/network/oauth1-helper.js diff --git a/packages/bruno-app/package.json b/packages/bruno-app/package.json index 7f1dfe7c54..5453ed1a8b 100644 --- a/packages/bruno-app/package.json +++ b/packages/bruno-app/package.json @@ -95,6 +95,7 @@ "html-loader": "^3.0.1", "html-webpack-plugin": "^5.5.0", "mini-css-extract-plugin": "^2.4.5", + "oauth-1.0a": "^2.2.6", "postcss": "^8.4.35", "style-loader": "^3.3.1", "tailwindcss": "^3.4.1", 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 c12ceffe88..b6365588ca 100644 --- a/packages/bruno-app/src/components/RequestPane/Auth/AuthMode/index.js +++ b/packages/bruno-app/src/components/RequestPane/Auth/AuthMode/index.js @@ -13,7 +13,7 @@ const AuthMode = ({ item, collection }) => { const onDropdownCreate = (ref) => (dropdownTippyRef.current = ref); const authMode = item.draft ? get(item, 'draft.request.auth.mode') : get(item, 'request.auth.mode'); - const authModes = ['awsv4', 'basic', 'bearer', 'digest', 'oauth2', 'inherit', 'none']; + const authModes = ['awsv4', 'basic', 'bearer', 'digest', 'oauth1', 'oauth2', 'inherit', 'none']; const Icon = forwardRef((props, ref) => { return ( diff --git a/packages/bruno-app/src/components/RequestPane/Auth/OAuth1/StyledWrapper.js b/packages/bruno-app/src/components/RequestPane/Auth/OAuth1/StyledWrapper.js new file mode 100644 index 0000000000..856f35b9b9 --- /dev/null +++ b/packages/bruno-app/src/components/RequestPane/Auth/OAuth1/StyledWrapper.js @@ -0,0 +1,16 @@ +import styled from 'styled-components'; + +const Wrapper = styled.div` + label { + font-size: 0.8125rem; + } + .single-line-editor-wrapper { + max-width: 400px; + padding: 0.15rem 0.4rem; + border-radius: 3px; + border: solid 1px ${(props) => props.theme.input.border}; + background-color: ${(props) => props.theme.input.bg}; + } +`; + +export default Wrapper; diff --git a/packages/bruno-app/src/components/RequestPane/Auth/OAuth1/index.js b/packages/bruno-app/src/components/RequestPane/Auth/OAuth1/index.js new file mode 100644 index 0000000000..7768ef5d2b --- /dev/null +++ b/packages/bruno-app/src/components/RequestPane/Auth/OAuth1/index.js @@ -0,0 +1,82 @@ +import React, { useRef } from 'react'; +import get from 'lodash/get'; +import { useTheme } from 'providers/Theme'; +import { useDispatch } from 'react-redux'; +import SingleLineEditor from 'components/SingleLineEditor'; +import { updateAuth } from 'providers/ReduxStore/slices/collections'; +import { sendRequest, saveRequest } from 'providers/ReduxStore/slices/collections/actions'; +import StyledWrapper from './StyledWrapper'; +import { inputsConfig } from './inputsConfig'; +import Dropdown from 'components/Dropdown'; + +const OAuth1 = ({ item, collection }) => { + const dispatch = useDispatch(); + const { storedTheme } = useTheme(); + + const oAuth1 = item.draft ? get(item, 'draft.request.auth.oauth1', {}) : get(item, 'request.auth.oauth1', {}); + + const handleRun = () => dispatch(sendRequest(item, collection.uid)); + const handleSave = () => dispatch(saveRequest(item.uid, collection.uid)); + + const dropdownTippyRef = useRef(); + const onDropdownCreate = (ref) => (dropdownTippyRef.current = ref); + + const handleChange = (key, val) => { + console.log(key, val); + dispatch( + updateAuth({ + mode: 'oauth1', + collectionUid: collection.uid, + itemUid: item.uid, + content: { + ...oAuth1, [key]: val + } + }) + ); + } + + return ( + + {inputsConfig.map((input) => { + const { key, label, options } = input; + return ( +
+ + {options ? +
+ { oAuth1[key] || '