From 2c933cdd2df172da5922e2167a7c7905779ae541 Mon Sep 17 00:00:00 2001
From: Mateusz Pietryga <pietryga.m@gmail.com>
Date: Sun, 14 Apr 2024 16:52:37 +0200
Subject: [PATCH] Feat: UI for OAuth2 Credentials independent of the Request
 Output pane

#1999
#1003
---
 .../Auth/OAuth2/AuthorizationCode/index.js    | 21 -------
 .../Auth/OAuth2/ClientCredentials/index.js    | 20 -------
 .../Auth/OAuth2/CredentialsPreview/index.js   | 57 +++++++++++++++++++
 .../Auth/OAuth2/Implicit/index.js             | 20 -------
 .../Auth/OAuth2/PasswordCredentials/index.js  | 22 +------
 .../CollectionSettings/Auth/OAuth2/index.js   |  2 +
 .../Auth/OAuth2/AuthorizationCode/index.js    | 20 -------
 .../Auth/OAuth2/ClientCredentials/index.js    | 20 -------
 .../Auth/OAuth2/CredentialsPreview/index.js   | 57 +++++++++++++++++++
 .../RequestPane/Auth/OAuth2/Implicit/index.js |  8 ---
 .../Auth/OAuth2/PasswordCredentials/index.js  | 22 +------
 .../RequestPane/Auth/OAuth2/index.js          |  2 +
 packages/bruno-app/src/utils/network/index.js |  7 +++
 .../bruno-electron/src/ipc/network/index.js   | 11 ++++
 14 files changed, 138 insertions(+), 151 deletions(-)
 create mode 100644 packages/bruno-app/src/components/CollectionSettings/Auth/OAuth2/CredentialsPreview/index.js
 create mode 100644 packages/bruno-app/src/components/RequestPane/Auth/OAuth2/CredentialsPreview/index.js

diff --git a/packages/bruno-app/src/components/CollectionSettings/Auth/OAuth2/AuthorizationCode/index.js b/packages/bruno-app/src/components/CollectionSettings/Auth/OAuth2/AuthorizationCode/index.js
index 674db53a89..52a391fd59 100644
--- a/packages/bruno-app/src/components/CollectionSettings/Auth/OAuth2/AuthorizationCode/index.js
+++ b/packages/bruno-app/src/components/CollectionSettings/Auth/OAuth2/AuthorizationCode/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/index';
-import toast from 'react-hot-toast';
 
 const OAuth2AuthorizationCode = ({ collection }) => {
   const dispatch = useDispatch();
@@ -62,17 +60,6 @@ const OAuth2AuthorizationCode = ({ collection }) => {
       })
     );
   };
