From 6718096ea06be4e79412cebdf162f1afc0a08780 Mon Sep 17 00:00:00 2001
From: Ryderjj89 <raiden89@live.com>
Date: Sun, 28 Sep 2025 15:59:38 -0400
Subject: [PATCH] Fixed breadcrumb 'Books' navigation - goes to version home
 instead of root
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- **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!
---
 frontend/src/App.tsx                        | 1 +
 frontend/src/components/BibleReader.tsx     | 2 +-
 frontend/src/components/BookSelector.tsx    | 7 ++++---
 frontend/src/components/ChapterSelector.tsx | 2 +-
 4 files changed, 7 insertions(+), 5 deletions(-)

diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx
index 21794a90..9eb34ddb 100644
--- a/frontend/src/App.tsx
+++ b/frontend/src/App.tsx
@@ -292,6 +292,7 @@ function App() {
         onFavoriteChange={handleFavoriteChange}
         version={versionId}
         onBack={handleBack}
+        onSearchClick={() => setShowSearch(true)}
       />
     );
   };
diff --git a/frontend/src/components/BibleReader.tsx b/frontend/src/components/BibleReader.tsx
index eeb4304a..0afd95f0 100644
--- a/frontend/src/components/BibleReader.tsx
+++ b/frontend/src/components/BibleReader.tsx
@@ -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" />
diff --git a/frontend/src/components/BookSelector.tsx b/frontend/src/components/BookSelector.tsx
index d0534a34..589bc435 100644
--- a/frontend/src/components/BookSelector.tsx
+++ b/frontend/src/components/BookSelector.tsx
@@ -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" />
diff --git a/frontend/src/components/ChapterSelector.tsx b/frontend/src/components/ChapterSelector.tsx
index 9ebaeb8d..edc579ff 100644
--- a/frontend/src/components/ChapterSelector.tsx
+++ b/frontend/src/components/ChapterSelector.tsx
@@ -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" />