diff --git a/frontend/src/components/BibleReader.tsx b/frontend/src/components/BibleReader.tsx index 10d09e95..6bc8ce5d 100644 --- a/frontend/src/components/BibleReader.tsx +++ b/frontend/src/components/BibleReader.tsx @@ -27,6 +27,26 @@ const BibleReader: React.FC = ({ book, chapter, onBack, format loadChapters(); }, [book, chapter]); + // Scroll to verse if specified in URL hash + useEffect(() => { + if (!loading && content) { + // Check if there's a verse hash in the URL + const hash = window.location.hash; + if (hash.startsWith('#verse-')) { + const verseElement = document.getElementById(hash.substring(1)); + if (verseElement) { + // Small delay to ensure content is rendered + setTimeout(() => { + verseElement.scrollIntoView({ + behavior: 'smooth', + block: 'center' + }); + }, 100); + } + } + } + }, [loading, content]); + // Load favorites when user is available useEffect(() => { if (user) { @@ -224,7 +244,7 @@ const BibleReader: React.FC = ({ book, chapter, onBack, format const verseText = verseMatch[2]; verses.push( -
+
{verseNumber} {verseText} diff --git a/frontend/src/components/FavoritesMenu.tsx b/frontend/src/components/FavoritesMenu.tsx index d925d438..ea962698 100644 --- a/frontend/src/components/FavoritesMenu.tsx +++ b/frontend/src/components/FavoritesMenu.tsx @@ -70,8 +70,12 @@ const FavoritesMenu: React.FC = ({ user, formatBookName, get const urlBookName = getBookUrlName(favorite.book); if (favorite.chapter) { - // Navigate to chapter - navigate(`/book/${urlBookName}/chapter/${favorite.chapter}`); + // Navigate to chapter, with verse hash if it's a verse favorite + let url = `/book/${urlBookName}/chapter/${favorite.chapter}`; + if (favorite.verse_start) { + url += `#verse-${favorite.verse_start}`; + } + navigate(url); } else { // Navigate to book navigate(`/book/${urlBookName}`);