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

👐 refactor: Agents Accessibility and Gemini Error Handling (#5972)

Browse source 
* style: Enhance ControlCombobox with Carat Display, ClassName, and Disabled State

* refactor(ModelPanel): replace SelectDropdown with ControlCombobox for improved accessibility

* style: Adjust padding and positioning in ModelPanel for improved layout

* style(ControlCombobox): add containerClassName and iconSide props for enhanced customization

* style(ControlCombobox): add iconClassName prop for customizable icon styling

* refactor(AgentPanel): enhance layout with new button for creating agents and adjust structure for better alignment

* refactor(AgentSelect): replace SelectDropDown with ControlCombobox for improved accessibility and layout

* feat(translation): add new translation key for improved UI clarity

* style(AgentSwitcher, AssistantSwitcher): add iconClassName prop for customizable icon styling

* refactor(AgentPanelSkeleton): improve layout of skeleton components to match new visual structure

* style(AgentPanel, AgentPanelSkeleton): add margin to flex container for improved layout consistency

* a11y(AgentSelect, ControlCombobox): add selectId prop for preventing focus going to start to page after agent selection

* fix(AgentSelect): update SELECT_ID constant for improved clarity in component identification

* fix(GoogleClient): update type annotation, add abort handling for content generation requests, catch "uncaught" abort errors and GoogleGenerativeAI errors from `@google/generative-ai`
This commit is contained in:
Danny Avila 2025-02-21 15:02:07 -05:00 • committed by GitHub
parent 1e625f7557
commit fc733d2b9e
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
10 changed files with 227 additions and 150 deletions
Download patch file Download diff file Expand all files Collapse all files

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

@ -1,3 +1,4 @@
import { Plus } from 'lucide-react';
import React, { useMemo, useCallback } from 'react';
import { useGetModelsQuery } from 'librechat-data-provider/react-query';
import { Controller, useWatch, useForm, FormProvider } from 'react-hook-form';
@ -211,34 +212,54 @@ export default function AgentPanel({
className="scrollbar-gutter-stable h-auto w-full flex-shrink-0 overflow-x-hidden"
aria-label="Agent configuration form"
>
<div className="mt-2 flex w-full flex-wrap gap-2">
<Controller
name="agent"
control={control}
render={({ field }) => (
<AgentSelect
reset={reset}
value={field.value}
agentQuery={agentQuery}
setCurrentAgentId={setCurrentAgentId}
selectedAgentId={current_agent_id ?? null}
createMutation={create}
/>
)}
/>
{/* Select Button */}
<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}
/>
)}
/>
</div>
{/* Create + Select Button */}
{agent_id && (
<Button
variant="submit"
disabled={!agent_id}
onClick={(e) => {
e.preventDefault();
handleSelectAgent();
}}
aria-label="Select agent"
>
{localize('com_ui_select')}
</Button>
<div className="flex w-full gap-2">
<Button
type="button"
variant="outline"
className="w-full justify-center"
onClick={() => {
reset(defaultAgentFormValues);
setCurrentAgentId(undefined);
}}
>
<Plus className="mr-1 h-4 w-4" />
{localize('com_ui_create') +
' ' +
localize('com_ui_new') +
' ' +
localize('com_ui_agent')}
</Button>
<Button
variant="submit"
disabled={!agent_id}
onClick={(e) => {
e.preventDefault();
handleSelectAgent();
}}
aria-label={localize('com_ui_select') + ' ' + localize('com_ui_agent')}
>
{localize('com_ui_select')}
</Button>
</div>
)}
</div>
{!canEditAgent && (