From 212d3acce3d39bd72f82acbc396e2726c740df38 Mon Sep 17 00:00:00 2001
From: Evan Fiordeliso <evan.fiordeliso@gmail.com>
Date: Mon, 7 Jul 2025 22:10:09 -0400
Subject: [PATCH] Fix file links

---
 .../ReadingLogCodeBlockView.svelte            | 16 ++++++-------
 .../ReadingStatsCodeBlockView.svelte          |  2 ++
 src/ui/code-blocks/ShelfCodeBlockView.svelte  |  6 ++---
 src/ui/components/DetailsView.svelte          |  5 ++--
 src/ui/components/OpenFileLink.svelte         | 23 +++++++++++++++++++
 src/ui/components/TableView.svelte            |  5 ++--
 src/ui/stores/app.ts                          | 12 ++++++++++
 7 files changed, 53 insertions(+), 16 deletions(-)
 create mode 100644 src/ui/components/OpenFileLink.svelte
 create mode 100644 src/ui/stores/app.ts

diff --git a/src/ui/code-blocks/ReadingLogCodeBlockView.svelte b/src/ui/code-blocks/ReadingLogCodeBlockView.svelte
index 7c720de..fd75f4c 100644
--- a/src/ui/code-blocks/ReadingLogCodeBlockView.svelte
+++ b/src/ui/code-blocks/ReadingLogCodeBlockView.svelte
@@ -6,17 +6,15 @@
 	import { createReadingLog } from "@ui/stores/reading-log.svelte";
 	import { ALL_TIME } from "@ui/stores/date-filter.svelte";
 	import { onDestroy } from "svelte";
-	import { getLinkpath } from "obsidian";
+	import OpenFileLink from "@ui/components/OpenFileLink.svelte";
+	import { setAppContext } from "@ui/stores/app";
 
 	interface Props {
 		plugin: BookTrackerPlugin;
 	}
 
 	const { plugin }: Props = $props();
-
-	function bookUri(book: string) {
-		return getLinkpath(book + ".md");
-	}
+	setAppContext(plugin.app);
 
 	const store = createReadingLog(plugin.readingLog);
 	onDestroy(() => store.destroy());
