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

🔧 refactor: Organize Sharing/Agent Components and Improve Type Safety

Browse source 
refactor: organize Sharing/Agent components, improve type safety for resource types and access role ids, rename enums to PascalCase

refactor: organize Sharing/Agent components, improve type safety for resource types and access role ids

chore: move sharing related components to dedicated "Sharing" directory

chore: remove PublicSharingToggle component and update index exports

chore: move non-sidepanel agent components to `~/components/Agents`

chore: move AgentCategoryDisplay component with tests

chore: remove commented out code

refactor: change PERMISSION_BITS from const to enum for better type safety

refactor: reorganize imports in GenericGrantAccessDialog and update index exports for hooks

refactor: update type definitions to use ACCESS_ROLE_IDS for improved type safety

refactor: remove unused canAccessPromptResource middleware and related code

refactor: remove unused prompt access roles from createAccessRoleMethods

refactor: update resourceType in AclEntry type definition to remove unused 'prompt' value

refactor: introduce ResourceType enum and update resourceType usage across data provider files for improved type safety

refactor: update resourceType usage to ResourceType enum across sharing and permissions components for improved type safety

refactor: standardize resourceType usage to ResourceType enum across agent and prompt models, permissions controller, and middleware for enhanced type safety

refactor: update resourceType references from PROMPT_GROUP to PROMPTGROUP for consistency across models, middleware, and components

refactor: standardize access role IDs and resource type usage across agent, file, and prompt models for improved type safety and consistency

chore: add typedefs for TUpdateResourcePermissionsRequest and TUpdateResourcePermissionsResponse to enhance type definitions

chore: move SearchPicker to PeoplePicker dir

refactor: implement debouncing for query changes in SearchPicker for improved performance

chore: fix typing, import order for agent admin settings

fix: agent admin settings, prevent agent form submission

refactor: rename `ACCESS_ROLE_IDS` to `AccessRoleIds`

refactor: replace PermissionBits with PERMISSION_BITS

refactor: replace PERMISSION_BITS with PermissionBits
This commit is contained in:
Danny Avila 2025-07-28 17:52:36 -04:00
parent 1c151bbfe8
commit 4d5330be14
No known key found for this signature in database
GPG key ID: BF31EEB2C5CA0956
96 changed files with 781 additions and 798 deletions
Download patch file Download diff file Expand all files Collapse all files

109
client/src/components/SidePanel/Agents/SearchBar.tsx
View file

@ -1,109 +0,0 @@
import React, { useState, useEffect, useCallback } from 'react';
import { Search, X } from 'lucide-react';
import { Input } from '@librechat/client';
import { useDebounce, useLocalize } from '~/hooks';
/**
* Props for the SearchBar component
*/
interface SearchBarProps {
/** Current search query value */
value: string;
/** Callback fired when the search query changes */
onSearch: (query: string) => void;
/** Additional CSS classes */
className?: string;
}
/**
* SearchBar - Component for searching agents with debounced input
*
* Provides a search input with clear button and debounced search functionality.
* Includes proper ARIA attributes for accessibility and visual indicators.
* Uses 300ms debounce delay to prevent excessive API calls during typing.
*/
const SearchBar: React.FC<SearchBarProps> = ({ value, onSearch, className = '' }) => {
const localize = useLocalize();
const [searchTerm, setSearchTerm] = useState(value);
// Debounced search value (300ms delay)
const debouncedSearchTerm = useDebounce(searchTerm, 300);
// Update internal state when props change
useEffect(() => {
setSearchTerm(value);
}, [value]);
// Trigger search when debounced value changes
useEffect(() => {
// Only trigger search if the debounced value matches current searchTerm
// This prevents stale debounced values from triggering after clear
if (debouncedSearchTerm !== value && debouncedSearchTerm === searchTerm) {
onSearch(debouncedSearchTerm);
}
}, [debouncedSearchTerm, onSearch, value, searchTerm]);
/**
* Handle search input changes
*
* @param e - Input change event
*/
const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {
setSearchTerm(e.target.value);
};
/**
* Clear the search input and reset results
*/
const handleClear = useCallback(() => {
// Immediately call parent onSearch to clear the URL parameter
onSearch('');
// Also clear local state
setSearchTerm('');
}, [onSearch]);
return (
<div className={`relative w-full max-w-4xl ${className}`} role="search">
<label htmlFor="agent-search" className="sr-only">
{localize('com_agents_search_instructions')}
</label>
<Input
id="agent-search"
type="text"
value={searchTerm}
onChange={handleChange}
placeholder={localize('com_agents_search_placeholder')}
className="h-14 rounded-2xl border-2 border-border-medium bg-transparent pl-12 pr-12 text-lg text-text-primary shadow-lg placeholder:text-text-tertiary focus:border-border-heavy focus:ring-0"
aria-label={localize('com_agents_search_aria')}
aria-describedby="search-instructions search-results-count"
autoComplete="off"
spellCheck="false"
/>
{/* Search icon with proper accessibility */}
<div className="absolute inset-y-0 left-0 flex items-center pl-4" aria-hidden="true">
<Search className="h-6 w-6 text-text-tertiary" />
</div>
{/* Hidden instructions for screen readers */}
<div id="search-instructions" className="sr-only">
{localize('com_agents_search_instructions')}
</div>
{/* Show clear button only when search has value - Google style */}
{searchTerm && (
<button
type="button"
onClick={handleClear}
className="group absolute right-3 top-1/2 flex h-6 w-6 -translate-y-1/2 items-center justify-center rounded-full bg-text-tertiary transition-colors duration-150 hover:bg-text-secondary focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2"
aria-label={localize('com_agents_clear_search')}
title={localize('com_agents_clear_search')}
>
<X className="h-3 w-3 text-white group-hover:text-white" strokeWidth={2.5} />
</button>
)}
</div>
);
};
export default SearchBar;