diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx index 9f79e651..15410b9e 100644 --- a/frontend/src/App.tsx +++ b/frontend/src/App.tsx @@ -1,6 +1,6 @@ import React, { useState, useEffect } from 'react'; import { Routes, Route, useNavigate, useParams, useLocation } from 'react-router-dom'; -import { Book, ChevronRight, Moon, Sun } from 'lucide-react'; +import { Book, ChevronRight, Moon, Sun, LogOut } from 'lucide-react'; import BookSelector from './components/BookSelector'; import ChapterSelector from './components/ChapterSelector'; import BibleReader from './components/BibleReader'; @@ -220,12 +220,18 @@ function App() { navigate(`/book/${urlName}`); }; + const handleFavoriteChange = () => { + // This will trigger a re-render of the FavoritesMenu + setUser((prev: any) => ({ ...prev })); + }; + return ( ); }; @@ -243,6 +249,11 @@ function App() { navigate('/'); }; + const handleFavoriteChange = () => { + // This will trigger a re-render of the FavoritesMenu + setUser((prev: any) => ({ ...prev })); + }; + if (!bookName || !actualBookName || !books.includes(actualBookName)) { return
Book not found
; } @@ -254,6 +265,7 @@ function App() { onBack={handleBack} formatBookName={formatBookName} user={user} + onFavoriteChange={handleFavoriteChange} /> ); }; @@ -389,7 +401,7 @@ function App() { className="text-sm px-3 py-1 bg-gray-200 dark:bg-gray-700 text-gray-700 dark:text-gray-300 rounded hover:bg-gray-300 dark:hover:bg-gray-600 transition-colors" > Logout - + ) : ( diff --git a/frontend/src/components/BookSelector.tsx b/frontend/src/components/BookSelector.tsx index 69d07e3a..c46590ff 100644 --- a/frontend/src/components/BookSelector.tsx +++ b/frontend/src/components/BookSelector.tsx @@ -6,9 +6,10 @@ interface BookSelectorProps { onBookSelect: (book: string) => void; formatBookName: (bookName: string) => string; user?: any; + onFavoriteChange?: () => void; } -const BookSelector: React.FC = ({ books, onBookSelect, formatBookName, user }) => { +const BookSelector: React.FC = ({ books, onBookSelect, formatBookName, user, onFavoriteChange }) => { const [favorites, setFavorites] = useState>(new Set()); const [loading, setLoading] = useState(false); @@ -85,6 +86,7 @@ const BookSelector: React.FC = ({ books, onBookSelect, format return newFavorites; }); console.log('Removed book favorite:', book); + onFavoriteChange?.(); // Notify parent to refresh favorites menu } } } @@ -104,6 +106,7 @@ const BookSelector: React.FC = ({ books, onBookSelect, format if (response.ok) { setFavorites(prev => new Set(prev).add(book)); console.log('Added book favorite:', book); + onFavoriteChange?.(); // Notify parent to refresh favorites menu } else { console.error('Failed to add favorite:', response.status, response.statusText); } diff --git a/frontend/src/components/ChapterSelector.tsx b/frontend/src/components/ChapterSelector.tsx index f59fb893..d97fb43b 100644 --- a/frontend/src/components/ChapterSelector.tsx +++ b/frontend/src/components/ChapterSelector.tsx @@ -8,9 +8,10 @@ interface ChapterSelectorProps { onBack: () => void; formatBookName: (bookName: string) => string; user?: any; + onFavoriteChange?: () => void; } -const ChapterSelector: React.FC = ({ book, onChapterSelect, onBack, formatBookName, user }) => { +const ChapterSelector: React.FC = ({ book, onChapterSelect, onBack, formatBookName, user, onFavoriteChange }) => { const [chapters, setChapters] = useState([]); const [loading, setLoading] = useState(true); const [favorites, setFavorites] = useState>(new Set()); @@ -79,6 +80,7 @@ const ChapterSelector: React.FC = ({ book, onChapterSelect newFavorites.delete(chapter); return newFavorites; }); + onFavoriteChange?.(); // Notify parent to refresh favorites menu } } } else { @@ -97,6 +99,7 @@ const ChapterSelector: React.FC = ({ book, onChapterSelect if (response.ok) { setFavorites(prev => new Set(prev).add(chapter)); + onFavoriteChange?.(); // Notify parent to refresh favorites menu } } } catch (error) {