diff --git a/packages/bruno-app/src/components/CollectionSettings/Auth/AuthMode/index.js b/packages/bruno-app/src/components/CollectionSettings/Auth/AuthMode/index.js
index 7dabb4c71..f7cebda40 100644
--- a/packages/bruno-app/src/components/CollectionSettings/Auth/AuthMode/index.js
+++ b/packages/bruno-app/src/components/CollectionSettings/Auth/AuthMode/index.js
@@ -86,7 +86,7 @@ const AuthMode = ({ collection }) => {
onModeChange('oauth2');
}}
>
- Oauth2
+ OAuth 2.0
{
const dispatch = useDispatch();
@@ -64,17 +62,6 @@ const OAuth2AuthorizationCode = ({ collection }) => {
})
);
};
-
- const handleClearCache = (e) => {
- clearOauth2Cache(collection?.uid)
- .then(() => {
- toast.success('cleared cache successfully');
- })
- .catch((err) => {
- toast.error(err.message);
- });
- };
-
return (
{inputsConfig.map((input) => {
@@ -105,14 +92,6 @@ const OAuth2AuthorizationCode = ({ collection }) => {
onChange={handlePKCEToggle}
/>
-
-
-
-
);
};
diff --git a/packages/bruno-app/src/components/CollectionSettings/Auth/OAuth2/ClientCredentials/index.js b/packages/bruno-app/src/components/CollectionSettings/Auth/OAuth2/ClientCredentials/index.js
index 59a9bdeec..856e9373e 100644
--- a/packages/bruno-app/src/components/CollectionSettings/Auth/OAuth2/ClientCredentials/index.js
+++ b/packages/bruno-app/src/components/CollectionSettings/Auth/OAuth2/ClientCredentials/index.js
@@ -7,8 +7,6 @@ import { saveCollectionRoot, sendCollectionOauth2Request } from 'providers/Redux
import StyledWrapper from './StyledWrapper';
import { inputsConfig } from './inputsConfig';
import { updateCollectionAuth } from 'providers/ReduxStore/slices/collections/index';
-import { clearOauth2Cache } from 'utils/network';
-import toast from 'react-hot-toast';
const OAuth2ClientCredentials = ({ collection }) => {
const dispatch = useDispatch();
@@ -41,16 +39,6 @@ const OAuth2ClientCredentials = ({ collection }) => {
);
};
- const handleClearCache = (e) => {
- clearOauth2Cache(collection?.uid)
- .then(() => {
- toast.success('cleared cache successfully');
- })
- .catch((err) => {
- toast.error(err.message);
- });
- };
-
return (
{inputsConfig.map((input) => {
@@ -72,14 +60,6 @@ const OAuth2ClientCredentials = ({ collection }) => {
);
})}
-
-
-
-
);
};
diff --git a/packages/bruno-app/src/components/CollectionSettings/Auth/OAuth2/PasswordCredentials/index.js b/packages/bruno-app/src/components/CollectionSettings/Auth/OAuth2/PasswordCredentials/index.js
index b07ceb72a..068f0070c 100644
--- a/packages/bruno-app/src/components/CollectionSettings/Auth/OAuth2/PasswordCredentials/index.js
+++ b/packages/bruno-app/src/components/CollectionSettings/Auth/OAuth2/PasswordCredentials/index.js
@@ -6,11 +6,9 @@ import SingleLineEditor from 'components/SingleLineEditor';
import { saveCollectionRoot, sendCollectionOauth2Request } from 'providers/ReduxStore/slices/collections/actions';
import StyledWrapper from './StyledWrapper';
import { inputsConfig } from './inputsConfig';
-import { updateCollectionAuth } from 'providers/ReduxStore/slices/collections/index';
-import { clearOauth2Cache } from 'utils/network';
-import toast from 'react-hot-toast';
+import { updateCollectionAuth } from 'providers/ReduxStore/slices/collections';
-const OAuth2AuthorizationCode = ({ item, collection }) => {
+const OAuth2PasswordCredentials = ({ collection }) => {
const dispatch = useDispatch();
const { storedTheme } = useTheme();
@@ -43,16 +41,6 @@ const OAuth2AuthorizationCode = ({ item, collection }) => {
);
};
- const handleClearCache = (e) => {
- clearOauth2Cache(collection?.uid)
- .then(() => {
- toast.success('cleared cache successfully');
- })
- .catch((err) => {
- toast.error(err.message);
- });
- };
-
return (
{inputsConfig.map((input) => {
@@ -74,16 +62,8 @@ const OAuth2AuthorizationCode = ({ item, collection }) => {
);
})}
-
-
-
-
);
};
-export default OAuth2AuthorizationCode;
+export default OAuth2PasswordCredentials;
diff --git a/packages/bruno-app/src/components/CollectionSettings/Auth/OAuth2/index.js b/packages/bruno-app/src/components/CollectionSettings/Auth/OAuth2/index.js
index 1aa674ab9..e9d511168 100644
--- a/packages/bruno-app/src/components/CollectionSettings/Auth/OAuth2/index.js
+++ b/packages/bruno-app/src/components/CollectionSettings/Auth/OAuth2/index.js
@@ -5,6 +5,7 @@ import GrantTypeSelector from './GrantTypeSelector/index';
import OAuth2PasswordCredentials from './PasswordCredentials/index';
import OAuth2AuthorizationCode from './AuthorizationCode/index';
import OAuth2ClientCredentials from './ClientCredentials/index';
+import CredentialsPreview from 'components/RequestPane/Auth/OAuth2/CredentialsPreview';
const grantTypeComponentMap = (grantType, collection) => {
switch (grantType) {
@@ -30,6 +31,7 @@ const OAuth2 = ({ collection }) => {
{grantTypeComponentMap(oAuth?.grantType, collection)}
+
);
};
diff --git a/packages/bruno-app/src/components/RequestPane/Auth/OAuth2/AuthorizationCode/index.js b/packages/bruno-app/src/components/RequestPane/Auth/OAuth2/AuthorizationCode/index.js
index 2bb5dcc35..0265ddbe4 100644
--- a/packages/bruno-app/src/components/RequestPane/Auth/OAuth2/AuthorizationCode/index.js
+++ b/packages/bruno-app/src/components/RequestPane/Auth/OAuth2/AuthorizationCode/index.js
@@ -7,8 +7,6 @@ import { updateAuth } from 'providers/ReduxStore/slices/collections';
import { saveRequest, sendRequest } from 'providers/ReduxStore/slices/collections/actions';
import StyledWrapper from './StyledWrapper';
import { inputsConfig } from './inputsConfig';
-import { clearOauth2Cache } from 'utils/network/index';
-import toast from 'react-hot-toast';
const OAuth2AuthorizationCode = ({ item, collection }) => {
const dispatch = useDispatch();
@@ -67,16 +65,6 @@ const OAuth2AuthorizationCode = ({ item, collection }) => {
);
};
- const handleClearCache = (e) => {
- clearOauth2Cache(collection?.uid)
- .then(() => {
- toast.success('cleared cache successfully');
- })
- .catch((err) => {
- toast.error(err.message);
- });
- };
-
return (
{inputsConfig.map((input) => {
@@ -108,14 +96,6 @@ const OAuth2AuthorizationCode = ({ item, collection }) => {
onChange={handlePKCEToggle}
/>
-
-
-
-
);
};
diff --git a/packages/bruno-app/src/components/RequestPane/Auth/OAuth2/ClientCredentials/index.js b/packages/bruno-app/src/components/RequestPane/Auth/OAuth2/ClientCredentials/index.js
index 9c9f1553d..1bbee2253 100644
--- a/packages/bruno-app/src/components/RequestPane/Auth/OAuth2/ClientCredentials/index.js
+++ b/packages/bruno-app/src/components/RequestPane/Auth/OAuth2/ClientCredentials/index.js
@@ -7,8 +7,6 @@ import { updateAuth } from 'providers/ReduxStore/slices/collections';
import { saveRequest, sendRequest } from 'providers/ReduxStore/slices/collections/actions';
import StyledWrapper from './StyledWrapper';
import { inputsConfig } from './inputsConfig';
-import { clearOauth2Cache } from 'utils/network';
-import toast from 'react-hot-toast';
const OAuth2ClientCredentials = ({ item, collection }) => {
const dispatch = useDispatch();
@@ -42,16 +40,6 @@ const OAuth2ClientCredentials = ({ item, collection }) => {
);
};
- const handleClearCache = (e) => {
- clearOauth2Cache(collection?.uid)
- .then(() => {
- toast.success('cleared cache successfully');
- })
- .catch((err) => {
- toast.error(err.message);
- });
- };
-
return (
{inputsConfig.map((input) => {
@@ -74,14 +62,6 @@ const OAuth2ClientCredentials = ({ item, collection }) => {
);
})}
-
-
-
-
);
};
diff --git a/packages/bruno-app/src/components/RequestPane/Auth/OAuth2/CredentialsPreview/StyledWrapper.js b/packages/bruno-app/src/components/RequestPane/Auth/OAuth2/CredentialsPreview/StyledWrapper.js
new file mode 100644
index 000000000..a1f84cfe6
--- /dev/null
+++ b/packages/bruno-app/src/components/RequestPane/Auth/OAuth2/CredentialsPreview/StyledWrapper.js
@@ -0,0 +1,17 @@
+import styled from 'styled-components';
+
+const Wrapper = styled.div`
+ label {
+ display: block;
+ font-size: 0.8125rem;
+ }
+
+ textarea {
+ height: fit-content;
+ max-width: 400px;
+ 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/OAuth2/CredentialsPreview/index.js b/packages/bruno-app/src/components/RequestPane/Auth/OAuth2/CredentialsPreview/index.js
new file mode 100644
index 000000000..d7415fe25
--- /dev/null
+++ b/packages/bruno-app/src/components/RequestPane/Auth/OAuth2/CredentialsPreview/index.js
@@ -0,0 +1,80 @@
+import React, { useEffect, useState } from 'react';
+import { clearOauth2Cache, readOauth2CachedCredentials } from 'utils/network';
+import { sendCollectionOauth2Request, sendRequest } from 'providers/ReduxStore/slices/collections/actions';
+import toast from 'react-hot-toast';
+import { useDispatch } from 'react-redux';
+import StyledWrapper from './StyledWrapper';
+
+const CredentialsPreview = ({ item, collection }) => {
+ const oauth2CredentialsAreaRef = React.createRef();
+ const [oauth2Credentials, setOauth2Credentials] = useState({});
+
+ const dispatch = useDispatch();
+ useEffect(() => {
+ oauth2CredentialsAreaRef.current.value = oauth2Credentials;
+ readOauth2CachedCredentials(collection.uid).then((credentials) => setOauth2Credentials(credentials));
+ }, [oauth2CredentialsAreaRef]);
+
+ const handleRun = async () => {
+ if (item) {
+ dispatch(sendRequest(item, collection.uid));
+ } else {
+ dispatch(sendCollectionOauth2Request(collection.uid));
+ }
+ };
+
+ const handleClearCache = (e) => {
+ clearOauth2Cache(collection?.uid)
+ .then(() => {
+ readOauth2CachedCredentials(collection.uid).then((credentials) => {
+ setOauth2Credentials(credentials);
+ toast.success('Cleared cache successfully');
+ });
+ })
+ .catch((err) => {
+ toast.error(err.message);
+ });
+ };
+
+ const sortedFields = () => {
+ const tokens = {};
+ const extras = {};
+ Object.entries(oauth2Credentials).forEach(([key, value]) => {
+ if (key.endsWith('_token')) {
+ tokens[key] = value;
+ } else {
+ extras[key] = value;
+ }
+ });
+ return { ...tokens, ...extras };
+ };
+
+ return (
+
+
+ {Object.entries(oauth2Credentials).length > 0 ? (
+ <>
+
+
+ Cached OAuth2 Credentials
+ {Object.entries(sortedFields()).map(([field, value]) => (
+
+
+
+
+ ))}
+
+
+ ) : (
+
+ )}
+
-
-
-
);
};
-export default OAuth2AuthorizationCode;
+export default OAuth2PasswordCredentials;
diff --git a/packages/bruno-app/src/components/RequestPane/Auth/OAuth2/index.js b/packages/bruno-app/src/components/RequestPane/Auth/OAuth2/index.js
index 3965c8d3e..24ec0c8e1 100644
--- a/packages/bruno-app/src/components/RequestPane/Auth/OAuth2/index.js
+++ b/packages/bruno-app/src/components/RequestPane/Auth/OAuth2/index.js
@@ -5,6 +5,7 @@ import GrantTypeSelector from './GrantTypeSelector/index';
import OAuth2PasswordCredentials from './PasswordCredentials/index';
import OAuth2AuthorizationCode from './AuthorizationCode/index';
import OAuth2ClientCredentials from './ClientCredentials/index';
+import CredentialsPreview from './CredentialsPreview';
const grantTypeComponentMap = (grantType, item, collection) => {
switch (grantType) {
@@ -30,6 +31,7 @@ const OAuth2 = ({ item, collection }) => {
{grantTypeComponentMap(oAuth?.grantType, item, collection)}
+
);
};
diff --git a/packages/bruno-app/src/utils/network/index.js b/packages/bruno-app/src/utils/network/index.js
index 18a2b8a1c..463e82c7c 100644
--- a/packages/bruno-app/src/utils/network/index.js
+++ b/packages/bruno-app/src/utils/network/index.js
@@ -50,6 +50,13 @@ export const clearOauth2Cache = async (uid) => {
});
};
+export const readOauth2CachedCredentials = async (uid) => {
+ return new Promise((resolve, reject) => {
+ const { ipcRenderer } = window;
+ ipcRenderer.invoke('read-oauth2-cached-credentials', uid).then(resolve).catch(reject);
+ });
+};
+
export const fetchGqlSchema = async (endpoint, environment, request, collection) => {
return new Promise((resolve, reject) => {
const { ipcRenderer } = window;
diff --git a/packages/bruno-electron/src/ipc/network/index.js b/packages/bruno-electron/src/ipc/network/index.js
index be81fa01c..e02f7a009 100644
--- a/packages/bruno-electron/src/ipc/network/index.js
+++ b/packages/bruno-electron/src/ipc/network/index.js
@@ -787,6 +787,17 @@ const registerNetworkIpc = (mainWindow) => {
});
});
+ ipcMain.handle('read-oauth2-cached-credentials', async (event, uid) => {
+ return new Promise((resolve, reject) => {
+ try {
+ const oauth2Store = new Oauth2Store();
+ return resolve(oauth2Store.getOauth2DataOfCollection(uid).credentials ?? {});
+ } catch (err) {
+ reject(new Error('Could not read cached oauth2 credentials'));
+ }
+ });
+ });
+
ipcMain.handle('cancel-http-request', async (event, cancelTokenUid) => {
return new Promise((resolve, reject) => {
if (cancelTokenUid && cancelTokens[cancelTokenUid]) {