From 79d61be7e15dc5d23fb687a5f71e0097088a99ac Mon Sep 17 00:00:00 2001
From: MohamedBassem <me@mbassem.com>
Date: Sun, 7 Apr 2024 18:30:00 +0100
Subject: feature: Extract hook logic into separate package and add a new
 action bar in bookmark preview

---
 .../dashboard/preview/TextContentSection.tsx       | 39 ++++++++++++++++++++++
 1 file changed, 39 insertions(+)
 create mode 100644 apps/web/components/dashboard/preview/TextContentSection.tsx

(limited to 'apps/web/components/dashboard/preview/TextContentSection.tsx')

diff --git a/apps/web/components/dashboard/preview/TextContentSection.tsx b/apps/web/components/dashboard/preview/TextContentSection.tsx
new file mode 100644
index 00000000..35ee1b33
--- /dev/null
+++ b/apps/web/components/dashboard/preview/TextContentSection.tsx
@@ -0,0 +1,39 @@
+import { ScrollArea } from "@radix-ui/react-scroll-area";
+import Markdown from "react-markdown";
+
+import type { ZBookmark } from "@hoarder/trpc/types/bookmarks";
+
+export function TextContentSection({ bookmark }: { bookmark: ZBookmark }) {
+  let content;
+  switch (bookmark.content.type) {
+    case "link": {
+      if (!bookmark.content.htmlContent) {
+        content = (
+          <div className="text-destructive">
+            Failed to fetch link content ...
+          </div>
+        );
+      } else {
+        content = (
+          <div
+            dangerouslySetInnerHTML={{
+              __html: bookmark.content.htmlContent || "",
+            }}
+            className="prose mx-auto dark:prose-invert"
+          />
+        );
+      }
+      break;
+    }
+    case "text": {
+      content = (
+        <Markdown className="prose mx-auto dark:prose-invert">
+          {bookmark.content.text}
+        </Markdown>
+      );
+      break;
+    }
+  }
+
+  return <ScrollArea className="h-full">{content}</ScrollArea>;
+}
-- 
cgit v1.2.3-70-g09d2

