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

👐 fix: Return Focus to MCP Edit Button after Dialog Closes
Some checks failed
Docker Dev Branch Images Build / build (Dockerfile, lc-dev, node) (push) Waiting to run
Details
Docker Dev Branch Images Build / build (Dockerfile.multi, lc-dev-api, api-build) (push) Waiting to run
Details
Docker Dev Images Build / build (Dockerfile, librechat-dev, node) (push) Waiting to run
Details
Docker Dev Images Build / build (Dockerfile.multi, librechat-dev-api, api-build) (push) Waiting to run
Details
Sync Locize Translations & Create Translation PR / Sync Translation Keys with Locize (push) Waiting to run
Details
Sync Locize Translations & Create Translation PR / Create Translation PR on Version Published (push) Blocked by required conditions
Details
Publish `@librechat/client` to NPM / build-and-publish (push) Has been cancelled
Details

Browse source 
- Added `editButtonRef` prop to `MCPCardActions` for improved focus management.
- Updated `MCPServerCard` to pass a reference to the edit button, enhancing accessibility.
- Modified `MCPServerDialog` to accept a more flexible `triggerRef` type, allowing for better integration with various button elements.
This commit is contained in:
Danny Avila 2025-12-28 12:43:17 -05:00
parent e4870ed0b0
commit d0835d5222
No known key found for this signature in database
GPG key ID: BF31EEB2C5CA0956
3 changed files with 10 additions and 9 deletions
Download patch file Download diff file Expand all files Collapse all files

10
client/src/components/SidePanel/MCPBuilder/MCPServerCard.tsx
View file

@ -29,9 +29,9 @@ export default function MCPServerCard({
canCreateEditMCPs,
}: MCPServerCardProps) {
const localize = useLocalize();
const triggerRef = useRef<HTMLDivElement>(null);
const { initializeServer } = useMCPServerManager();
const [dialogOpen, setDialogOpen] = useState(false);
const triggerRef = useRef<HTMLButtonElement>(null);
const statusIconProps = getServerStatusIconProps(server.serverName);
const {
@ -125,6 +125,7 @@ export default function MCPServerCard({
canCancel={canCancel}
hasCustomUserVars={hasCustomUserVars}
canEdit={canEdit}
editButtonRef={triggerRef}
onEditClick={handleEditClick}
onConfigClick={onConfigClick}
onInitialize={handleInitialize}
@ -140,12 +141,7 @@ export default function MCPServerCard({
onOpenChange={setDialogOpen}
triggerRef={triggerRef}
server={server}
>
{/* Hidden trigger for focus management */}
<button ref={triggerRef} className="sr-only" tabIndex={-1} aria-hidden="true">
{localize('com_ui_edit')} {displayName}
</button>
</MCPServerDialog>
/>
)}
</>
);