Add offline mode logic for main chapters and refine IPC handlers

- Integrate `OfflineContext` into `MainChapter` and related components to handle offline scenarios for chapter operations.
- Add conditional logic to toggle between server API requests and offline IPC handlers (`db:chapter:add`, `db:chapter:remove`).
- Extend `GET /book/story` endpoint to include `mainChapter` data.
- Refactor IPC handlers for chapters to accept structured data arguments with stricter typings.
- Update frontend key assignments for `BookList` component for improved rendering stability.

components/book/BookList.tsx

@@ -253,8 +253,8 @@ export default function BookList() {
                                     <div
                                         className="flex justify-between items-center w-full max-w-5xl mx-auto mb-6 px-6">
                                         <h2 className="text-3xl text-text-primary capitalize font-['ADLaM_Display'] flex items-center gap-3">
-                                            <span key="icon" className="w-1 h-8 bg-primary rounded-full"></span>
-                                            <span key="title">{category}</span>
+                                            <span className="w-1 h-8 bg-primary rounded-full"></span>
+                                            <span>{category}</span>
                                         </h2>
                                         <span
                                             className="text-muted text-lg font-medium bg-secondary/30 px-4 py-1.5 rounded-full">{books.length} {t("bookList.works")}</span>
@@ -263,7 +263,7 @@ export default function BookList() {
                                     <div className="flex flex-wrap justify-center items-start w-full px-4">
                                         {
                                             books.map((book: BookProps, idx) => (
-                                                <div key={book.bookId}
+                                                <div key={book.bookId || `book-${idx}`}
                                                      {...(idx === 0 && {'data-guide': 'book-card'})}
                                                      className={`w-full sm:w-1/3 md:w-1/4 lg:w-1/5 xl:w-1/6 p-2 box-border ${User.guideTourDone(session.user?.guideTour || [], 'new-first-book') && 'mb-[200px]'}`}>
                                                     <BookCard book={book}

components/book/settings/story/MainChapter.tsx

@@ -12,6 +12,7 @@ import AlertBox from "@/components/AlertBox";
 import CollapsableArea from "@/components/CollapsableArea";
 import {useTranslations} from "next-intl";
 import {LangContext} from "@/context/LangContext";
+import OfflineContext, {OfflineContextType} from "@/context/OfflineContext";
 
 interface MainChapterProps {
     chapters: ChapterListProps[];
@@ -21,6 +22,7 @@ interface MainChapterProps {
 export default function MainChapter({chapters, setChapters}: MainChapterProps) {
     const t = useTranslations();
     const {lang} = useContext(LangContext)
+    const {isCurrentlyOffline} = useContext<OfflineContextType>(OfflineContext);
     const {book} = useContext(BookContext);
     const {session} = useContext(SessionContext);
     const {errorMessage, successMessage} = useContext(AlertContext);
@@ -78,15 +80,16 @@ export default function MainChapter({chapters, setChapters}: MainChapterProps) {
     async function deleteChapter(): Promise<void> {
         try {
             setDeleteConfirmMessage(false);
-            const response: boolean = await System.authDeleteToServer<boolean>(
-                'chapter/remove',
-                {
-                    bookId,
-                    chapterId: chapterIdToRemove,
-                },
-                token,
-                lang,
-            );
+            let response: boolean;
+            const deleteData = {
+                bookId,
+                chapterId: chapterIdToRemove,
+            };
+            if (isCurrentlyOffline()) {
+                response = await window.electron.invoke<boolean>('db:chapter:remove', deleteData);
+            } else {
+                response = await System.authDeleteToServer<boolean>('chapter/remove', deleteData, token, lang);
+            }
             if (!response) {
                 errorMessage(t("mainChapter.errorDelete"));
             }
@@ -105,18 +108,20 @@ export default function MainChapter({chapters, setChapters}: MainChapterProps) {
         if (newChapterTitle.trim() === '') {
             return;
         }
-        
+
         try {
-            const responseId: string = await System.authPostToServer<string>(
-                'chapter/add',
-                {
-                    bookId: bookId,
-                    wordsCount: 0,
-                    chapterOrder: newChapterOrder ? newChapterOrder : 0,
-                    title: newChapterTitle,
-                },
-                token,
-            );
+            let responseId: string;
+            const chapterData = {
+                bookId: bookId,
+                wordsCount: 0,
+                chapterOrder: newChapterOrder ? newChapterOrder : 0,
+                title: newChapterTitle,
+            };
+            if (isCurrentlyOffline()) {
+                responseId = await window.electron.invoke<string>('db:chapter:add', chapterData);
+            } else {
+                responseId = await System.authPostToServer<string>('chapter/add', chapterData, token);
+            }
             if (!responseId) {
                 errorMessage(t("mainChapter.errorAdd"));
                 return;
@@ -130,7 +135,7 @@ export default function MainChapter({chapters, setChapters}: MainChapterProps) {
             };
             setChapters([...chapters, newChapter]);
             setNewChapterTitle('');
-            
+
             setNewChapterOrder(newChapterOrder + 1);
         } catch (e: unknown) {
             if (e instanceof Error) {