From 0d7c94e7e9a59d81988543e96cea44e6b8935d49 Mon Sep 17 00:00:00 2001
From: pooja-bruno <pooja@usebruno.com>
Date: Tue, 6 May 2025 18:41:40 +0530
Subject: [PATCH] add: auth for other

---
 .../RequestPane/Auth/ApiKeyAuth/index.js      | 62 ++++++++++---------
 .../RequestPane/Auth/AwsV4Auth/index.js       |  9 ++-
 .../RequestPane/Auth/DigestAuth/index.js      | 10 +--
 .../RequestPane/Auth/NTLMAuth/index.js        | 10 +--
 .../RequestPane/Auth/WsseAuth/index.js        | 12 +++-
 .../src/components/RequestPane/Auth/index.js  | 12 ++--
 6 files changed, 67 insertions(+), 48 deletions(-)

diff --git a/packages/bruno-app/src/components/RequestPane/Auth/ApiKeyAuth/index.js b/packages/bruno-app/src/components/RequestPane/Auth/ApiKeyAuth/index.js
index 22a16563e..acf706c5a 100644
--- a/packages/bruno-app/src/components/RequestPane/Auth/ApiKeyAuth/index.js
+++ b/packages/bruno-app/src/components/RequestPane/Auth/ApiKeyAuth/index.js
@@ -10,16 +10,19 @@ import { sendRequest, saveRequest } from 'providers/ReduxStore/slices/collection
 import StyledWrapper from './StyledWrapper';
 import { humanizeRequestAPIKeyPlacement } from 'utils/collections';
 
