From b4952a40132044156a1bed55e5dfc2b2bae1c4e0 Mon Sep 17 00:00:00 2001 From: Ryderjj89 Date: Sun, 28 Sep 2025 13:58:25 -0400 Subject: [PATCH] Complete homepage redesign - no longer defaults to ESV version - Page title updated to 'The Bible' instead of 'ESV Bible' - Homepage now shows version selection cards (ESV/NKJV) instead of book list - Version dropdown shows 'Choose version' on homepage - Users must select version before seeing books - Maintains URL parameter support and all existing functionality - Clean separation between version selection and Bible browsing Now users start with version selection, preventing defaulting to one translation. --- frontend/public/index.html | 4 +-- frontend/src/App.tsx | 51 +++++++++++++++++++++++++++----------- 2 files changed, 38 insertions(+), 17 deletions(-) diff --git a/frontend/public/index.html b/frontend/public/index.html index 3f6e8adb..874510e6 100644 --- a/frontend/public/index.html +++ b/frontend/public/index.html @@ -3,9 +3,9 @@ - + - ESV Bible + The Bible diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx index 57096ed1..d8bd21e6 100644 --- a/frontend/src/App.tsx +++ b/frontend/src/App.tsx @@ -6,6 +6,7 @@ import ChapterSelector from './components/ChapterSelector'; import BibleReader from './components/BibleReader'; import FavoritesMenu from './components/FavoritesMenu'; import SearchComponent from './components/SearchComponent'; +import VersionSelector from './components/VersionSelector'; import { getBooks } from './services/api'; interface BookData { @@ -24,7 +25,8 @@ function App() { }); const [error, setError] = useState(''); const [showSearch, setShowSearch] = useState(false); - const [selectedVersion, setSelectedVersion] = useState('esv'); // Default to ESV + const [selectedVersion, setSelectedVersion] = useState(''); // Empty means no version selected yet + const [versionSelected, setVersionSelected] = useState(false); // Track if version has been chosen const [availableVersions, setAvailableVersions] = useState([]); const location = useLocation(); const navigate = useNavigate(); @@ -260,6 +262,11 @@ function App() { // Component for the home page const HomePage = () => { + const handleVersionSelect = (version: 'esv' | 'nkjv') => { + setSelectedVersion(version); + setVersionSelected(true); + }; + const handleBookSelect = (book: string) => { const urlName = getBookUrlName(book); navigate(`/book/${urlName}`); @@ -270,10 +277,18 @@ function App() { setUser((prev: any) => ({ ...prev })); }; + // Show version selector if no version is selected + if (!selectedVersion) { + return ( + + ); + } + + // Show book selector once version is selected return ( - {/* Version Selector */} - + {selectedVersion ? ( + + ) : ( + + Choose version + + )}