From e99dee0b4f7220568c8ffa2755147bc45d35b32b Mon Sep 17 00:00:00 2001
From: MohamedBassem <me@mbassem.com>
Date: Sat, 30 Mar 2024 04:45:42 +0000
Subject: feature(web): Add support for attaching notes to bookmarks

---
 apps/web/components/dashboard/bookmarks/BookmarkPreview.tsx | 10 ++++++++--
 1 file changed, 8 insertions(+), 2 deletions(-)

(limited to 'apps/web/components/dashboard/bookmarks/BookmarkPreview.tsx')

diff --git a/apps/web/components/dashboard/bookmarks/BookmarkPreview.tsx b/apps/web/components/dashboard/bookmarks/BookmarkPreview.tsx
index 74c49ddd..102e0788 100644
--- a/apps/web/components/dashboard/bookmarks/BookmarkPreview.tsx
+++ b/apps/web/components/dashboard/bookmarks/BookmarkPreview.tsx
@@ -24,6 +24,7 @@ import Markdown from "react-markdown";
 
 import type { ZBookmark } from "@hoarder/trpc/types/bookmarks";
 
+import { NoteEditor } from "./NoteEditor";
 import { TagsEditor } from "./TagsEditor";
 
 dayjs.extend(relativeTime);
@@ -198,12 +199,17 @@ export default function BookmarkPreview({
       <div className="row-span-2 h-full w-full overflow-hidden p-2 md:col-span-2 lg:row-auto">
         {isBookmarkStillCrawling(bookmark) ? <ContentLoading /> : content}
       </div>
-      <div className="lg:col-span1 row-span-1 flex flex-col gap-4 bg-accent p-4 lg:row-auto">
+      <div className="lg:col-span1 row-span-1 flex flex-col gap-4 overflow-auto bg-accent p-4 lg:row-auto">
         {linkHeader}
         <CreationTime createdAt={bookmark.createdAt} />
-        <div className="flex gap-2">
+        <div className="flex gap-4">
+          <p className="text-sm text-gray-400">Tags</p>
           <TagsEditor bookmark={bookmark} />
         </div>
+        <div className="flex gap-4">
+          <p className="text-sm text-gray-400">Note</p>
+          <NoteEditor bookmark={bookmark} />
+        </div>
       </div>
     </div>
   );
-- 
cgit v1.2.3-70-g09d2