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

feat: Introduce InfoHoverCard component and refactor enums for better organization

Browse source
This commit is contained in:
Marco Beretta 2025-08-06 01:47:29 +02:00
parent db0b071c8f
commit 0bd8b1d794
No known key found for this signature in database
GPG key ID: D918033D8E74CC11
8 changed files with 56 additions and 38 deletions
Download patch file Download diff file Expand all files Collapse all files

15
client/src/components/Agents/AgentGrid.tsx
View file

@ -108,24 +108,9 @@ const AgentGrid: React.FC<AgentGridProps> = ({ category, searchQuery, onSelectAg
}
};
/**
* Get the appropriate title for the agents grid based on current state
*/
const getGridTitle = () => {
if (searchQuery) {
return localize('com_agents_results_for', { query: searchQuery });
}
return getCategoryDisplayName(category);
};
// Loading skeleton component
const loadingSkeleton = (
<div className="space-y-6">
<div className="mb-4">
<div className="mb-2 h-6 w-48 animate-pulse rounded-md bg-surface-tertiary"></div>
<div className="h-4 w-64 animate-pulse rounded-md bg-surface-tertiary"></div>
</div>
<div className="grid grid-cols-1 gap-6 md:grid-cols-2">
{Array(6)
.fill(0)

19
client/src/components/Agents/Marketplace.tsx
View file

@ -1,4 +1,4 @@
import React, { useState, useEffect, useMemo, useRef } from 'react';
import React, { useState, useEffect, useMemo, useRef, useCallback } from 'react';
import { useRecoilState } from 'recoil';
import { useOutletContext } from 'react-router-dom';
import { useQueryClient } from '@tanstack/react-query';
@ -124,15 +124,18 @@ const AgentMarketplace: React.FC<AgentMarketplaceProps> = ({ className = '' }) =
*/
const orderedTabs = useMemo<string[]>(() => {
const dynamic = (categoriesQuery.data || []).map((c) => c.value);
// Ensure unique and stable order
const set = new Set<string>(['promoted', 'all', ...dynamic]);
// Ensure unique and stable order - 'all' should be last to match server response
const set = new Set<string>(['promoted', ...dynamic, 'all']);
return Array.from(set);
}, [categoriesQuery.data]);
const getTabIndex = (tab: string): number => {
const idx = orderedTabs.indexOf(tab);
return idx >= 0 ? idx : 0;
};
const getTabIndex = useCallback(
(tab: string): number => {
const idx = orderedTabs.indexOf(tab);
return idx >= 0 ? idx : 0;
},
[orderedTabs],
);
/**
* Handle category tab selection changes with directional animation
@ -199,7 +202,7 @@ const AgentMarketplace: React.FC<AgentMarketplaceProps> = ({ className = '' }) =
return () => {
window.clearTimeout(timeoutId);
};
}, [activeTab, displayCategory, isTransitioning, orderedTabs]);
}, [activeTab, displayCategory, isTransitioning, getTabIndex]);
// No longer needed with keyframes