mirror of
https://github.com/danny-avila/LibreChat.git
synced 2025-12-18 01:10:14 +01:00
a5189052ec
* 🔧 refactor: Improve accessibility and styling in ChatGroupItem and FilterPrompts components * 🔧 fix: Add button type and keyboard accessibility to dropdown menu trigger in ChatGroupItem * 🔧 fix(757): Enhance accessibility by updating aria-labels and adding localization for prompt groups * 🔧 fix(618): Update version to 0.3.1 and enhance accessibility in InfoHoverCard component * 🔧 fix(618): Update aria-label in InfoHoverCard to use dynamic text prop for improved accessibility * 🔧 fix: Enhance accessibility by updating aria-labels and roles in Conversations components * 🔧 fix(620): Enhance accessibility by adding tabIndex to Tabs.Content components in ArtifactTabs, Settings, and Speech components * refactor: remove RevokeKeysButton component and update related components for accessibility - Deleted RevokeKeysButton component. - Updated SharedLinks and General components to use Label for accessibility. - Enhanced Personalization component with aria-labelledby and aria-describedby attributes. - Refactored ConversationModeSwitch to use ToggleSwitch for better state management. - Improved AutoSendTextSelector with local state management and accessibility attributes. - Replaced Switch components with ToggleSwitch in various Speech and TTS components for consistency. - Added aria-labelledby attributes to Dropdown components for better accessibility. - Updated translation.json to include new localization keys and improved existing ones. - Enhanced Slider component to support aria attributes for better accessibility. * 🔧 fix: Enhance user feedback for API key operations with success and error messages * 🔧 fix: Update aria-labels in Avatar component for improved localization and accessibility * 🔧 fix: Refactor handleFile and handleDrop functions for improved readability and maintainability
31 lines
1 KiB
TypeScript
31 lines
1 KiB
TypeScript
import React from 'react';
|
|
import { useRecoilState } from 'recoil';
|
|
import { Switch, Label, InfoHoverCard, ESide } from '@librechat/client';
|
|
import { useLocalize } from '~/hooks';
|
|
import store from '~/store';
|
|
|
|
export default function DisplayUsernameMessages() {
|
|
const localize = useLocalize();
|
|
const [UsernameDisplay, setUsernameDisplay] = useRecoilState(store.UsernameDisplay);
|
|
|
|
const handleCheckedChange = (checked: boolean) => {
|
|
setUsernameDisplay(checked);
|
|
};
|
|
|
|
return (
|
|
<div className="flex items-center justify-between">
|
|
<div className="flex items-center space-x-2">
|
|
<Label id="user-name-display-label">{localize('com_nav_user_name_display')}</Label>
|
|
<InfoHoverCard side={ESide.Bottom} text={localize('com_nav_info_user_name_display')} />
|
|
</div>
|
|
<Switch
|
|
id="UsernameDisplay"
|
|
checked={UsernameDisplay}
|
|
onCheckedChange={handleCheckedChange}
|
|
className="ml-4"
|
|
data-testid="UsernameDisplay"
|
|
aria-labelledby="user-name-display-label"
|
|
/>
|
|
</div>
|
|
);
|
|
}
|