Merge pull request #50 from seemorg/dev

Production deployment

locales/ar/reader.json

@@ -51,7 +51,7 @@
     "sources": "مصادر",
     "error": "حدث خطأ ما. <retry>حاول مرة أخرى</retry> أو <contact>اتصل بنا</contact> إذا استمرت المشكلة.",
     "pg-x": "صفحة {page, number, nogroup}",
-    "pg-x-vol": "P{vol, number, nogroup}/صفحة {page, number, nogroup}"
+    "pg-x-vol": "المجلد {vol, number, nogroup}، صفحة {page, number, nogroup}"
   },
   "edition": "الإصدار",
   "select-edition": "اختر إصدارًا",

locales/en/reader.json

@@ -51,7 +51,7 @@
     "sources": "Sources",
     "error": "Something went wrong. <retry>Try again</retry> or <contact>contact us</contact> if it persists.",
     "pg-x": "P{page, number, nogroup}",
-    "pg-x-vol": "P{vol, number, nogroup}/{page, number, nogroup}"
+    "pg-x-vol": "Vol {vol, number, nogroup}, Pg {page, number, nogroup}"
   },
   "edition": "Edition",
   "select-edition": "Select an edition",

src/app/[locale]/t/[bookId]/[pageNumber]/page.tsx

@@ -8,6 +8,7 @@ import ReaderNavigation from "../_components/reader-navigation";
 import { getMetadata } from "@/lib/seo";
 import { navigation } from "@/lib/urls";
 import { permanentRedirect } from "@/navigation";
