mirror of
https://github.com/usebruno/bruno.git
synced 2026-07-07 22:18:33 +00:00
* Refactor dropdown components to use MenuDropdown for improved functionality and keyboard accessibility - Replaced Dropdown with MenuDropdown in various components including BodyModeSelector, AuthMode, and RequestBodyMode. - Updated styles and structure for better usability and accessibility. - Removed unused Dropdown component and its associated styles. - Enhanced action buttons in ResponsePane and Collection components with ActionIcon for better UI consistency. * fix: Update HttpMethodSelector styles and tests for improved accessibility - Changed the class name for the "Add Custom" button to include 'text-link' for better styling. - Updated tests to use role-based queries for dropdown items, enhancing accessibility checks. - Ensured the correct application of classes in tests to reflect the updated structure. * refactor: Improve component accessibility and consistency * fix: update hover behavior for collection actions menu in runner.ts * refactor: streamline hover interactions for collection actions across tests * refactor: enhance component structure and accessibility across response actions * fix: correct fill property syntax in StyledWrapper for consistent styling * refactor: simplify isDisabled logic in response components for clarity * fix: correct tabIndex logic in ResponseCopy component for improved accessibility * fix: update tabIndex logic in ResponseBookmark component for improved accessibility * fix: enable action buttons in ResponsePaneActions for improved usability * refactor: remove unnecessary tabIndex attributes in response components for improved accessibility * refactor: remove keyDown event handlers from response components for cleaner interaction * refactor: remove SidebarHeader component and related styles for improved structure
124 lines
4.2 KiB
JavaScript
124 lines
4.2 KiB
JavaScript
import React from 'react';
|
|
import get from 'lodash/get';
|
|
import AwsV4Auth from './AwsV4Auth';
|
|
import BearerAuth from './BearerAuth';
|
|
import BasicAuth from './BasicAuth';
|
|
import DigestAuth from './DigestAuth';
|
|
import WsseAuth from './WsseAuth';
|
|
import NTLMAuth from './NTLMAuth';
|
|
import { updateAuth } from 'providers/ReduxStore/slices/collections';
|
|
import { saveRequest } from 'providers/ReduxStore/slices/collections/actions';
|
|
import { useDispatch } from 'react-redux';
|
|
|
|
import ApiKeyAuth from './ApiKeyAuth';
|
|
import StyledWrapper from './StyledWrapper';
|
|
import { humanizeRequestAuthMode } from 'utils/collections';
|
|
import OAuth2 from './OAuth2/index';
|
|
import { findItemInCollection, findParentItemInCollection } from 'utils/collections/index';
|
|
|
|
const getTreePathFromCollectionToItem = (collection, _item) => {
|
|
let path = [];
|
|
let item = findItemInCollection(collection, _item?.uid);
|
|
while (item) {
|
|
path.unshift(item);
|
|
item = findParentItemInCollection(collection, item?.uid);
|
|
}
|
|
return path;
|
|
};
|
|
|
|
const Auth = ({ item, collection }) => {
|
|
const dispatch = useDispatch();
|
|
const authMode = item.draft ? get(item, 'draft.request.auth.mode') : get(item, 'request.auth.mode');
|
|
const requestTreePath = getTreePathFromCollectionToItem(collection, item);
|
|
|
|
// Create a request object to pass to the auth components
|
|
const request = item.draft
|
|
? get(item, 'draft.request', {})
|
|
: get(item, 'request', {});
|
|
|
|
// Save function for request level
|
|
const save = () => {
|
|
return dispatch(saveRequest(item.uid, collection.uid));
|
|
};
|
|
|
|
const getEffectiveAuthSource = () => {
|
|
if (authMode !== 'inherit') return null;
|
|
|
|
const collectionRoot = collection?.draft?.root || collection?.root || {};
|
|
const collectionAuth = get(collectionRoot, 'request.auth');
|
|
let effectiveSource = {
|
|
type: 'collection',
|
|
name: 'Collection',
|
|
auth: collectionAuth
|
|
};
|
|
|
|
// Check folders in reverse to find the closest auth configuration
|
|
for (let i of [...requestTreePath].reverse()) {
|
|
if (i.type === 'folder') {
|
|
const folderAuth = get(i, 'root.request.auth');
|
|
if (folderAuth && folderAuth.mode && folderAuth.mode !== 'inherit') {
|
|
effectiveSource = {
|
|
type: 'folder',
|
|
name: i.name,
|
|
auth: folderAuth
|
|
};
|
|
break;
|
|
}
|
|
}
|
|
}
|
|
|
|
return effectiveSource;
|
|
};
|
|
|
|
const getAuthView = () => {
|
|
switch (authMode) {
|
|
case 'none': {
|
|
return <div className="mt-2">No Auth</div>;
|
|
}
|
|
case 'awsv4': {
|
|
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} />;
|
|
}
|
|
case 'bearer': {
|
|
return <BearerAuth collection={collection} item={item} request={request} save={save} updateAuth={updateAuth} />;
|
|
}
|
|
case 'digest': {
|
|
return <DigestAuth collection={collection} item={item} request={request} save={save} updateAuth={updateAuth} />;
|
|
}
|
|
case 'ntlm': {
|
|
return <NTLMAuth collection={collection} item={item} request={request} save={save} updateAuth={updateAuth} />;
|
|
}
|
|
case 'oauth2': {
|
|
return <OAuth2 collection={collection} item={item} request={request} save={save} updateAuth={updateAuth} />;
|
|
}
|
|
case 'wsse': {
|
|
return <WsseAuth collection={collection} item={item} request={request} save={save} updateAuth={updateAuth} />;
|
|
}
|
|
case 'apikey': {
|
|
return <ApiKeyAuth collection={collection} item={item} request={request} save={save} updateAuth={updateAuth} />;
|
|
}
|
|
case 'inherit': {
|
|
const source = getEffectiveAuthSource();
|
|
return (
|
|
<>
|
|
<div className="flex flex-row w-full mt-2 gap-2">
|
|
<div>Auth inherited from {source.name}: </div>
|
|
<div className="inherit-mode-text">{humanizeRequestAuthMode(source.auth?.mode)}</div>
|
|
</div>
|
|
</>
|
|
);
|
|
}
|
|
}
|
|
};
|
|
|
|
return (
|
|
<StyledWrapper className="w-full mt-1 overflow-auto">
|
|
{getAuthView()}
|
|
</StyledWrapper>
|
|
);
|
|
};
|
|
|
|
export default Auth;
|