feature: Persevere the source URL of clipped texts from the extension.

Fixes #448

4 files changed, 35 insertions, 18 deletions

diff --git a/apps/web/components/dashboard/bookmarks/AssetCard.tsx b/apps/web/components/dashboard/bookmarks/AssetCard.tsx
index c235e4c8..61b3bc8d 100644
--- a/apps/web/components/dashboard/bookmarks/AssetCard.tsx
+++ b/apps/web/components/dashboard/bookmarks/AssetCard.tsx
@@ -5,8 +5,10 @@ import Link from "next/link";
 
 import type { ZBookmarkTypeAsset } from "@hoarder/shared/types/bookmarks";
 import { getAssetUrl } from "@hoarder/shared-react/utils/assetUtils";
+import { getSourceUrl } from "@hoarder/shared-react/utils/bookmarkUtils";
 
 import { BookmarkLayoutAdaptingCard } from "./BookmarkLayoutAdaptingCard";
+import FooterLinkURL from "./FooterLinkURL";
 
 function AssetImage({
   bookmark,
@@ -55,7 +57,11 @@ export default function AssetCard({
   return (
     <BookmarkLayoutAdaptingCard
       title={bookmarkedAsset.title ?? bookmarkedAsset.content.fileName}
-      footer={null}
+      footer={
+        getSourceUrl(bookmarkedAsset) && (
+          <FooterLinkURL url={getSourceUrl(bookmarkedAsset)} />
+        )
+      }
       bookmark={bookmarkedAsset}
       className={className}
       wrapTags={true}
diff --git a/apps/web/components/dashboard/bookmarks/FooterLinkURL.tsx b/apps/web/components/dashboard/bookmarks/FooterLinkURL.tsx
new file mode 100644
index 00000000..cc91a7e7
--- /dev/null
+++ b/apps/web/components/dashboard/bookmarks/FooterLinkURL.tsx
@@ -0,0 +1,18 @@
+import Link from "next/link";
+
+export default function FooterLinkURL({ url }: { url: string | null }) {
+  if (!url) {
+    return null;
+  }
+  const parsedUrl = new URL(url);
+  return (
+    <Link
+      className="line-clamp-1 hover:text-foreground"
+      href={url}
+      target="_blank"
+      rel="noreferrer"
+    >
+      {parsedUrl.host}
+    </Link>
+  );
+}
diff --git a/apps/web/components/dashboard/bookmarks/LinkCard.tsx b/apps/web/components/dashboard/bookmarks/LinkCard.tsx
index dc189b10..86eed9e7 100644
--- a/apps/web/components/dashboard/bookmarks/LinkCard.tsx
+++ b/apps/web/components/dashboard/bookmarks/LinkCard.tsx
@@ -6,10 +6,12 @@ import Link from "next/link";
 import type { ZBookmarkTypeLink } from "@hoarder/shared/types/bookmarks";
 import {
   getBookmarkLinkImageUrl,
+  getSourceUrl,
   isBookmarkStillCrawling,
 } from "@hoarder/shared-react/utils/bookmarkUtils";
 
 import { BookmarkLayoutAdaptingCard } from "./BookmarkLayoutAdaptingCard";
+import FooterLinkURL from "./FooterLinkURL";
 
 function LinkTitle({ bookmark }: { bookmark: ZBookmarkTypeLink }) {
   const link = bookmark.content;
@@ -68,21 +70,6 @@ function LinkImage({
   );
 }
 
-function LinkUrl({ bookmark }: { bookmark: ZBookmarkTypeLink }) {
-  const link = bookmark.content;
-  const parsedUrl = new URL(link.url);
-  return (
-    <Link
-      className="line-clamp-1 hover:text-foreground"
-      href={link.url}
-      target="_blank"
-      rel="noreferrer"
-    >
-      {parsedUrl.host}
-    </Link>
-  );
-}
-
 export default function LinkCard({
   bookmark: bookmarkLink,
   className,
@@ -93,7 +80,7 @@ export default function LinkCard({
   return (
     <BookmarkLayoutAdaptingCard
       title={<LinkTitle bookmark={bookmarkLink} />}
-      footer={<LinkUrl bookmark={bookmarkLink} />}
+      footer={<FooterLinkURL url={getSourceUrl(bookmarkLink)} />}
       bookmark={bookmarkLink}
       wrapTags={false}
       image={(_layout, className) => (
diff --git a/apps/web/components/dashboard/bookmarks/TextCard.tsx b/apps/web/components/dashboard/bookmarks/TextCard.tsx
index 9876d904..9d6c1df1 100644
--- a/apps/web/components/dashboard/bookmarks/TextCard.tsx
+++ b/apps/web/components/dashboard/bookmarks/TextCard.tsx
@@ -5,8 +5,10 @@ import { bookmarkLayoutSwitch } from "@/lib/userLocalSettings/bookmarksLayout";
 import { cn } from "@/lib/utils";
 
 import type { ZBookmarkTypeText } from "@hoarder/shared/types/bookmarks";
+import { getSourceUrl } from "@hoarder/shared-react/utils/bookmarkUtils";
 
 import { BookmarkLayoutAdaptingCard } from "./BookmarkLayoutAdaptingCard";
+import FooterLinkURL from "./FooterLinkURL";
 
 export default function TextCard({
   bookmark,
@@ -22,7 +24,11 @@ export default function TextCard({
       <BookmarkLayoutAdaptingCard
         title={bookmark.title}
         content={<MarkdownComponent>{bookmarkedText.text}</MarkdownComponent>}
-        footer={null}
+        footer={
+          getSourceUrl(bookmark) && (
+            <FooterLinkURL url={getSourceUrl(bookmark)} />
+          )
+        }
         wrapTags={true}
         bookmark={bookmark}
         className={className}