-
-  const handleClearCache = (e) => {
-    clearOauth2Cache(collection?.uid)
-      .then(() => {
-        toast.success('cleared cache successfully');
-      })
-      .catch((err) => {
-        toast.error(err.message);
-      });
-  };
-
   return (
     <StyledWrapper className="mt-2 flex w-full gap-4 flex-col">
       {inputsConfig.map((input) => {
@@ -102,14 +89,6 @@ const OAuth2AuthorizationCode = ({ collection }) => {
           onChange={handlePKCEToggle}
         />
       </div>
-      <div className="flex flex-row gap-4">
-        <button onClick={handleRun} className="submit btn btn-sm btn-secondary w-fit">
-          Get Access Token
-        </button>
-        <button onClick={handleClearCache} className="submit btn btn-sm btn-secondary w-fit">
-          Clear Cache
-        </button>
-      </div>
     </StyledWrapper>
   );
 };
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 07e3a77ae3..4e3193bd36 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 (
     <StyledWrapper className="mt-2 flex w-full gap-4 flex-col">
       {inputsConfig.map((input) => {
@@ -71,14 +59,6 @@ const OAuth2ClientCredentials = ({ collection }) => {
           </div>
         );
       })}
-      <div className="flex flex-row gap-4">
-        <button onClick={handleRun} className="submit btn btn-sm btn-secondary w-fit">
-          Get Access Token
-        </button>
-        <button onClick={handleClearCache} className="submit btn btn-sm btn-secondary w-fit">
-          Clear Cache
-        </button>
-      </div>
     </StyledWrapper>
   );
 };
diff --git a/packages/bruno-app/src/components/CollectionSettings/Auth/OAuth2/CredentialsPreview/index.js b/packages/bruno-app/src/components/CollectionSettings/Auth/OAuth2/CredentialsPreview/index.js
new file mode 100644
index 0000000000..a6afbef0c4
--- /dev/null
+++ b/packages/bruno-app/src/components/CollectionSettings/Auth/OAuth2/CredentialsPreview/index.js
@@ -0,0 +1,57 @@
+import React, { useEffect, useState } from 'react';
+import { clearOauth2Cache, readOauth2CachedCredentials } from 'utils/network';
+import { sendCollectionOauth2Request } from 'providers/ReduxStore/slices/collections/actions';
+import toast from 'react-hot-toast';
+import { useDispatch } from 'react-redux';
+
+const CredentialsPreview = ({ 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 () => {
+    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);
+      });
+  };
+
+  return (
+    <div className="flex flex-col w-full gap-1 mt-4">
+      <div className="flex flex-row gap-4">
+        <button onClick={handleRun} className="submit btn btn-sm btn-secondary w-fit">
+          Get Access Token
+        </button>
+        <button onClick={handleClearCache} className="submit btn btn-sm btn-secondary w-fit">
+          Clear Cache
+        </button>
+      </div>
+      <div ref={oauth2CredentialsAreaRef}>
+        <label className="flex flex-row w-full mt-2 gap-2">Cached OAuth2 Credentials:</label>
+        {Object.entries(oauth2Credentials).map(([key, value]) => (
+          <div key={key}>
+            <label className="text-xs">{key}</label>
+            <textarea className="w-full h-24 p-2 text-xs border rounded" value={value} readOnly />
+          </div>
+        ))}
+      </div>
+    </div>
+  );
+};
+
+export default CredentialsPreview;
diff --git a/packages/bruno-app/src/components/CollectionSettings/Auth/OAuth2/Implicit/index.js b/packages/bruno-app/src/components/CollectionSettings/Auth/OAuth2/Implicit/index.js
index 1dee00f16a..4507ab98af 100644
--- a/packages/bruno-app/src/components/CollectionSettings/Auth/OAuth2/Implicit/index.js
+++ b/packages/bruno-app/src/components/CollectionSettings/Auth/OAuth2/Implicit/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 OAuth2Implicit = ({ item, collection }) => {
   const dispatch = useDispatch();
@@ -41,16 +39,6 @@ const OAuth2Implicit = ({ item, collection }) => {
     );
   };
 
-  const handleClearCache = (e) => {
-    clearOauth2Cache(collection?.uid)
-      .then(() => {
-        toast.success('cleared cache successfully');
-      })
-      .catch((err) => {
-        toast.error(err.message);
-      });
-  };
-
   return (
     <StyledWrapper className="mt-2 flex w-full gap-4 flex-col">
       {inputsConfig.map((input) => {
@@ -71,14 +59,6 @@ const OAuth2Implicit = ({ item, collection }) => {
           </div>
         );
       })}
-      <div className="flex flex-row gap-4">
-        <button onClick={handleRun} className="submit btn btn-sm btn-secondary w-fit">
-          Get Access Token
-        </button>
-        <button onClick={handleClearCache} className="submit btn btn-sm btn-secondary w-fit">
-          Clear Cache
-        </button>
-      </div>
     </StyledWrapper>
   );
 };
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 94c19d213e..f7832a30b5 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,9 +6,7 @@ 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 OAuth2PasswordCredentials = ({ collection }) => {
   const dispatch = useDispatch();
@@ -43,16 +41,6 @@ const OAuth2PasswordCredentials = ({ collection }) => {
     );
   };
 
-  const handleClearCache = (e) => {
-    clearOauth2Cache(collection?.uid)
-      .then(() => {
-        toast.success('cleared cache successfully');
-      })
-      .catch((err) => {
-        toast.error(err.message);
-      });
-  };
-
   return (
     <StyledWrapper className="mt-2 flex w-full gap-4 flex-col">
       {inputsConfig.map((input) => {
@@ -73,14 +61,6 @@ const OAuth2PasswordCredentials = ({ collection }) => {
           </div>
         );
       })}
-      <div className="flex flex-row gap-4">
-        <button onClick={handleRun} className="submit btn btn-sm btn-secondary w-fit">
-          Get Access Token
-        </button>
-        <button onClick={handleClearCache} className="submit btn btn-sm btn-secondary w-fit">
-          Clear Cache
-        </button>
-      </div>
     </StyledWrapper>
   );
 };
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 2075aa8ca9..ac5a55cecb 100644
--- a/packages/bruno-app/src/components/CollectionSettings/Auth/OAuth2/index.js
+++ b/packages/bruno-app/src/components/CollectionSettings/Auth/OAuth2/index.js
@@ -6,6 +6,7 @@ import OAuth2PasswordCredentials from './PasswordCredentials/index';
 import OAuth2AuthorizationCode from './AuthorizationCode/index';
 import OAuth2ClientCredentials from './ClientCredentials/index';
 import OAuth2Implicit from './Implicit/index';
