From 09652176f97f11bc06f4c9b57a448e14744eac12 Mon Sep 17 00:00:00 2001
From: Mohamed Bassem <me@mbassem.com>
Date: Sat, 24 May 2025 12:59:43 +0000
Subject: feat: Allow defaulting to reader mode when clicking on bookmarks.
 Fixes #662

---
 .../components/dashboard/bookmarks/LinkCard.tsx    | 26 +++++++++++++++++-----
 1 file changed, 21 insertions(+), 5 deletions(-)

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

diff --git a/apps/web/components/dashboard/bookmarks/LinkCard.tsx b/apps/web/components/dashboard/bookmarks/LinkCard.tsx
index ec224ca6..2c91bd08 100644
--- a/apps/web/components/dashboard/bookmarks/LinkCard.tsx
+++ b/apps/web/components/dashboard/bookmarks/LinkCard.tsx
@@ -2,6 +2,7 @@
 
 import Image from "next/image";
 import Link from "next/link";
+import { useUserSettings } from "@/lib/userSettings";
 
 import type { ZBookmarkTypeLink } from "@karakeep/shared/types/bookmarks";
 import {
@@ -14,11 +15,25 @@ import {
 import { BookmarkLayoutAdaptingCard } from "./BookmarkLayoutAdaptingCard";
 import FooterLinkURL from "./FooterLinkURL";
 
+const useOnClickUrl = (bookmark: ZBookmarkTypeLink) => {
+  const userSettings = useUserSettings();
+  return {
+    urlTarget:
+      userSettings.bookmarkClickAction === "open_original_link"
+        ? ("_blank" as const)
+        : ("_self" as const),
+    onClickUrl:
+      userSettings.bookmarkClickAction === "expand_bookmark_preview"
+        ? `/dashboard/preview/${bookmark.id}`
+        : bookmark.content.url,
+  };
+};
+
 function LinkTitle({ bookmark }: { bookmark: ZBookmarkTypeLink }) {
-  const link = bookmark.content;
-  const parsedUrl = new URL(link.url);
+  const { onClickUrl, urlTarget } = useOnClickUrl(bookmark);
+  const parsedUrl = new URL(bookmark.content.url);
   return (
-    <Link href={link.url} target="_blank" rel="noreferrer">
+    <Link href={onClickUrl} target={urlTarget} rel="noreferrer">
       {getBookmarkTitle(bookmark) ?? parsedUrl.host}
     </Link>
   );
@@ -31,6 +46,7 @@ function LinkImage({
   bookmark: ZBookmarkTypeLink;
   className?: string;
 }) {
+  const { onClickUrl, urlTarget } = useOnClickUrl(bookmark);
   const link = bookmark.content;
 
   const imgComponent = (url: string, unoptimized: boolean) => (
@@ -61,8 +77,8 @@ function LinkImage({
 
   return (
     <Link
-      href={link.url}
-      target="_blank"
+      href={onClickUrl}
+      target={urlTarget}
       rel="noreferrer"
       className={className}
     >
-- 
cgit v1.2.3-70-g09d2

