From 2b58c0cbe015b51e2ce4053701ae65b49d07cd31 Mon Sep 17 00:00:00 2001
From: johnny1093 <46250921+jsmorabito@users.noreply.github.com>
Date: Sat, 11 Jul 2026 09:31:00 -0400
Subject: [PATCH] fix: correct ribbon item property name and type
 WorkspaceRibbon.items

hidingViewer.tsx was already reading .title off left-ribbon items,
but leftRibbonManager.ts compared against a nonexistent .name
property. Combined with the self-compare bug fixed in 8c08808, that
means ribbon-item matching (used to recolor/remove a ribbon icon
when a command is edited or deleted) was effectively matching on
icon alone and never really checking the name/title at all - my
previous fix to i.name === pair.name would have made it match
nothing, since i.name doesn't exist on the real object. This fixes
it to compare i.title === pair.name, and adds a proper `items` type
to the WorkspaceRibbon module augmentation so this is now type-checked
instead of silently `any` behind @ts-expect-error.

Needs a manual check in Obsidian: add a left-ribbon command with a
custom color, confirm the ribbon icon picks up the color; delete a
left-ribbon command, confirm the correct icon (not another one
sharing its icon) is removed from the ribbon.
---
 src/manager/commands/leftRibbonManager.ts | 11 +++--------
 src/types.ts                              |  5 +++++
 src/ui/components/hidingViewer.tsx        |  1 -
 3 files changed, 8 insertions(+), 9 deletions(-)

diff --git a/src/manager/commands/leftRibbonManager.ts b/src/manager/commands/leftRibbonManager.ts
index 8de4122..6bde2b7 100644
--- a/src/manager/commands/leftRibbonManager.ts
+++ b/src/manager/commands/leftRibbonManager.ts
@@ -36,10 +36,8 @@ export default class LeftRibbonManager extends CommandManagerBase {
 			this.plugin.addRibbonIcon(pair.icon, pair.name, () =>
 				this.plugin.app.commands.executeCommandById(pair.id)
 			);
-			// @ts-expect-error
 			const nativeAction = this.plugin.app.workspace.leftRibbon.items.find(
-				// @ts-expect-error
-				(i) => i.icon === pair.icon && i.name === pair.name
+				(i) => i.icon === pair.icon && i.title === pair.name
 			);
 			if (nativeAction) {
 				nativeAction.buttonEl.style.color =
@@ -59,16 +57,13 @@ export default class LeftRibbonManager extends CommandManagerBase {
 			this.plugin.settings.leftRibbon.remove(pair);
 			await this.plugin.saveSettings();
 		}
-		// @ts-expect-error
 		const nativeAction = this.plugin.app.workspace.leftRibbon.items.find(
-			// @ts-expect-error
-			(i) => i.icon === pair.icon && i.name === pair.name
+			(i) => i.icon === pair.icon && i.title === pair.name
 		);
 		if (nativeAction) {
 			nativeAction.buttonEl.remove();
+			this.plugin.app.workspace.leftRibbon.items.remove(nativeAction);
 		}
-		// @ts-expect-error
-		this.plugin.app.workspace.leftRibbon.items.remove(nativeAction);
 	}
 
 	public reorder(): void {
diff --git a/src/types.ts b/src/types.ts
index 703ed7b..848583a 100644
--- a/src/types.ts
+++ b/src/types.ts
@@ -109,6 +109,11 @@ declare module "obsidian" {
 			title: string;
 			callback: () => void;
 		}[];
+		items: {
+			icon: string;
+			title: string;
+			buttonEl: HTMLElement;
+		}[];
 		collapseButtonEl: HTMLElement;
 		ribbonItemsEl: HTMLElement;
 		addRibbonItemButton: (
diff --git a/src/ui/components/hidingViewer.tsx b/src/ui/components/hidingViewer.tsx
index c4d552c..9b7356a 100644
--- a/src/ui/components/hidingViewer.tsx
+++ b/src/ui/components/hidingViewer.tsx
@@ -18,7 +18,6 @@ export function LeftRibbonHider({
 	const hiddenCommands = plugin.settings.hide.leftRibbon;
 	useEffect(() => {
 		setRibbonCommands(
-			// @ts-expect-error
 			plugin.app.workspace.leftRibbon.items.map((item) => ({
 				name: item.title,
 				icon: item.icon,