+import CredentialsPreview from './CredentialsPreview';
 
 const grantTypeComponentMap = (grantType, collection) => {
   switch (grantType) {
@@ -34,6 +35,7 @@ const OAuth2 = ({ collection }) => {
     <StyledWrapper className="mt-2 w-full">
       <GrantTypeSelector collection={collection} />
       {grantTypeComponentMap(oAuth?.grantType, collection)}
+      <CredentialsPreview collection={collection} />
     </StyledWrapper>
   );
 };
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 08a77555cf..1c9341bdb3 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();
@@ -65,16 +63,6 @@ const OAuth2AuthorizationCode = ({ item, collection }) => {
     );
   };
 
-  const handleClearCache = (e) => {
-    clearOauth2Cache(collection?.uid)
-      .then(() => {
-        toast.success('cleared cache successfully');
-      })
-      .catch((err) => {
-        toast.error(err.message);
-      });
-  };
-
   return (
     <StyledWrapper className="mt-2 flex w-full gap-4 flex-col">
       {inputsConfig.map((input) => {
@@ -104,14 +92,6 @@ const OAuth2AuthorizationCode = ({ item, collection }) => {
           onChange={handlePKCEToggle}
         />
       </div>
-      <div className="flex flex-row gap-4">
-        <button onClick={handleRun} className="submit btn btn-sm btn-secondary w-fit">
-          Get Access Token
-        </button>
-        <button onClick={handleClearCache} className="submit btn btn-sm btn-secondary w-fit">
-          Clear Cache
-        </button>
-      </div>
     </StyledWrapper>
   );
 };
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 b47d2874fe..f8bd46af50 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 (
     <StyledWrapper className="mt-2 flex w-full gap-4 flex-col">
       {inputsConfig.map((input) => {
@@ -72,14 +60,6 @@ const OAuth2ClientCredentials = ({ item, collection }) => {
           </div>
         );
       })}
-      <div className="flex flex-row gap-4">
-        <button onClick={handleRun} className="submit btn btn-sm btn-secondary w-fit">
-          Get Access Token
-        </button>
-        <button onClick={handleClearCache} className="submit btn btn-sm btn-secondary w-fit">
-          Clear Cache
-        </button>
-      </div>
     </StyledWrapper>
   );
 };
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 0000000000..65072a2e5f
--- /dev/null
+++ b/packages/bruno-app/src/components/RequestPane/Auth/OAuth2/CredentialsPreview/index.js
@@ -0,0 +1,57 @@
+import React, { useEffect, useState } from 'react';
+import { clearOauth2Cache, readOauth2CachedCredentials } from 'utils/network';
+import { sendRequest } from 'providers/ReduxStore/slices/collections/actions';
+import toast from 'react-hot-toast';
+import { useDispatch } from 'react-redux';
+
+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 () => {
+    dispatch(sendRequest(item, 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);
+      });
+  };
+
+  return (
+    <div className="flex flex-col w-full gap-1 mt-4">
+      <div className="flex flex-row gap-4">
+        <button onClick={handleRun} className="submit btn btn-sm btn-secondary w-fit">
+          Get Access Token
+        </button>
+        <button onClick={handleClearCache} className="submit btn btn-sm btn-secondary w-fit">
+          Clear Cache
+        </button>
+      </div>
+      <div ref={oauth2CredentialsAreaRef}>
+        <label className="flex flex-row w-full mt-2 gap-2">Cached OAuth2 Credentials:</label>
+        {Object.entries(oauth2Credentials).map(([key, value]) => (
+          <div key={key}>
+            <label className="text-xs">{key}</label>
+            <textarea className="w-full h-24 p-2 text-xs border rounded" value={value} readOnly />
+          </div>
+        ))}
+      </div>
+    </div>
+  );
+};
+
+export default CredentialsPreview;
diff --git a/packages/bruno-app/src/components/RequestPane/Auth/OAuth2/Implicit/index.js b/packages/bruno-app/src/components/RequestPane/Auth/OAuth2/Implicit/index.js
index 690b821977..006d71dfcd 100644
--- a/packages/bruno-app/src/components/RequestPane/Auth/OAuth2/Implicit/index.js
+++ b/packages/bruno-app/src/components/RequestPane/Auth/OAuth2/Implicit/index.js
@@ -72,14 +72,6 @@ const OAuth2Implicit = ({ item, collection }) => {
           </div>
         );
       })}
