Error handling and TODO

This commit is contained in:
2025-01-12 22:33:53 -05:00
parent 0de96f7be0
commit a5fcffa344
4 changed files with 47 additions and 22 deletions

View File

@@ -1,6 +1,6 @@
import React from "react";
import NavigationButtons from "@/components/NavigationButtons";
import { Chapter } from "@/lib/types";
import { Book, Chapter } from "@/lib/types";
import { fetchBookById } from "@/lib/api";
import Head from "next/head";
export type paramsType = Promise<{ bookId: string; chapterId: string }>;
@@ -9,16 +9,12 @@ export type paramsType = Promise<{ bookId: string; chapterId: string }>;
export default async function ChapterPage(props: { params: paramsType}) {
const { bookId, chapterId } = await props.params;
const book = await fetchBookById(bookId);
const chapters :Chapter[] = book.chapters;
const sorted_chapters:Chapter[] = chapters.sort((a, b) => a.number - b.number);
const current_chapter = sorted_chapters.find((chapter) => chapter.documentId === chapterId) || undefined;
const next_chapter = current_chapter ? sorted_chapters.find((chapter) => chapter.number === current_chapter.number + 1)?.documentId || "" : "";
const prev_chapter = current_chapter ? sorted_chapters.find((chapter) => chapter.number === current_chapter.number - 1)?.documentId || "" : "";
// Fetch chapter data
if (current_chapter === undefined) {
let book: Book;
try{
book = await fetchBookById(bookId);
}
catch (error) {
console.error(error);
return (
<>
<Head>
@@ -27,17 +23,37 @@ export default async function ChapterPage(props: { params: paramsType}) {
</Head>
<div className="prose dark:prose-invert mx-auto p-6 bg-white dark:bg-gray-800 shadow-md rounded-lg mt-4">
<div dangerouslySetInnerHTML={{ __html: '<center><h1> Chapter not found !</h1></center>' }}></div>
<NavigationButtons bookId={bookId} documentId={chapterId} prevChapter={prev_chapter} nextChapter={next_chapter} />
<NavigationButtons bookId={bookId} documentId={chapterId} prevChapter={""} nextChapter={""} />
</div>
</>
)
}
const chapters :Chapter[] = book.chapters;
const sorted_chapters:Chapter[] = chapters.sort((a, b) => a.number - b.number);
const current_chapter = sorted_chapters.find((chapter) => chapter.documentId === chapterId) || null;
const next_chapter = current_chapter ? sorted_chapters.find((chapter) => chapter.number === current_chapter.number + 1)?.documentId || "" : "";
const prev_chapter = current_chapter ? sorted_chapters.find((chapter) => chapter.number === current_chapter.number - 1)?.documentId || "" : "";
if(current_chapter === null){
return (
<>
<Head>
<title>Chapter not found</title>
<meta name="description" content="Chapter not found" />
</Head>
<div className="prose dark:prose-invert mx-auto p-6 bg-white dark:bg-gray-800 shadow-md rounded-lg mt-4">
<div dangerouslySetInnerHTML={{ __html: '<center><h1> Chapter not found !</h1></center>' }}></div>
<NavigationButtons bookId={bookId} documentId={chapterId} prevChapter={""} nextChapter={""} />
</div>
</>
)
}
return (
<>
<Head>
<title>{book.title} - Chapter {current_chapter.number}</title>
<title>{book.title} - Chapter {current_chapter?.number}</title>
<meta name="description" content={book.description} />
</Head>
<div className="prose dark:prose-invert mx-auto p-6 bg-white dark:bg-gray-800 shadow-md rounded-lg mt-4">
@@ -47,6 +63,5 @@ export default async function ChapterPage(props: { params: paramsType}) {
<NavigationButtons bookId={bookId} documentId={chapterId} prevChapter={prev_chapter} nextChapter={next_chapter}/>
</div>
</>
);
);
}

View File

@@ -18,7 +18,7 @@ export default async function BookPage(props: { params: paramsType }) {
console.error(error);
return (
<div className="text-center mt-10 text-red-500">
Error fetching book data. Please try again later.
Book does not exists, are you lost?
</div>
);
}

View File

@@ -69,9 +69,9 @@ export async function fetchBookChapterLinks(bookId: string): Promise<Book> {
*/
export async function fetchBookById(bookId: string): Promise<Book> {
const currentDateTime = new Date().toISOString();
const data = await fetchFromAPI<{ data: Book }>(
`/api/books/${bookId}?populate[chapters][filters][release_datetime][$lte]=${currentDateTime}&populate=cover`
);
const data = await fetchFromAPI<{ data: Book }>(
`/api/books/${bookId}?populate[chapters][filters][release_datetime][$lte]=${currentDateTime}&populate=cover`
);
return data.data;
}