RyderTech/the-bible
1
0
Fork 0
Code Issues Pull Requests Packages Activity

Fix chapter listing API and restore font size controls

Browse Source
This commit is contained in:
Ryderjj89
2025-09-13 15:59:07 -04:00
parent 1750b7c4ae
commit 9bebd76d7c
4 changed files with 46 additions and 36 deletions
Download Patch File Download Diff File Expand all files Collapse all files

43
frontend/src/components/BibleReader.tsx
View File

@@ -117,19 +117,36 @@ const BibleReader: React.FC<BibleReaderProps> = ({ book, chapter, onBack, format
<div className="flex items-center space-x-2">
<span className="text-sm text-gray-600 dark:text-gray-400">Font Size:</span>
<div className="flex space-x-1">
{(['small', 'medium', 'large'] as const).map((size) => (
<button
key={size}
onClick={() => setFontSize(size)}
className={`px-3 py-1 text-xs rounded ${
fontSize === size
? 'bg-blue-600 text-white'
: 'bg-gray-200 dark:bg-gray-700 text-gray-700 dark:text-gray-300 hover:bg-gray-300 dark:hover:bg-gray-600'
} transition-colors`}
>
{size.charAt(0).toUpperCase() + size.slice(1)}
</button>
))}
<button
onClick={() => setFontSize('small')}
className={`px-3 py-1 text-xs rounded ${
fontSize === 'small'
? 'bg-blue-600 text-white'
: 'bg-gray-200 dark:bg-gray-700 text-gray-700 dark:text-gray-300 hover:bg-gray-300 dark:hover:bg-gray-600'
} transition-colors`}
>
Small
</button>
<button
onClick={() => setFontSize('medium')}
className={`px-3 py-1 text-xs rounded ${
fontSize === 'medium'
? 'bg-blue-600 text-white'
: 'bg-gray-200 dark:bg-gray-700 text-gray-700 dark:text-gray-300 hover:bg-gray-300 dark:hover:bg-gray-600'
} transition-colors`}
>
Medium
</button>
<button
onClick={() => setFontSize('large')}
className={`px-3 py-1 text-xs rounded ${
fontSize === 'large'
? 'bg-blue-600 text-white'
: 'bg-gray-200 dark:bg-gray-700 text-gray-700 dark:text-gray-300 hover:bg-gray-300 dark:hover:bg-gray-600'
} transition-colors`}
>
Large
</button>
</div>
</div>
</div>

23
frontend/src/components/ChapterSelector.tsx
View File

@@ -20,21 +20,16 @@ const ChapterSelector: React.FC<ChapterSelectorProps> = ({ book, onChapterSelect
const loadChapters = async () => {
try {
setLoading(true);
const bookContent = await getBook(book);
// Parse markdown to extract chapter numbers
const lines = bookContent.split('\n');
const chapterNumbers: string[] = [];
for (const line of lines) {
// Look for chapter headers like "# 1" or "# 1\n"
const chapterMatch = line.match(/^#\s+(\d+)/);
if (chapterMatch) {
chapterNumbers.push(chapterMatch[1]);
}
const response = await getBook(book);
// The API now returns { chapters: ["1", "2", "3", ...] }
if (response.chapters) {
setChapters(response.chapters);
} else {
// Fallback: generate chapter numbers 1-50 (most books have fewer than 50 chapters)
const fallbackChapters = Array.from({ length: 50 }, (_, i) => (i + 1).toString());
setChapters(fallbackChapters);
}
setChapters(chapterNumbers);
} catch (error) {
console.error('Failed to load chapters:', error);
// Fallback: generate chapter numbers 1-50 (most books have fewer than 50 chapters)