+import { BookDetailsProvider } from "../_contexts/book-details.context";
 
 export const generateMetadata = async ({
   params: { bookId, pageNumber },
@@ -112,27 +113,19 @@ async function SidebarContent({
   }
 
   return (
-    <SidebarResizer
-      sidebar={
-        <ReaderSidebar
-          bookSlug={bookId}
-          versionId={versionId}
-          bookResponse={response}
-          isSinglePage
-        />
-      }
-    >
-      <ReaderNavigation bookResponse={response} isSinglePage />
-
-      <article>
-        <ReaderContent
-          response={response}
-          currentPage={parsedNumber}
-          isSinglePage
-        />
-      </article>
-    </SidebarResizer>
+    <BookDetailsProvider bookResponse={response}>
+      <SidebarResizer
+        sidebar={
+          <ReaderSidebar bookSlug={bookId} versionId={versionId} isSinglePage />
+        }
+      >
+        <ReaderNavigation isSinglePage />
+
+        <article>
+          <ReaderContent currentPage={parsedNumber} isSinglePage />
+        </article>
+      </SidebarResizer>
+    </BookDetailsProvider>
   );
 }
-
 export default SidebarContent;

src/app/[locale]/t/[bookId]/_components/ai-tab/index.tsx

@@ -8,7 +8,6 @@ import ChatMessage from "./ChatMessage";
 import { useCallback } from "react";
 import { useScrollAnchor } from "./useScrollAnchor";
 import { useTranslations } from "next-intl";
-import type { TabProps } from "../sidebar/tabs";
 import { usePageNavigation } from "../usePageNavigation";
 import ChatForm from "./ChatForm";
 import { InfoIcon, SquarePenIcon } from "lucide-react";
@@ -17,9 +16,11 @@ import { VersionAlert } from "../version-alert";
 import SidebarContainer from "../sidebar/sidebar-container";
 import { Badge } from "@/components/ui/badge";
 import { OpenAILogo } from "@/components/Icons";
+import { useBookDetails } from "../../_contexts/book-details.context";
 
-export default function AITab({ bookResponse }: TabProps) {
-  const { getVirtuosoScrollProps } = usePageNavigation(bookResponse);
+export default function AITab() {
+  const { bookResponse } = useBookDetails();
+  const { getVirtuosoScrollProps } = usePageNavigation();
   const t = useTranslations();
   const {
     messagesRef,

src/app/[locale]/t/[bookId]/_components/ai-tab/useChat.tsx

@@ -1,4 +1,4 @@
-import { chatWithBook, parseSourceNode } from "@/server/services/chat";
+import { chatWithBook } from "@/server/services/chat";
 import type { SemanticSearchBookNode } from "@/types/SemanticSearchBookNode";
 import type { ChatResponse } from "@/types/chat";
 import { useCallback } from "react";
@@ -48,7 +48,7 @@ const handleEventSource = async (
           id,
           role: "ai",
           text: allContent,
-          sourceNodes: (sources ?? []).map(parseSourceNode),
+          sourceNodes: sources ?? [],
         });
       }
 

src/app/[locale]/t/[bookId]/_components/content-tab/index.tsx

@@ -7,10 +7,11 @@ import type { TabProps } from "../sidebar/tabs";
 import { usePageNavigation } from "../usePageNavigation";
 import { useSearchParams } from "next/navigation";
 import PdfChaptersList from "./pdf-chapters-section";
+import { useBookDetails } from "../../_contexts/book-details.context";
 
-function ContentTab({ bookResponse, isSinglePage }: TabProps) {
-  const { pagesRange, getVirtuosoScrollProps } =
-    usePageNavigation(bookResponse);
+function ContentTab({ isSinglePage }: TabProps) {
+  const { bookResponse } = useBookDetails();
+  const { pagesRange, getVirtuosoScrollProps } = usePageNavigation();
 
   const _view = (useSearchParams().get("view") ?? "default") as
     | "pdf"

src/app/[locale]/t/[bookId]/_components/mobile-sidebar-provider.tsx

@@ -22,7 +22,6 @@ export function MobileSidebarProvider({
   tabId,
   bookSlug,
   versionId,
-  bookResponse,
 }: {
   icon: React.ReactNode;
   tabId: string;
@@ -55,7 +54,6 @@ export function MobileSidebarProvider({
         <SheetContent className="w-full overflow-y-auto bg-slate-50 pb-10 pt-16 dark:bg-card [&>div]:p-0">
           <TabContent
             tabId={activeTabId}
-            bookResponse={bookResponse}
             bookSlug={bookSlug}
             versionId={versionId}
           />

src/app/[locale]/t/[bookId]/_components/reader-content/index.tsx

@@ -5,36 +5,35 @@ import { Virtualizer } from "virtua";
 import React, { forwardRef, memo, useMemo, useRef } from "react";
 import { useReaderVirtuoso, useSetReaderScroller } from "../context";
 import Footer from "@/app/_components/footer";
-import type { ApiBookResponse } from "@/types/api/book";
 import ReaderPage from "./reader-page";
 import { READER_OVERSCAN_SIZE, READER_PAGINATION_SIZE } from "@/lib/constants";
 import Container from "@/components/ui/container";
 import Paginator from "../../[pageNumber]/paginator";
 import { HighlightPopover } from "@/components/ui/highlight-popover";
 import ReaderHighlightPopover from "./highlight-popover";
+import { useBookDetails } from "../../_contexts/book-details.context";
 
 export default function ReaderContent({
-  response,
   isSinglePage,
   currentPage,
 }: {
-  response: ApiBookResponse;
   isSinglePage?: boolean;
   currentPage?: number;
 }) {
+  const { bookResponse } = useBookDetails();
   const virtuosoRef = useReaderVirtuoso();
   const setContainerEl = useSetReaderScroller();
   const containerEl = useRef<HTMLElement>(null);
 
   const defaultPages = useMemo(() => {
-    if (response.content.source === "turath") {
-      return response.content.pages;
-    } else if (response.content.source === "openiti") {
-      return response.content.pages;
+    if (bookResponse.content.source === "turath") {
+      return bookResponse.content.pages;
+    } else if (bookResponse.content.source === "openiti") {
+      return bookResponse.content.pages;
     } else {
       return [];
     }
-  }, [response]);
+  }, [bookResponse]);
 
   return (
     <div
@@ -50,14 +49,14 @@ export default function ReaderContent({
     >
       {isSinglePage && (
         <Paginator
-          totalPages={response.pagination.total}
+          totalPages={bookResponse.pagination.total}
           currentPage={currentPage!}
-          slug={response.book.slug}
+          slug={bookResponse.book.slug}
         />
       )}
 
       <Virtualizer
-        count={isSinglePage ? 1 : response.pagination.total}
+        count={isSinglePage ? 1 : bookResponse.pagination.total}
         ssrCount={
           isSinglePage
             ? 1
@@ -75,14 +74,14 @@ export default function ReaderContent({
           />
         ))}
       >
-        {new Array(isSinglePage ? 1 : response.pagination.total)
+        {new Array(isSinglePage ? 1 : bookResponse.pagination.total)
           .fill(null)
           .map((_, index) => (
             <Page
               key={index}
               index={isSinglePage ? currentPage! - 1 : index}
               defaultPages={defaultPages}
-              perPage={response.pagination.size}
+              perPage={bookResponse.pagination.size}
             />
           ))}
       </Virtualizer>

src/app/[locale]/t/[bookId]/_components/reader-content/reader-page.tsx

@@ -7,7 +7,7 @@ import type { OpenitiContent } from "@/types/api/content/openiti";
 import type { TurathContent } from "@/types/api/content/turath";
 import { useQuery } from "@tanstack/react-query";
 import { useTranslations } from "next-intl";
-import { useParams } from "next/navigation";
+import { useParams, useSearchParams } from "next/navigation";
 import { type PropsWithChildren, useMemo } from "react";
 
 type DefaultPages = NonNullable<
@@ -92,6 +92,7 @@ const useFetchPage = (
   defaultPages: DefaultPages,
 ) => {
   const params = useParams();
+  const versionId = useSearchParams().get("versionId");
   const slug = params.bookId as string;
 
   const pageNumber = params.pageNumber as string | undefined;
@@ -112,16 +113,19 @@ const useFetchPage = (
   const shouldUseDefaultPages = pageInfo.startIndex < defaultPages.length;
 
   const { data, isLoading, isError } = useQuery({
-    queryKey: ["reader", pageInfo.startIndex],
+    queryKey: ["reader", slug, versionId, pageInfo.startIndex] as const,
     queryFn: async ({ queryKey }) => {
-      const startIndex = queryKey[1] as number;
+      const [, _bookSlug, _versionId, startIndex] = queryKey;
 
-      const response = await getBook(slug, {
+      const response = await getBook(_bookSlug, {
         startIndex: startIndex,
         size: perPage,
+        versionId: _versionId ?? undefined,
       });
 
-      if (!response || "type" in response) return null;
+      if (!response || "type" in response) {
+        return null;
+      }
 
       return (response.content as any).pages as DefaultPages;
     },

src/app/[locale]/t/[bookId]/_components/reader-navigation/book-info-header.tsx

@@ -10,20 +10,17 @@ import { Separator } from "@/components/ui/separator";
 import { useDirection } from "@/lib/locale/utils";
 import { navigation } from "@/lib/urls";
 import { Link } from "@/navigation";
-import type { ApiBookResponse } from "@/types/api/book";
 import { ChevronDownIcon } from "lucide-react";
 import { useTranslations } from "next-intl";
 import { Fragment } from "react";
 import * as AccordionPrimitive from "@radix-ui/react-accordion";
 import { cn } from "@/lib/utils";
 import { useBookDetailsStore } from "../../_stores/book-details";
 import Container from "@/components/ui/container";
+import { useBookDetails } from "../../_contexts/book-details.context";
 
-export default function BookInfoHeader({
-  bookResponse,
-}: {
-  bookResponse: ApiBookResponse;
-}) {
+export default function BookInfoHeader() {
+  const { bookResponse } = useBookDetails();
   const dir = useDirection();
   const t = useTranslations();
   const { isOpen, setIsOpen } = useBookDetailsStore();

src/app/[locale]/t/[bookId]/_components/reader-navigation/index.tsx

@@ -18,6 +18,7 @@ import { TabContent } from "../tab-content";
 import { tabs } from "../sidebar/tabs";
 import { useState } from "react";
 import { Drawer, DrawerContent } from "@/components/ui/drawer";
+import { useBookDetails } from "../../_contexts/book-details.context";
 
 const getPdfUrl = (bookResponse: ApiBookResponse) => {
   if (bookResponse.content.source === "pdf") {
@@ -32,12 +33,11 @@ const getPdfUrl = (bookResponse: ApiBookResponse) => {
 };
 
 export default function ReaderNavigation({
-  bookResponse,
   isSinglePage,
 }: {
-  bookResponse: ApiBookResponse;
   isSinglePage?: boolean;
 }) {
+  const { bookResponse } = useBookDetails();
   const showNavbar = useNavbarStore((s) => s.showNavbar);
   const bookSlug = bookResponse.book.slug;
   const t = useTranslations("reader");
@@ -126,7 +126,6 @@ export default function ReaderNavigation({
                       bookSlug={bookSlug}
                       versionId={versionId}
                       isSinglePage={isSinglePage}
-                      bookResponse={bookResponse}
                     />
                   </div>
                 )}
@@ -136,7 +135,7 @@ export default function ReaderNavigation({
         </Container>
       </div>
 
-      <BookInfoHeader bookResponse={bookResponse} />
+      <BookInfoHeader />
     </>
   );
 }