Andreas/LibreChat
1
0
Fork 0
mirror of https://github.com/danny-avila/LibreChat.git synced 2025-12-19 01:40:15 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions 4

✨ feat: Anthropic Agents Prompt Caching & UI Accessibility Enhancements (#6045)

Browse source 
* chore: remove auto-focus for now

* refactor: move react-hook-form Controller Logic to AgentSelect from AgentPanel

* fix: a11y focus issue with AgentSelect by never replacing it in its component tree

* fix: maintain ComboBox focus and force re-render on agent ID change in AgentPanel

* chore: `gemini-2.0-flash-lite-preview-02-05` (deprecated)

* refactor: extract cache control logic and headers configuration to helper functions in AnthropicClient

* feat: anthropic agents prompt caching

* chore: bump @librechat/agents and related dependencies

* fix: typo
This commit is contained in:
Danny Avila 2025-02-25 22:14:58 -05:00 • committed by GitHub
parent d3d7d11ea8
commit e14df5956a
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
12 changed files with 4460 additions and 1477 deletions
Download patch file Download diff file Expand all files Collapse all files

36
client/src/components/SidePanel/Agents/AgentPanel.tsx
View file

@ -1,7 +1,7 @@
import { Plus } from 'lucide-react';
import React, { useMemo, useCallback } from 'react';
import { useWatch, useForm, FormProvider } from 'react-hook-form';
import { useGetModelsQuery } from 'librechat-data-provider/react-query';
import { Controller, useWatch, useForm, FormProvider } from 'react-hook-form';
import {
Tools,
SystemRoles,
@ -201,10 +201,6 @@ export default function AgentPanel({
user?.role,
]);
if (agentQuery.isInitialLoading) {
return <AgentPanelSkeleton />;
}
return (
<FormProvider {...methods}>
<form
@ -214,19 +210,13 @@ export default function AgentPanel({
>
<div className="mx-1 mt-2 flex w-full flex-wrap gap-2">
<div className="w-full">
<Controller
name="agent"
control={control}
render={({ field }) => (
<AgentSelect
reset={reset}
value={field.value}
agentQuery={agentQuery}
setCurrentAgentId={setCurrentAgentId}
selectedAgentId={current_agent_id ?? null}
createMutation={create}
/>
)}
<AgentSelect
createMutation={create}
agentQuery={agentQuery}
setCurrentAgentId={setCurrentAgentId}
// The following is required to force re-render the component when the form's agent ID changes
// Also maintains ComboBox Focus for Accessibility
selectedAgentId={agentQuery.isInitialLoading ? null : (current_agent_id ?? null)}
/>
</div>
{/* Create + Select Button */}
@ -240,6 +230,7 @@ export default function AgentPanel({
reset(defaultAgentFormValues);
setCurrentAgentId(undefined);
}}
disabled={agentQuery.isInitialLoading}
>
<Plus className="mr-1 h-4 w-4" />
{localize('com_ui_create') +
@ -250,7 +241,7 @@ export default function AgentPanel({
</Button>
<Button
variant="submit"
disabled={!agent_id}
disabled={!agent_id || agentQuery.isInitialLoading}
onClick={(e) => {
e.preventDefault();
handleSelectAgent();
@ -262,7 +253,8 @@ export default function AgentPanel({
</div>
)}
</div>
{!canEditAgent && (
{agentQuery.isInitialLoading && <AgentPanelSkeleton />}
{!canEditAgent && !agentQuery.isInitialLoading && (
<div className="flex h-[30vh] w-full items-center justify-center">
<div className="text-center">
<h2 className="text-token-text-primary m-2 text-xl font-semibold">
@ -272,7 +264,7 @@ export default function AgentPanel({
</div>
</div>
)}
{canEditAgent && activePanel === Panel.model && (
{canEditAgent && !agentQuery.isInitialLoading && activePanel === Panel.model && (
<ModelPanel
setActivePanel={setActivePanel}
agent_id={agent_id}
@ -280,7 +272,7 @@ export default function AgentPanel({
models={models}
/>
)}
{canEditAgent && activePanel === Panel.builder && (
{canEditAgent && !agentQuery.isInitialLoading && activePanel === Panel.builder && (
<AgentConfig
actions={actions}
setAction={setAction}