Andreas/LibreChat
1
0
Fork 0
mirror of https://github.com/danny-avila/LibreChat.git synced 2026-02-07 10:11:49 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions 3

🔖 fix: Announce Bookmark Selection State (#11450)

Browse source 
* fix: bookmarks announce selection state

* chore: address Copilot comments
This commit is contained in:
Dustin Healy 2026-01-21 10:49:50 -08:00 • committed by GitHub
parent 828c2b2048
commit 12ec64b988
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
6 changed files with 40 additions and 12 deletions
Download patch file Download diff file Expand all files Collapse all files

33
client/src/components/Chat/Menus/BookmarkMenu.tsx
View file

@ -99,6 +99,16 @@ const BookmarkMenu: FC = () => {
const newBookmarkRef = useRef<HTMLButtonElement>(null);
const tagsCount = tags?.length ?? 0;
const hasBookmarks = tagsCount > 0;
const buttonAriaLabel = useMemo(() => {
if (tagsCount > 0) {
return localize('com_ui_bookmarks_count_selected', { count: tagsCount });
}
return localize('com_ui_bookmarks_add');
}, [tagsCount, localize]);
const dropdownItems: t.MenuItemProps[] = useMemo(() => {
const items: t.MenuItemProps[] = [
{
@ -114,19 +124,19 @@ const BookmarkMenu: FC = () => {
if (data) {
for (const tag of data) {
const isSelected = tags?.includes(tag.tag);
const isSelected = tags?.includes(tag.tag) === true;
items.push({
id: tag.tag,
label: tag.tag,
hideOnClick: false,
icon:
isSelected === true ? (
<BookmarkFilledIcon className="size-4" />
) : (
<BookmarkIcon className="size-4" />
),
icon: isSelected ? (
<BookmarkFilledIcon className="size-4" />
) : (
<BookmarkIcon className="size-4" />
),
onClick: () => handleSubmit(tag.tag),
disabled: mutation.isLoading,
ariaChecked: isSelected,
});
}
}
@ -146,10 +156,10 @@ const BookmarkMenu: FC = () => {
if (mutation.isLoading) {
return <Spinner aria-label="Spinner" />;
}
if ((tags?.length ?? 0) > 0) {
return <BookmarkFilledIcon className="icon-lg" aria-label="Filled Bookmark" />;
if (hasBookmarks) {
return <BookmarkFilledIcon className="icon-lg" aria-hidden="true" />;
}
return <BookmarkIcon className="icon-lg" aria-label="Bookmark" />;
return <BookmarkIcon className="icon-lg" aria-hidden="true" />;
};
return (
@ -168,7 +178,8 @@ const BookmarkMenu: FC = () => {
render={
<Ariakit.MenuButton
id="bookmark-menu-button"
aria-label={localize('com_ui_bookmarks_add')}
aria-label={buttonAriaLabel}
aria-pressed={hasBookmarks}
className={cn(
'mt-text-sm flex size-10 flex-shrink-0 items-center justify-center gap-2 rounded-xl border border-border-light bg-presentation text-sm transition-colors duration-200 hover:bg-surface-hover',
isMenuOpen ? 'bg-surface-hover' : '',