diff --git a/src/App.jsx b/src/App.jsx index d26a4af..5600038 100644 --- a/src/App.jsx +++ b/src/App.jsx @@ -7,20 +7,9 @@ import { useProjectLibrary } from './hooks/useProjectLibrary.js'; import { useReadingPlan } from './hooks/useReadingPlan.js'; import { useSharedView } from './hooks/useSharedView.js'; import HomePage from './pages/HomePage.jsx'; - -import { - buildExportHtml, - loadProjectIndex, - switchStorageUser, -} from './utils/bibleUtils.jsx'; -import { - saveProjectToStorage, - migrateOldStorageKeys, -} from './utils/projectStorage.js'; - -import { - saveRemoteProject, -} from './syncService.js'; +import { saveRemoteProject } from './syncService.js'; +import { buildExportHtml, loadProjectIndex, switchStorageUser } from './utils/bibleUtils.jsx'; +import { migrateOldStorageKeys, saveProjectToStorage } from './utils/projectStorage.js'; // Less-common pages are split into their own chunks so the first load only // downloads what's needed to show the home screen. @@ -33,17 +22,13 @@ const SetupPage = lazy(() => import('./pages/SetupPage.jsx')); const StudyPage = lazy(() => import('./pages/StudyPage.jsx')); const PronunciationPage = lazy(() => import('./pages/PronunciationPage.jsx')); -// --------------------------------------------------------------------------- -// Stable utility exports (used by tests and other modules) -// --------------------------------------------------------------------------- - // --------------------------------------------------------------------------- // App component // --------------------------------------------------------------------------- const App = () => { const [project, setProject] = useState(null); - // 'home' | 'setup' | 'study' | 'settings' + // 'home' | 'setup' | 'study' | 'reader' | 'import' | 'pronunciation' | 'settings' | 'admin' const [currentPage, setCurrentPage] = useState('home'); const [projectIndex, setProjectIndex] = useState([]); const [saveStatus, setSaveStatus] = useState(''); @@ -73,20 +58,16 @@ const App = () => { setProjectIndex, setCurrentPage, }); - const openBibleReader = () => { - setCurrentPage('reader'); - }; - // --------------------------------------------------------------------------- // Startup: migrate old keys and load index - // --------------------------------------------------------------------------- useEffect(() => { migrateOldStorageKeys(); setProjectIndex(loadProjectIndex()); }, []); const allChunks = project ? project.chapters.flatMap((ch) => ch.chunks) : []; - // Autosave + + // Autosave: 1s after the last edit, save locally, then sync to the server. useEffect(() => { if (!project) return; if (saveTimerRef.current) window.clearTimeout(saveTimerRef.current); @@ -126,9 +107,8 @@ const App = () => { })); }; - // --------------------------------------------------------------------------- - // Home page helpers - // --------------------------------------------------------------------------- + // Navigation + const openBibleReader = () => setCurrentPage('reader'); const openNewProject = () => { setProject(null); @@ -157,9 +137,8 @@ const App = () => { if (result.ok) window.setTimeout(() => setSyncStatus(''), 2500); }; - // --------------------------------------------------------------------------- - // Context value — every state, handler, and computed value pages need. - // --------------------------------------------------------------------------- + // Shared with every page via useApp(). Page-specific state lives in the + // pages themselves or in hooks under src/hooks/. const contextValue = { // Navigation currentPage, setCurrentPage, diff --git a/src/pages/PronunciationPage.jsx b/src/pages/PronunciationPage.jsx index c792aa0..fa51938 100644 --- a/src/pages/PronunciationPage.jsx +++ b/src/pages/PronunciationPage.jsx @@ -1,9 +1,10 @@ import { useState } from 'react'; import { useApp } from '../context/AppContext.js'; import { buildPronunciationGuide } from '../utils/bibleUtils.jsx'; +import { speakOriginalWord } from '../utils/wordStudy.js'; export default function PronunciationPage() { - const { project, speakOriginalWord, setCurrentPage } = useApp(); + const { project, setCurrentPage } = useApp(); const [search, setSearch] = useState(''); const [copied, setCopied] = useState(false);