diff --git a/client/src/components/Nav/Favorites/FavoritesList.tsx b/client/src/components/Nav/Favorites/FavoritesList.tsx
index 32fe680dbc..d9d33ec6ce 100644
--- a/client/src/components/Nav/Favorites/FavoritesList.tsx
+++ b/client/src/components/Nav/Favorites/FavoritesList.tsx
@@ -141,7 +141,10 @@ export default function FavoritesList({
}
}, [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({
queries: agentIds.map((agentId) => ({
@@ -192,7 +195,7 @@ export default function FavoritesList({
return map;
}, [agentQueries, queryClient]);
- const draggedFavoritesRef = useRef(favorites);
+ const draggedFavoritesRef = useRef(safeFavorites);
const moveItem = useCallback(
(dragIndex: number, hoverIndex: number) => {
@@ -212,14 +215,14 @@ export default function FavoritesList({
// Keep ref in sync when favorites change from external sources
useEffect(() => {
- draggedFavoritesRef.current = favorites;
- }, [favorites]);
+ draggedFavoritesRef.current = safeFavorites;
+ }, [safeFavorites]);
if (search.query) {
return null;
}
- if (!isFavoritesLoading && favorites.length === 0 && !showAgentMarketplace) {
+ if (!isFavoritesLoading && safeFavorites.length === 0 && !showAgentMarketplace) {
return null;
}
@@ -243,7 +246,7 @@ export default function FavoritesList({
{/* Marketplace skeleton */}
{showAgentMarketplace && }
{/* Favorite items skeletons */}
- {favorites.map((_, index) => (
+ {safeFavorites.map((_, index) => (
))}
>
@@ -264,7 +267,7 @@ export default function FavoritesList({
)}
- {favorites.map((fav, index) => {
+ {safeFavorites.map((fav, index) => {
if (fav.agentId) {
const agent = agentsMap[fav.agentId];
if (!agent) {
diff --git a/client/src/hooks/useFavorites.ts b/client/src/hooks/useFavorites.ts
index 18ee25f429..c32570f783 100644
--- a/client/src/hooks/useFavorites.ts
+++ b/client/src/hooks/useFavorites.ts
@@ -22,8 +22,11 @@ import { logger } from '~/utils';
/**
* Cleans favorites array to only include canonical shapes (agentId or model+endpoint).
*/
-const cleanFavorites = (favorites: Favorite[]): Favorite[] =>
- favorites.map((f) => {
+const cleanFavorites = (favorites: Favorite[]): Favorite[] => {
+ if (!Array.isArray(favorites)) {
+ return [];
+ }
+ return favorites.map((f) => {
if (f.agentId) {
return { agentId: f.agentId };
}
@@ -32,6 +35,7 @@ const cleanFavorites = (favorites: Favorite[]): Favorite[] =>
}
return f;
});
+};
export default function useFavorites() {
const localize = useLocalize();