-const ApiKeyAuth = ({ item, collection }) => {
+const ApiKeyAuth = ({ item, collection, updateAuth, request, save }) => {
   const dispatch = useDispatch();
   const { storedTheme } = useTheme();
   const dropdownTippyRef = useRef();
   const onDropdownCreate = (ref) => (dropdownTippyRef.current = ref);
 
-  const apikeyAuth = item.draft ? get(item, 'draft.request.auth.apikey', {}) : get(item, 'request.auth.apikey', {});
+  const apikeyAuth = get(request, 'auth.apikey', {});
 
   const handleRun = () => dispatch(sendRequest(item, collection.uid));
-  const handleSave = () => dispatch(saveRequest(item.uid, collection.uid));
+  
+  const handleSave = () => {
+    save();
+  };
 
   const Icon = forwardRef((props, ref) => {
     return (
@@ -60,6 +63,30 @@ const ApiKeyAuth = ({ item, collection }) => {
 
   return (
     <StyledWrapper className="mt-2 w-full">
+      <div className="flex items-center mb-2">
+        <div className="mr-4 font-medium">Add To</div>
+        <Dropdown onCreate={onDropdownCreate} icon={<Icon />} placement="bottom-end">
+          <div
+            className="dropdown-item"
+            onClick={() => {
+              dropdownTippyRef?.current?.hide();
+              handleAuthChange('placement', 'header');
+            }}
+          >
+            Header
+          </div>
+          <div
+            className="dropdown-item"
+            onClick={() => {
+              dropdownTippyRef?.current?.hide();
+              handleAuthChange('placement', 'queryParam');
+            }}
+          >
+            Query Param
+          </div>
+        </Dropdown>
+      </div>
+
       <label className="block font-medium mb-2">Key</label>
       <div className="single-line-editor-wrapper mb-2">
         <SingleLineEditor
@@ -69,11 +96,12 @@ const ApiKeyAuth = ({ item, collection }) => {
           onChange={(val) => handleAuthChange('key', val)}
           onRun={handleRun}
           collection={collection}
+          item={item}
         />
       </div>
 
       <label className="block font-medium mb-2">Value</label>
-      <div className="single-line-editor-wrapper mb-2">
+      <div className="single-line-editor-wrapper">
         <SingleLineEditor
           value={apikeyAuth.value || ''}
           theme={storedTheme}
@@ -81,32 +109,10 @@ const ApiKeyAuth = ({ item, collection }) => {
           onChange={(val) => handleAuthChange('value', val)}
           onRun={handleRun}
           collection={collection}
+          item={item}
+          isSecret={true}
         />
       </div>
-
-      <label className="block font-medium mb-2">Add To</label>
-      <div className="inline-flex items-center cursor-pointer auth-placement-selector w-fit">
-        <Dropdown onCreate={onDropdownCreate} icon={<Icon />} placement="bottom-end">
-          <div
-            className="dropdown-item"
-            onClick={() => {
-              dropdownTippyRef.current.hide();
-              handleAuthChange('placement', 'header');
-            }}
-          >
-            Header
-          </div>
-          <div
-            className="dropdown-item"
-            onClick={() => {
-              dropdownTippyRef.current.hide();
-              handleAuthChange('placement', 'queryparams');
-            }}
-          >
-            Query Params
-          </div>
-        </Dropdown>
-      </div>
     </StyledWrapper>
   );
 };
diff --git a/packages/bruno-app/src/components/RequestPane/Auth/AwsV4Auth/index.js b/packages/bruno-app/src/components/RequestPane/Auth/AwsV4Auth/index.js
index a44cecc1b..75469d784 100644
--- a/packages/bruno-app/src/components/RequestPane/Auth/AwsV4Auth/index.js
+++ b/packages/bruno-app/src/components/RequestPane/Auth/AwsV4Auth/index.js
@@ -8,14 +8,17 @@ import { sendRequest, saveRequest } from 'providers/ReduxStore/slices/collection
 import StyledWrapper from './StyledWrapper';
 import { update } from 'lodash';
 
-const AwsV4Auth = ({ onTokenChange, item, collection }) => {
+const AwsV4Auth = ({ item, collection, updateAuth, request, save }) => {
   const dispatch = useDispatch();
   const { storedTheme } = useTheme();
 
-  const awsv4Auth = item.draft ? get(item, 'draft.request.auth.awsv4', {}) : get(item, 'request.auth.awsv4', {});
+  const awsv4Auth = get(request, 'auth.awsv4', {});
 
   const handleRun = () => dispatch(sendRequest(item, collection.uid));
-  const handleSave = () => dispatch(saveRequest(item.uid, collection.uid));
+  
+  const handleSave = () => {
+    save();
+  };
 
   const handleAccessKeyIdChange = (accessKeyId) => {
     dispatch(
diff --git a/packages/bruno-app/src/components/RequestPane/Auth/DigestAuth/index.js b/packages/bruno-app/src/components/RequestPane/Auth/DigestAuth/index.js
index e91ed8d1f..50b92f669 100644
--- a/packages/bruno-app/src/components/RequestPane/Auth/DigestAuth/index.js
+++ b/packages/bruno-app/src/components/RequestPane/Auth/DigestAuth/index.js
@@ -3,18 +3,20 @@ 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';
 
-const DigestAuth = ({ item, collection }) => {
+const DigestAuth = ({ item, collection, updateAuth, request, save }) => {
   const dispatch = useDispatch();
   const { storedTheme } = useTheme();
 
-  const digestAuth = item.draft ? get(item, 'draft.request.auth.digest', {}) : get(item, 'request.auth.digest', {});
+  const digestAuth = get(request, 'auth.digest', {});
 
   const handleRun = () => dispatch(sendRequest(item, collection.uid));
-  const handleSave = () => dispatch(saveRequest(item.uid, collection.uid));
+  
+  const handleSave = () => {
+    save();
+  };
 
   const handleUsernameChange = (username) => {
     dispatch(
diff --git a/packages/bruno-app/src/components/RequestPane/Auth/NTLMAuth/index.js b/packages/bruno-app/src/components/RequestPane/Auth/NTLMAuth/index.js
index 65e756041..1164fb903 100644
--- a/packages/bruno-app/src/components/RequestPane/Auth/NTLMAuth/index.js
+++ b/packages/bruno-app/src/components/RequestPane/Auth/NTLMAuth/index.js
@@ -7,14 +7,17 @@ import { updateAuth } from 'providers/ReduxStore/slices/collections';
 import { sendRequest, saveRequest } from 'providers/ReduxStore/slices/collections/actions';
 import StyledWrapper from './StyledWrapper';
 
-const NTLMAuth = ({ item, collection }) => {
+const NTLMAuth = ({ item, collection, request, save, updateAuth }) => {
   const dispatch = useDispatch();
   const { storedTheme } = useTheme();
 
-  const ntlmAuth = item.draft ? get(item, 'draft.request.auth.ntlm', {}) : get(item, 'request.auth.ntlm', {});
+  const ntlmAuth = get(request, 'auth.ntlm', {});
 
   const handleRun = () => dispatch(sendRequest(item, collection.uid));
-  const handleSave = () => dispatch(saveRequest(item.uid, collection.uid));
+  
+  const handleSave = () => {
+    save();
+  };
 
   const handleUsernameChange = (username) => {
     dispatch(
@@ -26,7 +29,6 @@ const NTLMAuth = ({ item, collection }) => {
           username: username,
           password: ntlmAuth.password,
           domain: ntlmAuth.domain
-
         }
       })
     );
diff --git a/packages/bruno-app/src/components/RequestPane/Auth/WsseAuth/index.js b/packages/bruno-app/src/components/RequestPane/Auth/WsseAuth/index.js
index 76a20e6f6..ae201370e 100644
--- a/packages/bruno-app/src/components/RequestPane/Auth/WsseAuth/index.js
+++ b/packages/bruno-app/src/components/RequestPane/Auth/WsseAuth/index.js
@@ -7,14 +7,17 @@ import { updateAuth } from 'providers/ReduxStore/slices/collections';
 import { sendRequest, saveRequest } from 'providers/ReduxStore/slices/collections/actions';
 import StyledWrapper from './StyledWrapper';
 
-const WsseAuth = ({ item, collection }) => {
+const WsseAuth = ({ item, collection, updateAuth, request, save }) => {
   const dispatch = useDispatch();
   const { storedTheme } = useTheme();
 
-  const wsseAuth = item.draft ? get(item, 'draft.request.auth.wsse', {}) : get(item, 'request.auth.wsse', {});
+  const wsseAuth = get(request, 'auth.wsse', {});
 
   const handleRun = () => dispatch(sendRequest(item, collection.uid));
-  const handleSave = () => dispatch(saveRequest(item.uid, collection.uid));
+  
+  const handleSave = () => {
+    save();
+  };
 
   const handleUserChange = (username) => {
     dispatch(
@@ -55,6 +58,7 @@ const WsseAuth = ({ item, collection }) => {
           onChange={(val) => handleUserChange(val)}
           onRun={handleRun}
           collection={collection}
+          item={item}
         />
       </div>
 
@@ -67,6 +71,8 @@ const WsseAuth = ({ item, collection }) => {
           onChange={(val) => handlePasswordChange(val)}
           onRun={handleRun}
           collection={collection}
+          item={item}
+          isSecret={true}
         />
       </div>
     </StyledWrapper>
diff --git a/packages/bruno-app/src/components/RequestPane/Auth/index.js b/packages/bruno-app/src/components/RequestPane/Auth/index.js
index a1469675a..8ca23ab8d 100644
--- a/packages/bruno-app/src/components/RequestPane/Auth/index.js
+++ b/packages/bruno-app/src/components/RequestPane/Auth/index.js
@@ -71,7 +71,7 @@ const Auth = ({ item, collection }) => {
   const getAuthView = () => {
     switch (authMode) {
       case 'awsv4': {
-        return <AwsV4Auth collection={collection} item={item} />;
+        return <AwsV4Auth collection={collection} item={item} request={request} save={save} updateAuth={updateAuth} />;
       }
       case 'basic': {
         return <BasicAuth collection={collection} item={item} request={request} save={save} updateAuth={updateAuth} />;
@@ -80,19 +80,19 @@ const Auth = ({ item, collection }) => {
         return <BearerAuth collection={collection} item={item} request={request} save={save} updateAuth={updateAuth} />;
       }
       case 'digest': {
-        return <DigestAuth collection={collection} item={item} />;
+        return <DigestAuth collection={collection} item={item} request={request} save={save} updateAuth={updateAuth} />;
       }
       case 'ntlm': {
-        return <NTLMAuth collection={collection} item={item} />;
+        return <NTLMAuth collection={collection} item={item} request={request} save={save} updateAuth={updateAuth} />;
       }      
       case 'oauth2': {
-        return <OAuth2 collection={collection} item={item} />;
+        return <OAuth2 collection={collection} item={item} request={request} save={save} updateAuth={updateAuth} />;
       }
       case 'wsse': {
-        return <WsseAuth collection={collection} item={item} />;
+        return <WsseAuth collection={collection} item={item} request={request} save={save} updateAuth={updateAuth} />;
       }
       case 'apikey': {
-        return <ApiKeyAuth collection={collection} item={item} />;
+        return <ApiKeyAuth collection={collection} item={item} request={request} save={save} updateAuth={updateAuth} />;
       }
       case 'inherit': {
         const source = getEffectiveAuthSource();