@@ -95,9 +93,11 @@
 			{#each store.entries as entry}
 				<tr>
 					<td class="date">{entry.createdAt.format("YYYY-MM-DD")}</td>
-					<td class="book"
-						><a href={bookUri(entry.book)}>{entry.book}</a></td
-					>
+					<td class="book">
+						<OpenFileLink file={entry.book + ".md"}>
+							{entry.book}
+						</OpenFileLink>
+					</td>
 					<td class="pages-read">{entry.pagesRead}</td>
 					<td class="percent-complete">
 						{Math.round(
diff --git a/src/ui/code-blocks/ReadingStatsCodeBlockView.svelte b/src/ui/code-blocks/ReadingStatsCodeBlockView.svelte
index 19eaa73..68c479d 100644
--- a/src/ui/code-blocks/ReadingStatsCodeBlockView.svelte
+++ b/src/ui/code-blocks/ReadingStatsCodeBlockView.svelte
@@ -27,6 +27,7 @@
 		createReadingLog,
 		setReadingLogContext,
 	} from "@ui/stores/reading-log.svelte";
+	import { setAppContext } from "@ui/stores/app";
 
 	interface Props {
 		plugin: BookTrackerPlugin;
@@ -34,6 +35,7 @@
 	}
 
 	const { plugin, source }: Props = $props();
+	setAppContext(plugin.app);
 
 	const settingsStore = createSettings(plugin);
 	setSettingsContext(settingsStore);
diff --git a/src/ui/code-blocks/ShelfCodeBlockView.svelte b/src/ui/code-blocks/ShelfCodeBlockView.svelte
index b376287..6babdee 100644
--- a/src/ui/code-blocks/ShelfCodeBlockView.svelte
+++ b/src/ui/code-blocks/ShelfCodeBlockView.svelte
@@ -16,10 +16,7 @@
 	import BookshelfView from "@ui/components/BookshelfView.svelte";
 	import TableView from "@ui/components/TableView.svelte";
 	import DetailsView from "@ui/components/DetailsView.svelte";
-	import {
-		createReadingLog,
-		setReadingLogContext,
-	} from "@ui/stores/reading-log.svelte";
+	import { setAppContext } from "@ui/stores/app";
 
 	interface Props {
 		plugin: BookTrackerPlugin;
@@ -27,6 +24,7 @@
 	}
 
 	const { plugin, source }: Props = $props();
+	setAppContext(plugin.app);
 
 	const settings = ShelfSettingsSchema.parse(parseYaml(source));
 
diff --git a/src/ui/components/DetailsView.svelte b/src/ui/components/DetailsView.svelte
index e87277e..bb79691 100644
--- a/src/ui/components/DetailsView.svelte
+++ b/src/ui/components/DetailsView.svelte
@@ -7,6 +7,7 @@
 	import type { ShelfSettings } from "@ui/code-blocks/ShelfCodeBlock";
 	import { Dot, Flame, Star, StarHalf } from "lucide-svelte";
 	import RatingInput from "./RatingInput.svelte";
+	import OpenFileLink from "./OpenFileLink.svelte";
 
 	interface Props {
 		plugin: BookTrackerPlugin;
@@ -53,11 +54,11 @@
 				alt={title}
 			/>
 			<div class="book-info">
-				<a href={getLinkpath(book.file.path)}>
+				<OpenFileLink file={book.file}>
 					<h2 class="book-title">
 						{title}
 					</h2>
-				</a>
+				</OpenFileLink>
 				{#if subtitle}
 					<p class="subtitle">{subtitle}</p>
 				{/if}
diff --git a/src/ui/components/OpenFileLink.svelte b/src/ui/components/OpenFileLink.svelte
new file mode 100644
index 0000000..5441586
--- /dev/null
+++ b/src/ui/components/OpenFileLink.svelte
@@ -0,0 +1,23 @@
+<script lang="ts">
+	import { getLinkpath, TFile } from "obsidian";
+	import type { Snippet } from "svelte";
+
+	interface Props {
+		children?: Snippet;
+		file: TFile | string;
+	}
+
+	let { children, file }: Props = $props();
+
+	function makeUri(path: string) {
+		return `obsidian://open?file=${encodeURIComponent(path)}`;
+	}
+
+	const href = $derived(
+		makeUri(file instanceof TFile ? file.path : getLinkpath(file)),
+	);
+</script>
+
+<a {href}>
+	{@render children?.()}
+</a>
diff --git a/src/ui/components/TableView.svelte b/src/ui/components/TableView.svelte
index b2bc17b..5997e70 100644
--- a/src/ui/components/TableView.svelte
+++ b/src/ui/components/TableView.svelte
@@ -6,6 +6,7 @@
 	import { getLinkpath } from "obsidian";
 	import Rating from "@ui/components/Rating.svelte";
 	import type { ShelfSettings } from "@ui/code-blocks/ShelfCodeBlock";
+	import OpenFileLink from "./OpenFileLink.svelte";
 
 	interface Props {
 		plugin: BookTrackerPlugin;
@@ -70,9 +71,9 @@
 					/>
 				</td>
 				<td>
-					<a href={getLinkpath(book.file.path)}>
+					<OpenFileLink file={book.file}>
 						{title}
-					</a>
+					</OpenFileLink>
 				</td>
 				<td>
 					{authors.join(", ")}
diff --git a/src/ui/stores/app.ts b/src/ui/stores/app.ts
new file mode 100644
index 0000000..2226216
--- /dev/null
+++ b/src/ui/stores/app.ts
@@ -0,0 +1,12 @@
+import type { App } from "obsidian";
+import { getContext, setContext } from "svelte";
+
+const APP_KEY = Symbol("app");
+
+export function setAppContext(app: App) {
+	setContext(APP_KEY, app);
+}
+
+export function getAppContext(): App {
+	return getContext(APP_KEY);
+}