Complete favorites separation by version and dynamic page titles

- BookSelector now filters favorites by version (fav.version === version)
- Book favorites include version in API requests
- Page header shows 'NKJV Bible' or 'ESV Bible' dynamically
- BookSelector receives current version from App.tsx
- Favorites are now strictly version-specific across all levels
- Both book and verse favorites work correctly per translation

Navigation and favorites now respect Bible version context!
This commit is contained in:
Ryderjj89
2025-09-28 15:24:54 -04:00
parent 1b4eeefce7
commit eeb30c24e8
2 changed files with 13 additions and 10 deletions

View File

@@ -290,6 +290,7 @@ function App() {
formatBookName={formatBookName}
user={user}
onFavoriteChange={handleFavoriteChange}
version={versionId}
/>
);
};

View File

@@ -7,9 +7,10 @@ interface BookSelectorProps {
formatBookName: (bookName: string) => string;
user?: any;
onFavoriteChange?: () => void;
version?: string;
}
const BookSelector: React.FC<BookSelectorProps> = ({ books, onBookSelect, formatBookName, user, onFavoriteChange }) => {
const BookSelector: React.FC<BookSelectorProps> = ({ books, onBookSelect, formatBookName, user, onFavoriteChange, version = 'esv' }) => {
const [favorites, setFavorites] = useState<Set<string>>(new Set());
const [loading, setLoading] = useState(false);
@@ -22,31 +23,31 @@ const BookSelector: React.FC<BookSelectorProps> = ({ books, onBookSelect, format
}
}, [user]);
// Also reload favorites when books change (page refresh)
// Also reload favorites when books or version change (page refresh/version switch)
useEffect(() => {
if (user && books.length > 0) {
loadFavorites();
}
}, [books, user]);
}, [books, user, version]);
const loadFavorites = async () => {
if (!user) return;
setLoading(true);
try {
const response = await fetch('/api/favorites', {
credentials: 'include'
});
if (response.ok) {
const data = await response.json();
const favoriteBooks: string[] = data.favorites
.filter((fav: any) => !fav.chapter) // Only book-level favorites
.filter((fav: any) => !fav.chapter && fav.version === version) // Only book-level favorites for current version
.map((fav: any) => fav.book);
const bookFavorites = new Set<string>(favoriteBooks);
setFavorites(bookFavorites);
console.log('Loaded book favorites:', favoriteBooks);
console.log('Loaded book favorites for version:', version, favoriteBooks);
}
} catch (error) {
console.error('Failed to load favorites:', error);
@@ -99,7 +100,8 @@ const BookSelector: React.FC<BookSelectorProps> = ({ books, onBookSelect, format
},
credentials: 'include',
body: JSON.stringify({
book: book
book: book,
version: version
})
});
@@ -164,7 +166,7 @@ const BookSelector: React.FC<BookSelectorProps> = ({ books, onBookSelect, format
<div className="space-y-12">
<div className="text-center">
<h1 className="text-4xl font-bold text-gray-900 dark:text-gray-100 mb-4">
ESV Bible
{version.toUpperCase()} Bible
</h1>
<p className="text-lg text-gray-600 dark:text-gray-400">
Select a book to begin reading