fix: Ensure favorites are always an array and update references in FavoritesList

This commit is contained in:
Marco Beretta 2025-12-02 23:27:31 +01:00
parent 99b69c5b81
commit 83127a4ea5
No known key found for this signature in database
GPG key ID: D918033D8E74CC11
2 changed files with 16 additions and 9 deletions

View file

@ -141,7 +141,10 @@ export default function FavoritesList({
} }
}, [navigate, isSmallScreen, toggleNav]); }, [navigate, isSmallScreen, toggleNav]);
const agentIds = favorites.map((f) => f.agentId).filter(Boolean) as string[]; // Ensure favorites is always an array (could be corrupted in localStorage)
const safeFavorites = useMemo(() => (Array.isArray(favorites) ? favorites : []), [favorites]);
const agentIds = safeFavorites.map((f) => f.agentId).filter(Boolean) as string[];
const agentQueries = useQueries({ const agentQueries = useQueries({
queries: agentIds.map((agentId) => ({ queries: agentIds.map((agentId) => ({
@ -192,7 +195,7 @@ export default function FavoritesList({
return map; return map;
}, [agentQueries, queryClient]); }, [agentQueries, queryClient]);
const draggedFavoritesRef = useRef(favorites); const draggedFavoritesRef = useRef(safeFavorites);
const moveItem = useCallback( const moveItem = useCallback(
(dragIndex: number, hoverIndex: number) => { (dragIndex: number, hoverIndex: number) => {
@ -212,14 +215,14 @@ export default function FavoritesList({
// Keep ref in sync when favorites change from external sources // Keep ref in sync when favorites change from external sources
useEffect(() => { useEffect(() => {
draggedFavoritesRef.current = favorites; draggedFavoritesRef.current = safeFavorites;
}, [favorites]); }, [safeFavorites]);
if (search.query) { if (search.query) {
return null; return null;
} }
if (!isFavoritesLoading && favorites.length === 0 && !showAgentMarketplace) { if (!isFavoritesLoading && safeFavorites.length === 0 && !showAgentMarketplace) {
return null; return null;
} }
@ -243,7 +246,7 @@ export default function FavoritesList({
{/* Marketplace skeleton */} {/* Marketplace skeleton */}
{showAgentMarketplace && <MarketplaceSkeleton />} {showAgentMarketplace && <MarketplaceSkeleton />}
{/* Favorite items skeletons */} {/* Favorite items skeletons */}
{favorites.map((_, index) => ( {safeFavorites.map((_, index) => (
<FavoriteItemSkeleton key={`skeleton-${index}`} /> <FavoriteItemSkeleton key={`skeleton-${index}`} />
))} ))}
</> </>
@ -264,7 +267,7 @@ export default function FavoritesList({
</div> </div>
</div> </div>
)} )}
{favorites.map((fav, index) => { {safeFavorites.map((fav, index) => {
if (fav.agentId) { if (fav.agentId) {
const agent = agentsMap[fav.agentId]; const agent = agentsMap[fav.agentId];
if (!agent) { if (!agent) {

View file

@ -22,8 +22,11 @@ import { logger } from '~/utils';
/** /**
* Cleans favorites array to only include canonical shapes (agentId or model+endpoint). * Cleans favorites array to only include canonical shapes (agentId or model+endpoint).
*/ */
const cleanFavorites = (favorites: Favorite[]): Favorite[] => const cleanFavorites = (favorites: Favorite[]): Favorite[] => {
favorites.map((f) => { if (!Array.isArray(favorites)) {
return [];
}
return favorites.map((f) => {
if (f.agentId) { if (f.agentId) {
return { agentId: f.agentId }; return { agentId: f.agentId };
} }
@ -32,6 +35,7 @@ const cleanFavorites = (favorites: Favorite[]): Favorite[] =>
} }
return f; return f;
}); });
};
export default function useFavorites() { export default function useFavorites() {
const localize = useLocalize(); const localize = useLocalize();