mirror of
https://github.com/usebruno/bruno.git
synced 2026-07-07 14:08:38 +00:00
30d2a6d141
* 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
88 lines
2.3 KiB
JavaScript
88 lines
2.3 KiB
JavaScript
import React, { useMemo, useCallback } from 'react';
|
|
import get from 'lodash/get';
|
|
import { IconCaretDown } from '@tabler/icons';
|
|
import MenuDropdown from 'ui/MenuDropdown';
|
|
import { useDispatch } from 'react-redux';
|
|
import { updateCollectionAuthMode } from 'providers/ReduxStore/slices/collections';
|
|
import { humanizeRequestAuthMode } from 'utils/collections';
|
|
import StyledWrapper from './StyledWrapper';
|
|
|
|
const AuthMode = ({ collection }) => {
|
|
const dispatch = useDispatch();
|
|
const authMode = collection.draft?.root ? get(collection, 'draft.root.request.auth.mode') : get(collection, 'root.request.auth.mode');
|
|
|
|
const onModeChange = useCallback((value) => {
|
|
dispatch(
|
|
updateCollectionAuthMode({
|
|
collectionUid: collection.uid,
|
|
mode: value
|
|
})
|
|
);
|
|
}, [dispatch, collection.uid]);
|
|
|
|
const menuItems = useMemo(() => [
|
|
{
|
|
id: 'awsv4',
|
|
label: 'AWS Sig v4',
|
|
onClick: () => onModeChange('awsv4')
|
|
},
|
|
{
|
|
id: 'basic',
|
|
label: 'Basic Auth',
|
|
onClick: () => onModeChange('basic')
|
|
},
|
|
{
|
|
id: 'wsse',
|
|
label: 'WSSE Auth',
|
|
onClick: () => onModeChange('wsse')
|
|
},
|
|
{
|
|
id: 'bearer',
|
|
label: 'Bearer Token',
|
|
onClick: () => onModeChange('bearer')
|
|
},
|
|
{
|
|
id: 'digest',
|
|
label: 'Digest Auth',
|
|
onClick: () => onModeChange('digest')
|
|
},
|
|
{
|
|
id: 'ntlm',
|
|
label: 'NTLM Auth',
|
|
onClick: () => onModeChange('ntlm')
|
|
},
|
|
{
|
|
id: 'oauth2',
|
|
label: 'OAuth 2.0',
|
|
onClick: () => onModeChange('oauth2')
|
|
},
|
|
{
|
|
id: 'apikey',
|
|
label: 'API Key',
|
|
onClick: () => onModeChange('apikey')
|
|
},
|
|
{
|
|
id: 'none',
|
|
label: 'No Auth',
|
|
onClick: () => onModeChange('none')
|
|
}
|
|
], [onModeChange]);
|
|
|
|
return (
|
|
<StyledWrapper>
|
|
<div className="inline-flex items-center cursor-pointer auth-mode-selector">
|
|
<MenuDropdown
|
|
items={menuItems}
|
|
placement="bottom-end"
|
|
selectedItemId={authMode}
|
|
>
|
|
<div className="flex items-center justify-center auth-mode-label select-none">
|
|
{humanizeRequestAuthMode(authMode)} <IconCaretDown className="caret ml-1" size={14} strokeWidth={2} />
|
|
</div>
|
|
</MenuDropdown>
|
|
</div>
|
|
</StyledWrapper>
|
|
);
|
|
};
|
|
export default AuthMode;
|