aboutsummaryrefslogtreecommitdiffstats
path: root/packages/web/app/dashboard/preview
diff options
context:
space:
mode:
Diffstat (limited to 'packages/web/app/dashboard/preview')
-rw-r--r--packages/web/app/dashboard/preview/[bookmarkId]/components/BookmarkPreview.tsx101
-rw-r--r--packages/web/app/dashboard/preview/[bookmarkId]/page.tsx2
2 files changed, 1 insertions, 102 deletions
diff --git a/packages/web/app/dashboard/preview/[bookmarkId]/components/BookmarkPreview.tsx b/packages/web/app/dashboard/preview/[bookmarkId]/components/BookmarkPreview.tsx
deleted file mode 100644
index 2a8ae1b1..00000000
--- a/packages/web/app/dashboard/preview/[bookmarkId]/components/BookmarkPreview.tsx
+++ /dev/null
@@ -1,101 +0,0 @@
-"use client";
-
-import { BackButton } from "@/components/ui/back-button";
-import { Skeleton } from "@/components/ui/skeleton";
-import { isBookmarkStillCrawling } from "@/lib/bookmarkUtils";
-import { api } from "@/lib/trpc";
-import { ZBookmark } from "@hoarder/trpc/types/bookmarks";
-import { ArrowLeftCircle, CalendarDays, ExternalLink } from "lucide-react";
-import Link from "next/link";
-import Markdown from "react-markdown";
-
-export default function BookmarkPreview({
- initialData,
-}: {
- initialData: ZBookmark;
-}) {
- const { data: bookmark } = api.bookmarks.getBookmark.useQuery(
- {
- bookmarkId: initialData.id,
- },
- {
- initialData,
- refetchInterval: (query) => {
- const data = query.state.data;
- if (!data) {
- return false;
- }
- // If the link is not crawled or not tagged
- if (isBookmarkStillCrawling(data)) {
- return 1000;
- }
- return false;
- },
- },
- );
-
- const linkHeader = bookmark.content.type == "link" && (
- <div className="flex flex-col space-y-2">
- <p className="text-center text-3xl">
- {bookmark.content.title || bookmark.content.url}
- </p>
- <Link href={bookmark.content.url} className="mx-auto flex gap-2">
- <span className="my-auto">View Original</span>
- <ExternalLink />
- </Link>
- </div>
- );
-
- let content;
- switch (bookmark.content.type) {
- case "link": {
- if (!bookmark.content.htmlContent) {
- content = (
- <div className="text-red-500">Failed to fetch link content ...</div>
- );
- } else {
- content = (
- <div
- dangerouslySetInnerHTML={{
- __html: bookmark.content.htmlContent || "",
- }}
- className="prose"
- />
- );
- }
- break;
- }
- case "text": {
- content = <Markdown className="prose">{bookmark.content.text}</Markdown>;
- break;
- }
- }
-
- return (
- <div className="bg-background m-4 min-h-screen space-y-4 rounded-md border p-4">
- <div className="flex justify-between">
- <BackButton className="ghost" variant="ghost">
- <ArrowLeftCircle />
- </BackButton>
- <div className="my-auto">
- <span className="my-auto flex gap-2">
- <CalendarDays /> {bookmark.createdAt.toLocaleString()}
- </span>
- </div>
- </div>
- <hr />
- {linkHeader}
- <div className="mx-auto flex h-full border-x p-2 px-4 lg:w-2/3">
- {isBookmarkStillCrawling(bookmark) ? (
- <div className="flex w-full flex-col gap-2">
- <Skeleton className="h-4" />
- <Skeleton className="h-4" />
- <Skeleton className="h-4" />
- </div>
- ) : (
- content
- )}
- </div>
- </div>
- );
-}
diff --git a/packages/web/app/dashboard/preview/[bookmarkId]/page.tsx b/packages/web/app/dashboard/preview/[bookmarkId]/page.tsx
index 47aeb891..707d2b69 100644
--- a/packages/web/app/dashboard/preview/[bookmarkId]/page.tsx
+++ b/packages/web/app/dashboard/preview/[bookmarkId]/page.tsx
@@ -1,5 +1,5 @@
import { api } from "@/server/api/client";
-import BookmarkPreview from "./components/BookmarkPreview";
+import BookmarkPreview from "@/components/dashboard/bookmarks/BookmarkPreview";
export default async function BookmarkPreviewPage({
params,