generates static params for all study pages

src/app/[readerMode]/[bookCode]/[chapter]/page.tsx

@@ -1 +1,23 @@
+import { range } from 'ramda'
+
+import {
+	READER_MODE,
+	type TReaderPageParams,
+} from '~/_pages/ReaderPage/ReaderPage.types'
+import { getBookList } from '~/db'
+
+export const generateStaticParams = async (): Promise<TReaderPageParams[]> => {
+	const bookList = await getBookList()
+
+	return bookList.flatMap((book) => {
+		const bookCode = book.book.code.toLowerCase()
+
+		return range(1)(book.book.chapter_count + 1).map((chapter) => ({
+			bookCode,
+			chapter: chapter.toString(),
+			readerMode: READER_MODE.Study,
+		}))
+	})
+}
+
 export { ReaderPage as default } from '~/_pages'

src/components/organisms/ReaderControls/ChapterPicker/ChapterPicker.tsx

@@ -38,10 +38,10 @@ export const ChapterPicker = ({
 	currBook: TBook
 	bookList: TBook[]
 }) => {
-	const [isOpen, setIsOpen] = useState(false)
-
 	const { readerMode } = useParams<TReaderPageParams>()
 
+	const [isOpen, setIsOpen] = useState(false)
+
 	const [tab, setTab] = useState<string | null>('book')
 
 	const [selectedBook, setSelectedBook] =
@@ -77,7 +77,11 @@ export const ChapterPicker = ({
 	}, [])
 
 	return (
-		<Dialog.Root open={isOpen} onOpenChange={(e) => setIsOpen(e.open)}>
+		<Dialog.Root
+			open={isOpen}
+			onOpenChange={({ open }) => setIsOpen(open)}
+			onExitComplete={() => setTab('book')}
+		>
 			<Trigger_ChapterPicker>
 				{currBook.name} {currChapter}
 			</Trigger_ChapterPicker>
@@ -94,7 +98,7 @@ export const ChapterPicker = ({
 						})}
 					>
 						<Header_ChapterPicker
-							resetSelectedBook={() => setSelectedBook(currBook)}
+							onTabsTriggerClick={() => setSelectedBook(currBook)}
 						/>
 						<Tabs.Content value="book" className={tabsContentCss}>
 							<BookList_ChapterPicker>

src/components/organisms/ReaderControls/ChapterPicker/Header_ChapterPicker.tsx

@@ -36,9 +36,9 @@ const tabsTriggerCss = css({
 })
 
 export const Header_ChapterPicker = ({
-	resetSelectedBook,
+	onTabsTriggerClick,
 }: {
-	resetSelectedBook: () => void
+	onTabsTriggerClick: () => void
 }) => (
 	<div className={css({ gridColumn: 'content' })}>
 		<div
@@ -47,14 +47,14 @@ export const Header_ChapterPicker = ({
 			<Tabs.List className={css({ h: 'full' })}>
 				<Tabs.Trigger
 					value="book"
-					onClick={resetSelectedBook}
+					onClick={onTabsTriggerClick}
 					className={tabsTriggerCss}
 				>
 					Book
 				</Tabs.Trigger>
 				<Tabs.Trigger
 					value="chapter"
-					onClick={resetSelectedBook}
+					onClick={onTabsTriggerClick}
 					className={tabsTriggerCss}
 				>
 					Chapter