Merge pull request #274 from Aashish-Upadhyay-101/clickable-docs-links

feat: Clickable docs links

Author: mfts

Diff for: components/view/PagesViewer.tsx

@@ -20,7 +20,7 @@ export default function PagesViewer({
   versionNumber,
   brand,
 }: {
-  pages: { file: string; pageNumber: string }[];
+  pages: { file: string; pageNumber: string; embeddedLinks: string[] }[];
   linkId: string;
   documentId: string;
   viewId: string;
@@ -154,6 +154,7 @@ export default function PagesViewer({
         brand={brand}
         viewId={viewId}
         linkId={linkId}
+        embeddedLinks={pages[pageNumber - 1].embeddedLinks}
       />
       <div
         style={{ height: "calc(100vh - 64px)" }}

Diff for: components/view/document-view.tsx

@@ -16,7 +16,7 @@ import { useRouter } from "next/router";
 export type DEFAULT_DOCUMENT_VIEW_TYPE = {
   viewId: string;
   file: string | null;
-  pages: { file: string; pageNumber: string }[] | null;
+  pages: { file: string; pageNumber: string; embeddedLinks: string[] }[] | null;
 };
 
 export default function DocumentView({

Diff for: components/view/nav.tsx

@@ -1,10 +1,19 @@
 import Link from "next/link";
 import { Button } from "../ui/button";
 import PapermarkSparkle from "../shared/icons/papermark-sparkle";
-import { Download } from "lucide-react";
+import { ArrowUpRight, Download } from "lucide-react";
 import { Brand } from "@prisma/client";
 import Image from "next/image";
 import { toast } from "sonner";
+import {
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuTrigger,
+  DropdownMenuItem,
+  DropdownMenuLabel,
+  DropdownMenuSeparator,
+  DropdownMenuShortcut,
+} from "@/components/ui/dropdown-menu";
 
 export default function Nav({
   pageNumber,
@@ -15,12 +24,14 @@ export default function Nav({
   viewId,
   linkId,
   type,
+  embeddedLinks,
 }: {
   pageNumber?: number;
   numPages?: number;
   allowDownload?: boolean;
   assistantEnabled?: boolean;
   brand?: Brand;
+  embeddedLinks?: string[];
   viewId?: string;
   linkId?: string;
   type?: "pdf" | "notion";
@@ -79,7 +90,37 @@ export default function Nav({
               )}
             </div>
           </div>
-          <div className="absolute inset-y-0 right-0 flex items-center pr-2 sm:static sm:inset-auto sm:ml-6 sm:pr-0 space-x-2">
+          <div className="absolute inset-y-0 right-0 flex items-center pr-2 sm:static sm:inset-auto sm:ml-6 sm:pr-0 space-x-4">
+            {embeddedLinks && embeddedLinks.length > 0 ? (
+              <DropdownMenu>
+                <DropdownMenuTrigger>
+                  <Button className="text-sm font-medium text-white bg-gray-900 hover:bg-gray-900/80">
+                    Links on Page
+                  </Button>
+                </DropdownMenuTrigger>
+                <DropdownMenuContent className="space-y-2" align="end">
+                  <DropdownMenuLabel>Links on current page</DropdownMenuLabel>
+                  <DropdownMenuSeparator />
+                  {embeddedLinks.map((link, index) => (
+                    <Link
+                      href={link}
+                      target="_blank"
+                      rel="noopener noreferrer"
+                      key={index}
+                    >
+                      <DropdownMenuItem className="group h-10">
+                        <span className="w-[200px] truncate group-focus:text-clip group-focus:overflow-x-auto">
+                          {link}
+                        </span>
+                        <DropdownMenuShortcut className="pl-2 opacity-0 group-hover:opacity-60 group-focus:opacity-60">
+                          <ArrowUpRight />
+                        </DropdownMenuShortcut>
+                      </DropdownMenuItem>
+                    </Link>
+                  ))}
+                </DropdownMenuContent>
+              </DropdownMenu>
+            ) : null}
             {assistantEnabled ? (
               <Link href={`/view/${linkId}/chat`}>
                 <Button

Diff for: pages/api/mupdf/convert-page.ts

@@ -31,6 +31,11 @@ export default async (req: NextApiRequest, res: NextApiResponse) => {
     var doc = mupdf.Document.openDocument(pdfData, "application/pdf");
 
     var page = doc.loadPage(pageNumber - 1); // 0-based page index
+
+    // get links
+    const links = page.getLinks();
+    const embeddedLinks = links.map((link: any) => link.getURI());
+
     var pixmap = page.toPixmap(
       // mupdf.Matrix.identity,
       [3, 0, 0, 3, 0, 0], // scale 3x
@@ -53,6 +58,7 @@ export default async (req: NextApiRequest, res: NextApiResponse) => {
         versionId: documentVersionId,
         pageNumber: pageNumber,
         file: blob.url,
+        embeddedLinks: embeddedLinks,
       },
     });
 

Diff for: pages/api/views.ts

@@ -194,6 +194,7 @@ export default async function handle(
         select: {
           file: true,
           pageNumber: true,
+          embeddedLinks: true,
         },
       });
       console.timeEnd("get-pages");

Diff for: prisma/migrations/20240205170242_embedded_links/migration.sql

@@ -0,0 +1,2 @@
+-- AlterTable
+ALTER TABLE "DocumentPage" ADD COLUMN     "embeddedLinks" TEXT[];

Diff for: prisma/schema.prisma

@@ -155,13 +155,14 @@ model DocumentVersion {
 }
 
 model DocumentPage {
-  id         String          @id @default(cuid())
-  version    DocumentVersion @relation(fields: [versionId], references: [id], onDelete: Cascade)
-  versionId  String
-  pageNumber Int // e.g., 1, 2, 3 for 
-  file       String // This should be a reference to where the file / page is stored (S3, Google Cloud Storage, etc.)
-  createdAt  DateTime        @default(now())
-  updatedAt  DateTime        @updatedAt
+  id            String          @id @default(cuid())
+  version       DocumentVersion @relation(fields: [versionId], references: [id], onDelete: Cascade)
+  versionId     String
+  pageNumber    Int // e.g., 1, 2, 3 for 
+  embeddedLinks String[]
+  file          String // This should be a reference to where the file / page is stored (S3, Google Cloud Storage, etc.)
+  createdAt     DateTime        @default(now())
+  updatedAt     DateTime        @updatedAt
 
   @@unique([pageNumber, versionId])
   @@index([versionId])