diff --git a/app/[locale]/bible/page.tsx b/app/[locale]/bible/page.tsx index 744b09b..0f57079 100644 --- a/app/[locale]/bible/page.tsx +++ b/app/[locale]/bible/page.tsx @@ -21,16 +21,19 @@ import { useTheme, CircularProgress, Skeleton, + IconButton, } from '@mui/material' import { MenuBook, NavigateBefore, NavigateNext, Bookmark, + BookmarkBorder, Share, } from '@mui/icons-material' import { useState, useEffect } from 'react' import { useTranslations, useLocale } from 'next-intl' +import { useAuth } from '@/hooks/use-auth' interface BibleVerse { id: string @@ -62,6 +65,11 @@ export default function BiblePage() { const [selectedChapter, setSelectedChapter] = useState(1) const [verses, setVerses] = useState([]) const [loading, setLoading] = useState(true) + const [isBookmarked, setIsBookmarked] = useState(false) + const [bookmarkLoading, setBookmarkLoading] = useState(false) + const [verseBookmarks, setVerseBookmarks] = useState<{[key: string]: any}>({}) + const [verseBookmarkLoading, setVerseBookmarkLoading] = useState<{[key: string]: boolean}>({}) + const { user } = useAuth() // Fetch available books useEffect(() => { @@ -97,6 +105,56 @@ export default function BiblePage() { } }, [selectedBook, selectedChapter]) + // Check if chapter is bookmarked + useEffect(() => { + if (selectedBook && selectedChapter && user) { + const token = localStorage.getItem('authToken') + if (token) { + fetch(`/api/bookmarks/chapter/check?bookId=${selectedBook}&chapterNum=${selectedChapter}&locale=${locale}`, { + headers: { + 'Authorization': `Bearer ${token}` + } + }) + .then(res => res.json()) + .then(data => { + setIsBookmarked(data.isBookmarked || false) + }) + .catch(err => { + console.error('Error checking bookmark:', err) + }) + } + } else { + setIsBookmarked(false) + } + }, [selectedBook, selectedChapter, user, locale]) + + // Check verse bookmarks when verses change + useEffect(() => { + if (verses.length > 0 && user) { + const token = localStorage.getItem('authToken') + if (token) { + const verseIds = verses.map(verse => verse.id) + fetch(`/api/bookmarks/verse/bulk-check?locale=${locale}`, { + method: 'POST', + headers: { + 'Content-Type': 'application/json', + 'Authorization': `Bearer ${token}` + }, + body: JSON.stringify({ verseIds }) + }) + .then(res => res.json()) + .then(data => { + setVerseBookmarks(data.bookmarks || {}) + }) + .catch(err => { + console.error('Error checking verse bookmarks:', err) + }) + } + } else { + setVerseBookmarks({}) + } + }, [verses, user, locale]) + const currentBook = books.find(book => book.id === selectedBook) const maxChapters = currentBook?.chapters?.length || 50 // Default fallback @@ -121,6 +179,113 @@ export default function BiblePage() { } } + const handleBookmarkToggle = async () => { + if (!user || !selectedBook || !selectedChapter) return + + setBookmarkLoading(true) + const token = localStorage.getItem('authToken') + + if (!token) { + setBookmarkLoading(false) + return + } + + try { + if (isBookmarked) { + // Remove bookmark + const response = await fetch(`/api/bookmarks/chapter?bookId=${selectedBook}&chapterNum=${selectedChapter}&locale=${locale}`, { + method: 'DELETE', + headers: { + 'Authorization': `Bearer ${token}` + } + }) + + if (response.ok) { + setIsBookmarked(false) + } + } else { + // Add bookmark + const response = await fetch(`/api/bookmarks/chapter?locale=${locale}`, { + method: 'POST', + headers: { + 'Content-Type': 'application/json', + 'Authorization': `Bearer ${token}` + }, + body: JSON.stringify({ + bookId: selectedBook, + chapterNum: selectedChapter + }) + }) + + if (response.ok) { + setIsBookmarked(true) + } + } + } catch (error) { + console.error('Error toggling bookmark:', error) + } finally { + setBookmarkLoading(false) + } + } + + const handleVerseBookmarkToggle = async (verse: BibleVerse) => { + if (!user) return + + setVerseBookmarkLoading(prev => ({ ...prev, [verse.id]: true })) + const token = localStorage.getItem('authToken') + + if (!token) { + setVerseBookmarkLoading(prev => ({ ...prev, [verse.id]: false })) + return + } + + try { + const isCurrentlyBookmarked = !!verseBookmarks[verse.id] + + if (isCurrentlyBookmarked) { + // Remove verse bookmark + const response = await fetch(`/api/bookmarks/verse?verseId=${verse.id}&locale=${locale}`, { + method: 'DELETE', + headers: { + 'Authorization': `Bearer ${token}` + } + }) + + if (response.ok) { + setVerseBookmarks(prev => { + const newBookmarks = { ...prev } + delete newBookmarks[verse.id] + return newBookmarks + }) + } + } else { + // Add verse bookmark + const response = await fetch(`/api/bookmarks/verse?locale=${locale}`, { + method: 'POST', + headers: { + 'Content-Type': 'application/json', + 'Authorization': `Bearer ${token}` + }, + body: JSON.stringify({ + verseId: verse.id + }) + }) + + if (response.ok) { + const data = await response.json() + setVerseBookmarks(prev => ({ + ...prev, + [verse.id]: data.bookmark + })) + } + } + } catch (error) { + console.error('Error toggling verse bookmark:', error) + } finally { + setVerseBookmarkLoading(prev => ({ ...prev, [verse.id]: false })) + } + } + if (loading && books.length === 0) { return ( @@ -223,10 +388,13 @@ export default function BiblePage() {