Fixed breadcrumb 'Books' navigation - goes to version home instead of root

- **Corrected breadcrumb targets**: 'Books' button now navigates to /version/{current-version} instead of root '/'
- **Version-aware navigation**: All breadcrumb 'Books' clicks stay within current Bible version
- **Proper page flow**: Click 'Books' from any page → goes back to current version's book selection
- **Complete navigation loop**: ESV → Genesis → Chapter 1 → Books → back to ESV book selection

Breadcrumb navigation now intelligently stays within current Bible version context!
This commit is contained in:
Ryderjj89
2025-09-28 15:59:38 -04:00
parent ec894ab57e
commit 6718096ea0
4 changed files with 7 additions and 5 deletions

View File

@@ -292,6 +292,7 @@ function App() {
onFavoriteChange={handleFavoriteChange}
version={versionId}
onBack={handleBack}
onSearchClick={() => setShowSearch(true)}
/>
);
};

View File

@@ -305,7 +305,7 @@ const BibleReader: React.FC<BibleReaderProps> = ({ book, chapter, onBack, format
{/* Breadcrumb Navigation */}
<div className="flex items-center justify-center space-x-1 mb-8">
<button
onClick={() => window.location.href = '/'}
onClick={() => window.location.href = `/version/${version}`}
className="flex items-center space-x-1 text-sm text-gray-600 dark:text-gray-400 hover:text-blue-600 dark:hover:text-blue-400 transition-colors"
>
<BookOpen className="h-4 w-4" />

View File

@@ -1,5 +1,5 @@
import React, { useState, useEffect } from 'react';
import { BookOpen, Star, ChevronLeft } from 'lucide-react';
import { BookOpen, Star, ChevronLeft, Search } from 'lucide-react';
interface BookSelectorProps {
books: string[];
@@ -9,6 +9,7 @@ interface BookSelectorProps {
onFavoriteChange?: () => void;
version?: string;
onBack?: () => void;
onSearchClick?: () => void;
}
const BookSelector: React.FC<BookSelectorProps> = ({ books, onBookSelect, formatBookName, user, onFavoriteChange, version = 'esv', onBack }) => {
@@ -166,10 +167,10 @@ const BookSelector: React.FC<BookSelectorProps> = ({ books, onBookSelect, format
return (
<div className="space-y-12">
{/* Breadcrumb */}
{onBack && (
{version && (
<div className="flex items-center justify-center space-x-1 text-sm text-gray-600 dark:text-gray-400">
<button
onClick={onBack}
onClick={() => window.location.href = `/version/${version}`}
className="flex items-center space-x-1 hover:text-blue-600 dark:hover:text-blue-400 transition-colors"
>
<BookOpen className="h-4 w-4" />

View File

@@ -147,7 +147,7 @@ const ChapterSelector: React.FC<ChapterSelectorProps> = ({ book, onChapterSelect
{/* Breadcrumb Navigation */}
<div className="flex items-center justify-center space-x-1 mb-8">
<button
onClick={() => window.location.href = '/'}
onClick={() => window.location.href = `/version/${version}`}
className="flex items-center space-x-1 text-sm text-gray-600 dark:text-gray-400 hover:text-blue-600 dark:hover:text-blue-400 transition-colors"
>
<ArrowLeft className="h-4 w-4" />