feat: Allow editing bookmark details

1 files changed, 8 insertions, 2 deletions

diff --git a/apps/web/components/dashboard/preview/BookmarkPreview.tsx b/apps/web/components/dashboard/preview/BookmarkPreview.tsx
index c78eab22..07ae0809 100644
--- a/apps/web/components/dashboard/preview/BookmarkPreview.tsx
+++ b/apps/web/components/dashboard/preview/BookmarkPreview.tsx
@@ -1,5 +1,6 @@
 "use client";
 
+import React from "react";
 import Link from "next/link";
 import { BookmarkTagsEditor } from "@/components/dashboard/bookmarks/BookmarkTagsEditor";
 import { FullPageSpinner } from "@/components/ui/full-page-spinner";
@@ -17,6 +18,7 @@ import { api } from "@/lib/trpc";
 import { CalendarDays, ExternalLink } from "lucide-react";
 
 import {
+  getBookmarkTitle,
   getSourceUrl,
   isBookmarkStillCrawling,
   isBookmarkStillLoading,
@@ -27,7 +29,6 @@ import SummarizeBookmarkArea from "../bookmarks/SummarizeBookmarkArea";
 import ActionBar from "./ActionBar";
 import { AssetContentSection } from "./AssetContentSection";
 import AttachmentBox from "./AttachmentBox";
-import { EditableTitle } from "./EditableTitle";
 import HighlightsBox from "./HighlightsBox";
 import LinkContentSection from "./LinkContentSection";
 import { NoteEditor } from "./NoteEditor";
@@ -108,6 +109,7 @@ export default function BookmarkPreview({
   }
 
   const sourceUrl = getSourceUrl(bookmark);
+  const title = getBookmarkTitle(bookmark);
 
   return (
     <div className="grid h-full grid-rows-3 gap-2 overflow-hidden bg-background lg:grid-cols-3 lg:grid-rows-none">
@@ -116,7 +118,11 @@ export default function BookmarkPreview({
       </div>
       <div className="row-span-1  flex flex-col gap-4 overflow-auto bg-accent p-4 md:col-span-2 lg:col-span-1 lg:row-auto">
         <div className="flex w-full flex-col items-center justify-center gap-y-2">
-          <EditableTitle bookmark={bookmark} />
+          <div className="flex w-full items-center justify-center gap-2">
+            <p className="line-clamp-2 text-ellipsis break-words text-lg">
+              {title === undefined || title === "" ? "Untitled" : title}
+            </p>
+          </div>
           {sourceUrl && (
             <Link
               href={sourceUrl}