Make favorites version-aware - verses only appear favorited in the version they were saved in

- Updated loadFavorites to filter favorites by version: only show favorites for current version
- Modified removeFavorite to match version when deleting specific favorites
- Added version to useEffect dependencies so favorites refresh when version changes
- Backend already supports version-specific favorites via database schema

Now users can favorite Genesis 1:1 in both ESV and NKJV independently - switching versions shows correct favorited states.
This commit is contained in:
Ryderjj89
2025-09-28 13:50:57 -04:00
parent e21bc59463
commit 213c8394c3

View File

@@ -48,30 +48,30 @@ const BibleReader: React.FC<BibleReaderProps> = ({ book, chapter, onBack, format
} }
}, [loading, content]); }, [loading, content]);
// Load favorites when user is available // Load favorites when user is available and reload when version changes
useEffect(() => { useEffect(() => {
if (user) { if (user) {
loadFavorites(); loadFavorites();
} }
}, [user, book, chapter]); }, [user, book, chapter, version]);
const loadFavorites = async () => { const loadFavorites = async () => {
if (!user) return; if (!user) return;
try { try {
const response = await fetch('/api/favorites', { const response = await fetch('/api/favorites', {
credentials: 'include' credentials: 'include'
}); });
if (response.ok) { if (response.ok) {
const data = await response.json(); const data = await response.json();
const favoriteStrings: string[] = data.favorites const favoriteStrings: string[] = data.favorites
.filter((fav: any) => fav.book === book && fav.chapter === chapter && fav.verse_start) // Only verse-level favorites for this chapter .filter((fav: any) => fav.book === book && fav.chapter === chapter && fav.verse_start && fav.version === version) // Only verse-level favorites for this chapter and version
.map((fav: any) => fav.verse_end ? `${fav.verse_start}-${fav.verse_end}` : fav.verse_start.toString()); .map((fav: any) => fav.verse_end ? `${fav.verse_start}-${fav.verse_end}` : fav.verse_start.toString());
const verseFavorites = new Set<string>(favoriteStrings); const verseFavorites = new Set<string>(favoriteStrings);
setFavorites(verseFavorites); setFavorites(verseFavorites);
console.log('Loaded verse favorites:', favoriteStrings); console.log('Loaded verse favorites for version:', version, favoriteStrings);
} }
} catch (error) { } catch (error) {
console.error('Failed to load favorites:', error); console.error('Failed to load favorites:', error);
@@ -92,10 +92,11 @@ const BibleReader: React.FC<BibleReaderProps> = ({ book, chapter, onBack, format
if (response.ok) { if (response.ok) {
const data = await response.json(); const data = await response.json();
const verseFavorite = data.favorites.find((fav: any) => const verseFavorite = data.favorites.find((fav: any) =>
fav.book === book && fav.book === book &&
fav.chapter === chapter && fav.chapter === chapter &&
fav.verse_start === parseInt(verseNumber) fav.verse_start === parseInt(verseNumber) &&
fav.version === version
); );
if (verseFavorite) { if (verseFavorite) {