-      <div className="flex flex-row gap-4">
-        <button onClick={handleRun} className="submit btn btn-sm btn-secondary w-fit">
-          Get Access Token
-        </button>
-        <button onClick={handleClearCache} className="submit btn btn-sm btn-secondary w-fit">
-          Clear Cache
-        </button>
-      </div>
     </StyledWrapper>
   );
 };
diff --git a/packages/bruno-app/src/components/RequestPane/Auth/OAuth2/PasswordCredentials/index.js b/packages/bruno-app/src/components/RequestPane/Auth/OAuth2/PasswordCredentials/index.js
index b88b28d4a1..8beff1db84 100644
--- a/packages/bruno-app/src/components/RequestPane/Auth/OAuth2/PasswordCredentials/index.js
+++ b/packages/bruno-app/src/components/RequestPane/Auth/OAuth2/PasswordCredentials/index.js
@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { useEffect, useState } from 'react';
 import get from 'lodash/get';
 import { useTheme } from 'providers/Theme';
 import { useDispatch } from 'react-redux';
@@ -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 OAuth2PasswordCredentials = ({ item, collection }) => {
   const dispatch = useDispatch();
@@ -44,16 +42,6 @@ const OAuth2PasswordCredentials = ({ item, collection }) => {
     );
   };
 
-  const handleClearCache = (e) => {
-    clearOauth2Cache(collection?.uid)
-      .then(() => {
-        toast.success('cleared cache successfully');
-      })
-      .catch((err) => {
-        toast.error(err.message);
-      });
-  };
-
   return (
     <StyledWrapper className="mt-2 flex w-full gap-4 flex-col">
       {inputsConfig.map((input) => {
@@ -74,14 +62,6 @@ const OAuth2PasswordCredentials = ({ item, collection }) => {
           </div>
         );
       })}
-      <div className="flex flex-row gap-4">
-        <button onClick={handleRun} className="submit btn btn-sm btn-secondary w-fit">
-          Get Access Token
-        </button>
-        <button onClick={handleClearCache} className="submit btn btn-sm btn-secondary w-fit">
-          Clear Cache
-        </button>
-      </div>
     </StyledWrapper>
   );
 };
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 05a3fe79c1..8f670f5d30 100644
--- a/packages/bruno-app/src/components/RequestPane/Auth/OAuth2/index.js
+++ b/packages/bruno-app/src/components/RequestPane/Auth/OAuth2/index.js
@@ -6,6 +6,7 @@ import OAuth2PasswordCredentials from './PasswordCredentials/index';
 import OAuth2AuthorizationCode from './AuthorizationCode/index';
 import OAuth2ClientCredentials from './ClientCredentials/index';
 import OAuth2Implicit from './Implicit/index';
+import CredentialsPreview from './CredentialsPreview';
 
 const grantTypeComponentMap = (grantType, item, collection) => {
   switch (grantType) {
@@ -34,6 +35,7 @@ const OAuth2 = ({ item, collection }) => {
     <StyledWrapper className="mt-2 w-full">
       <GrantTypeSelector item={item} collection={collection} />
       {grantTypeComponentMap(oAuth?.grantType, item, collection)}
+      <CredentialsPreview item={item} collection={collection} />
     </StyledWrapper>
   );
 };
diff --git a/packages/bruno-app/src/utils/network/index.js b/packages/bruno-app/src/utils/network/index.js
index e76a7debdb..4d099a95ab 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 2de59c3c58..8dd063e392 100644
--- a/packages/bruno-electron/src/ipc/network/index.js
+++ b/packages/bruno-electron/src/ipc/network/index.js
@@ -716,6 +716,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]) {