mirror of
https://github.com/danny-avila/LibreChat.git
synced 2025-12-22 11:20:15 +01:00
🎨 feat: enhance Chat Input UI, File Mgmt. UI, Bookmarks a11y (#5112)
* 🎨 feat: improve file display and overflow handling in SidePanel components * 🎨 feat: enhance bookmarks management UI and improve accessibility features * 🎨 feat: enhance BookmarkTable and BookmarkTableRow components for improved layout and performance * 🎨 feat: enhance file display and interaction in FilesView and ImagePreview components * 🎨 feat: adjust minimum width for filename filter input in DataTable component * 🎨 feat: enhance file upload UI with improved layout and styling adjustments * 🎨 feat: add surface-hover-alt color and update FileContainer styling for improved UI * 🎨 feat: update ImagePreview component styling for improved visual consistency * 🎨 feat: add MaximizeChatSpace component and integrate chat space maximization feature * 🎨 feat: enhance DataTable component with transition effects and update Checkbox styling for improved accessibility * fix: enhance a11y for Bookmark buttons by adding space key support, ARIA labels, and correct html role for key presses * fix: return focus back to trigger for BookmarkEditDialog (Edit and new bookmark buttons) * refactor: ShareButton and ExportModal components children prop support; refactor DropdownPopup item handling * refactor: enhance ExportAndShareMenu and ShareButton components with improved props handling and accessibility features * refactor: add ref prop support to MenuItemProps and update ExportAndShareMenu and DropdownPopup components so focus correctly returns to menu item * refactor: enhance ConvoOptions and DeleteButton components with improved props handling and accessibility features * refactor: add triggerRef support to DeleteButton and update ConvoOptions for improved dialog handling * refactor: accessible bookmarks menu * refactor: improve styling and accessibility for bookmarks components * refactor: add focusLoop support to DropdownPopup and update BookmarkMenu with Tooltip * refactor: integrate TooltipAnchor into ExportAndShareMenu for enhanced accessibility --------- Co-authored-by: Danny Avila <danny@librechat.ai>
This commit is contained in:
parent
d9c59b08e6
commit
cb1921626e
50 changed files with 767 additions and 484 deletions
|
|
@ -2,11 +2,7 @@ import React, { useEffect } from 'react';
|
|||
import { QueryKeys } from 'librechat-data-provider';
|
||||
import { Controller, useForm } from 'react-hook-form';
|
||||
import { useQueryClient } from '@tanstack/react-query';
|
||||
import type {
|
||||
TConversation,
|
||||
TConversationTag,
|
||||
TConversationTagRequest,
|
||||
} from 'librechat-data-provider';
|
||||
import type { TConversationTag, TConversationTagRequest } from 'librechat-data-provider';
|
||||
import { Checkbox, Label, TextareaAutosize, Input } from '~/components';
|
||||
import { useBookmarkContext } from '~/Providers/BookmarkContext';
|
||||
import { useConversationTagMutation } from '~/data-provider';
|
||||
|
|
@ -17,7 +13,7 @@ import { cn, logger } from '~/utils';
|
|||
type TBookmarkFormProps = {
|
||||
tags?: string[];
|
||||
bookmark?: TConversationTag;
|
||||
conversation?: TConversation;
|
||||
conversationId?: string;
|
||||
formRef: React.RefObject<HTMLFormElement>;
|
||||
setOpen: React.Dispatch<React.SetStateAction<boolean>>;
|
||||
mutation: ReturnType<typeof useConversationTagMutation>;
|
||||
|
|
@ -26,7 +22,7 @@ const BookmarkForm = ({
|
|||
tags,
|
||||
bookmark,
|
||||
mutation,
|
||||
conversation,
|
||||
conversationId,
|
||||
setOpen,
|
||||
formRef,
|
||||
}: TBookmarkFormProps) => {
|
||||
|
|
@ -46,8 +42,8 @@ const BookmarkForm = ({
|
|||
defaultValues: {
|
||||
tag: bookmark?.tag ?? '',
|
||||
description: bookmark?.description ?? '',
|
||||
conversationId: conversation?.conversationId ?? '',
|
||||
addToConversation: conversation ? true : false,
|
||||
conversationId: conversationId ?? '',
|
||||
addToConversation: conversationId != null && conversationId ? true : false,
|
||||
},
|
||||
});
|
||||
|
||||
|
|
@ -142,7 +138,7 @@ const BookmarkForm = ({
|
|||
)}
|
||||
/>
|
||||
</div>
|
||||
{conversation && (
|
||||
{conversationId != null && conversationId && (
|
||||
<div className="mt-2 flex w-full items-center">
|
||||
<Controller
|
||||
name="addToConversation"
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue