Add notes missing anki deck to status bar

Author: JesseWilliamson

src/main.ts

@@ -1,19 +1,24 @@
-import { Editor, Notice, Plugin } from "obsidian";
+import { Editor, Modal, Notice, Plugin, TFile, setIcon } from "obsidian";
 import {
 	DEFAULT_SETTINGS,
 	AnkiLinkSettings,
 	AnkiLinkSettingsTab,
 } from "./settings";
 import { syncVaultNotes } from "./syncUtil";
+import { FC_PREAMBLE_P } from "./regexUtil";
+
+const ANKI_LINK_ICON = "circle-question-mark";
 
 export default class AnkiLink extends Plugin {
 	settings!: AnkiLinkSettings;
+	private statusBarItemEl!: HTMLElement;
+	private statusBarRefreshToken = 0;
 
 	async onload() {
 		await this.loadSettings();
 
 		this.addRibbonIcon(
-			"circle-question-mark",
+			ANKI_LINK_ICON,
 			"Sample",
 			async (_evt: MouseEvent) => {
 				await this.runSyncAndNotify();
@@ -36,6 +41,28 @@ export default class AnkiLink extends Plugin {
 			},
 		});
 
+		this.statusBarItemEl = this.addStatusBarItem();
+		this.statusBarItemEl.addClass("anki-link-status");
+		this.statusBarItemEl.addClass("mod-clickable");
+		this.registerDomEvent(this.statusBarItemEl, "click", () => {
+			void this.showMissingDeckNotesModal();
+		});
+		void this.refreshStatusBar();
+
+		this.registerEvent(this.app.workspace.on("file-open", () => {
+			void this.refreshStatusBar();
+		}));
+		this.registerEvent(this.app.vault.on("modify", (file) => {
+			const activeFile = this.app.workspace.getActiveFile();
+			if (activeFile?.path !== file.path) return;
+			void this.refreshStatusBar();
+		}));
+		this.registerEvent(this.app.metadataCache.on("changed", (file) => {
+			const activeFile = this.app.workspace.getActiveFile();
+			if (activeFile?.path !== file.path) return;
+			void this.refreshStatusBar();
+		}));
+
 		this.addSettingTab(new AnkiLinkSettingsTab(this.app, this));
 	}
 
@@ -100,4 +127,121 @@ export default class AnkiLink extends Plugin {
 
 		return "Unknown error";
 	}
+
+	private async refreshStatusBar(): Promise<void> {
+		const refreshToken = ++this.statusBarRefreshToken;
+		const activeFile = this.app.workspace.getActiveFile();
+		if (activeFile?.extension !== "md") {
+			this.setStatusBarState("Anki: -");
+			return;
+		}
+
+		const hasFlashcards = await this.fileHasFlashcards(activeFile);
+		if (refreshToken !== this.statusBarRefreshToken) return;
+
+		const configuredDeck = this.getConfiguredDeck(activeFile);
+		if (!hasFlashcards) {
+			this.setStatusBarState("Anki: no cards");
+			return;
+		}
+		if (!configuredDeck) {
+			this.setStatusBarState("Anki: ⚠ deck missing", true);
+			return;
+		}
+		this.setStatusBarState(`Anki: ${configuredDeck}`);
+	}
+
+	private async fileHasFlashcards(file: TFile): Promise<boolean> {
+		const content = await this.app.vault.read(file);
+		return content
+			.split("\n")
+			.some((line) => FC_PREAMBLE_P.test(line));
+	}
+
+	private async showMissingDeckNotesModal(): Promise<void> {
+		const loadingNotice = new Notice("Checking notes for missing Anki deck...", 0);
+		try {
+			const missingDeckFiles = await this.findNotesMissingDeckNames();
+			new MissingDeckNotesModal(this, missingDeckFiles).open();
+		} finally {
+			loadingNotice.hide();
+		}
+	}
+
+	private async findNotesMissingDeckNames(): Promise<TFile[]> {
+		const markdownFiles = this.app.vault.getMarkdownFiles();
+		const missingDeckFiles: TFile[] = [];
+		for (const file of markdownFiles) {
+			if (this.getConfiguredDeck(file)) continue;
+			if (await this.fileHasFlashcards(file)) {
+				missingDeckFiles.push(file);
+			}
+		}
+		return missingDeckFiles;
+	}
+
+	private getConfiguredDeck(file: TFile): string | undefined {
+		const frontmatter = this.app.metadataCache.getFileCache(file)?.frontmatter;
+		if (!frontmatter) return undefined;
+		for (const [key, value] of Object.entries(frontmatter)) {
+			if (key.toLowerCase() !== "anki deck") continue;
+			if (typeof value !== "string") continue;
+			const trimmed = value.trim();
+			if (trimmed.length > 0) {
+				return trimmed;
+			}
+		}
+		return undefined;
+	}
+
+	private setStatusBarState(text: string, isWarning = false): void {
+		this.statusBarItemEl.empty();
+		this.statusBarItemEl.setAttribute("aria-label", text);
+		this.statusBarItemEl.setAttribute("title", text);
+		setIcon(this.statusBarItemEl, ANKI_LINK_ICON);
+		this.statusBarItemEl.style.color = isWarning ? "var(--text-error)" : "";
+	}
+}
+
+class MissingDeckNotesModal extends Modal {
+	constructor(
+		private readonly plugin: AnkiLink,
+		private readonly files: TFile[],
+	) {
+		super(plugin.app);
+	}
+
+	override onOpen(): void {
+		const { contentEl } = this;
+		contentEl.empty();
+		contentEl.createEl("h3", { text: "Notes missing Anki deck" });
+
+		if (this.files.length === 0) {
+			contentEl.createEl("p", { text: "No notes with flashcards are missing an Anki deck." });
+			return;
+		}
+
+		contentEl.createEl("p", {
+			text: `${this.files.length} note${this.files.length === 1 ? "" : "s"} found.`,
+		});
+		const listEl = contentEl.createEl("ul", { cls: "anki-link-missing-deck-list" });
+		for (const file of this.files) {
+			const itemEl = listEl.createEl("li");
+			const linkEl = itemEl.createEl("a", { text: file.path });
+			linkEl.href = "#";
+			linkEl.addEventListener("click", (event) => {
+				event.preventDefault();
+				void this.openFile(file);
+			});
+		}
+	}
+
+	override onClose(): void {
+		this.contentEl.empty();
+	}
+
+	private async openFile(file: TFile): Promise<void> {
+		await this.plugin.app.workspace.getLeaf(true).openFile(file);
+		this.close();
+	}
 }

styles.css

@@ -10,3 +10,7 @@ If your plugin does not need CSS, delete this file.
     --callout-color: 2, 122, 255;
     --callout-icon: lucide-circle-question-mark;
 }
+
+.anki-link-missing-deck-list li {
+    margin-top: 0.25rem;
+}