Hide Commands of other Plugins

manifest.json

@@ -1,7 +1,7 @@
 {
 	"id": "cmdr",
 	"name": "Commander",
-	"version": "0.0.8",
+	"version": "0.0.9",
 	"minAppVersion": "0.12.0",
 	"description": "Customize your workspace by adding commands /everywhere/.",
 	"author": "jsmorabito & phibr0",

package.json

@@ -1,6 +1,6 @@
 {
 	"name": "cmdr",
-	"version": "0.0.8",
+	"version": "0.0.9",
 	"description": "Customize your workspace by adding commands /everywhere/.",
 	"main": "main.js",
 	"scripts": {

src/constants.ts

@@ -12,6 +12,10 @@ export const DEFAULT_SETTINGS: CommanderSettings = {
 	statusBar: [],
 	pageHeader: [],
 	macros: [],
+	hide: {
+		statusbar: [],
+		leftRibbon: []
+	}
 };
 
 export const ICON_LIST = ["activity", "airplay", "alarm-check", "alarm-clock-off", "alarm-clock", "alarm-minus", "alarm-plus", "album", "alert-circle", "alert-octagon", "alert-triangle", "align-center-horizontal", "align-center-vertical", "align-center", "align-end-horizontal", "align-end-vertical", "align-horizontal-distribute-center", "align-horizontal-distribute-end", "align-horizontal-distribute-start", "align-horizontal-justify-center", "align-horizontal-justify-end", "align-horizontal-justify-start", "align-horizontal-space-around", "align-horizontal-space-between", "align-justify", "align-left", "align-right", "align-start-horizontal", "align-start-vertical", "align-vertical-distribute-center", "align-vertical-distribute-end", "align-vertical-distribute-start", "align-vertical-justify-center", "align-vertical-justify-end", "align-vertical-justify-start", "align-vertical-space-around", "align-vertical-space-between", "anchor", "aperture", "archive", "arrow-big-down", "arrow-big-left", "arrow-big-right", "arrow-big-up", "arrow-down-circle", "arrow-down-left", "arrow-down-right", "arrow-down", "arrow-left-circle", "arrow-left-right", "arrow-left", "arrow-right-circle", "arrow-right", "arrow-up-circle", "arrow-up-left", "arrow-up-right", "arrow-up", "asterisk", "at-sign", "award", "axe", "banknote", "bar-chart-2", "bar-chart", "baseline", "battery-charging", "battery-full", "battery-low", "battery-medium", "battery", "beaker", "bell-minus", "bell-off", "bell-plus", "bell-ring", "bell", "bike", "binary", "bitcoin", "bluetooth-connected", "bluetooth-off", "bluetooth-searching", "bluetooth", "bold", "book-open", "book", "bookmark-minus", "bookmark-plus", "bookmark", "bot", "box-select", "box", "briefcase", "brush", "bug", "building-2", "building", "bus", "calculator", "calendar", "camera-off", "camera", "car", "carrot", "cast", "check-circle-2", "check-circle", "check-square", "check", "chevron-down", "chevron-first", "chevron-last", "chevron-left", "chevron-right", "chevron-up", "chevrons-down-up", "chevrons-down", "chevrons-left", "chevrons-right", "chevrons-up-down", "chevrons-up", "chrome", "circle-slashed", "circle", "clipboard-check", "clipboard-copy", "clipboard-list", "clipboard-x", "clipboard", "clock-1", "clock-10", "clock-11", "clock-12", "clock-2", "clock-3", "clock-4", "clock-5", "clock-6", "clock-7", "clock-8", "clock-9", "lucide-clock", "cloud-drizzle", "cloud-fog", "cloud-hail", "cloud-lightning", "cloud-moon", "cloud-off", "cloud-rain-wind", "cloud-rain", "cloud-snow", "cloud-sun", "lucide-cloud", "cloudy", "clover", "code-2", "code", "codepen", "codesandbox", "coffee", "coins", "columns", "command", "compass", "contact", "contrast", "cookie", "copy", "copyleft", "copyright", "corner-down-left", "corner-down-right", "corner-left-down", "corner-left-up", "corner-right-down", "corner-right-up", "corner-up-left", "corner-up-right", "cpu", "credit-card", "crop", "lucide-cross", "crosshair", "crown", "currency", "database", "delete", "dice-1", "dice-2", "dice-3", "dice-4", "dice-5", "dice-6", "disc", "divide-circle", "divide-square", "divide", "dollar-sign", "download-cloud", "download", "dribbble", "droplet", "droplets", "drumstick", "edit-2", "edit-3", "edit", "egg", "equal-not", "equal", "eraser", "euro", "expand", "external-link", "eye-off", "eye", "facebook", "fast-forward", "feather", "figma", "file-check-2", "file-check", "file-code", "file-digit", "file-input", "file-minus-2", "file-minus", "file-output", "file-plus-2", "file-plus", "file-search", "file-text", "file-x-2", "file-x", "file", "files", "film", "filter", "flag-off", "flag-triangle-left", "flag-triangle-right", "flag", "flame", "flashlight-off", "flashlight", "flask-conical", "flask-round", "folder-minus", "folder-open", "folder-plus", "lucide-folder", "form-input", "forward", "frame", "framer", "frown", "function-square", "gamepad-2", "gamepad", "gauge", "gavel", "gem", "ghost", "gift", "git-branch-plus", "git-branch", "git-commit", "git-fork", "git-merge", "git-pull-request", "github", "gitlab", "glasses", "globe-2", "globe", "grab", "graduation-cap", "grid", "grip-horizontal", "grip-vertical", "hammer", "hand-metal", "hand", "hard-drive", "hard-hat", "hash", "haze", "headphones", "heart", "help-circle", "hexagon", "highlighter", "history", "home", "image-minus", "image-off", "image-plus", "image", "import", "inbox", "indent", "indian-rupee", "infinity", "lucide-info", "inspect", "instagram", "italic", "japanese-yen", "key", "keyboard", "landmark", "lucide-languages", "laptop-2", "laptop", "lasso-select", "lasso", "layers", "layout-dashboard", "layout-grid", "layout-list", "layout-template", "layout", "library", "life-buoy", "lightbulb-off", "lightbulb", "link-2-off", "link-2", "lucide-link", "linkedin", "list-checks", "list-minus", "list-ordered", "list-plus", "list-x", "list", "loader-2", "loader", "locate-fixed", "locate-off", "locate", "lock", "log-in", "log-out", "mail", "map-pin", "map", "maximize-2", "maximize", "megaphone", "meh", "menu", "message-circle", "message-square", "mic-off", "mic", "minimize-2", "minimize", "minus-circle", "minus-square", "minus", "monitor-off", "monitor-speaker", "monitor", "moon", "more-horizontal", "more-vertical", "mountain-snow", "mountain", "mouse-pointer-2", "mouse-pointer-click", "mouse-pointer", "mouse", "move-diagonal-2", "move-diagonal", "move-horizontal", "move-vertical", "move", "music", "navigation-2", "navigation", "network", "octagon", "option", "outdent", "package-check", "package-minus", "package-plus", "package-search", "package-x", "package", "palette", "palmtree", "paperclip", "pause-circle", "pause-octagon", "pause", "pen-tool", "lucide-pencil", "percent", "person-standing", "phone-call", "phone-forwarded", "phone-incoming", "phone-missed", "phone-off", "phone-outgoing", "phone", "pie-chart", "piggy-bank", "lucide-pin", "pipette", "plane", "play-circle", "play", "plug-zap", "plus-circle", "plus-square", "plus", "pocket", "podcast", "pointer", "pound-sterling", "power-off", "power", "printer", "qr-code", "quote", "radio-receiver", "radio", "redo", "refresh-ccw", "refresh-cw", "regex", "repeat-1", "repeat", "reply-all", "reply", "rewind", "rocket", "rocking-chair", "rotate-ccw", "rotate-cw", "rss", "ruler", "russian-ruble", "save", "scale", "scan-line", "scan", "scissors", "screen-share-off", "screen-share", "lucide-search", "send", "separator-horizontal", "separator-vertical", "server-crash", "server-off", "server", "settings-2", "settings", "share-2", "share", "sheet", "shield-alert", "shield-check", "shield-close", "shield-off", "shield", "shirt", "shopping-bag", "shopping-cart", "shovel", "shrink", "shuffle", "sidebar-close", "sidebar-open", "sidebar", "sigma", "signal-high", "signal-low", "signal-medium", "signal-zero", "signal", "skip-back", "skip-forward", "skull", "slack", "slash", "sliders", "smartphone-charging", "smartphone", "smile", "snowflake", "sort-asc", "sort-desc", "speaker", "sprout", "square", "star-half", "lucide-star", "stop-circle", "stretch-horizontal", "stretch-vertical", "strikethrough", "subscript", "sun", "sunrise", "sunset", "superscript", "swiss-franc", "switch-camera", "table", "tablet", "tag", "target", "tent", "terminal-square", "terminal", "text-cursor-input", "text-cursor", "thermometer-snowflake", "thermometer-sun", "thermometer", "thumbs-down", "thumbs-up", "ticket", "timer-off", "timer-reset", "timer", "toggle-left", "toggle-right", "tornado", "trash-2", "lucide-trash", "trello", "trending-down", "trending-up", "triangle", "truck", "tv-2", "tv", "twitch", "twitter", "type", "umbrella", "underline", "undo", "unlink-2", "unlink", "unlock", "upload-cloud", "upload", "user-check", "user-minus", "user-plus", "user-x", "user", "users", "verified", "vibrate", "video-off", "video", "view", "voicemail", "volume-1", "volume-2", "volume-x", "volume", "wallet", "wand", "watch", "waves", "webcam", "wifi-off", "wifi", "wind", "wrap-text", "wrench", "x-circle", "x-octagon", "x-square", "x", "youtube", "zap-off", "zap", "zoom-in", "zoom-out", "search-large"];

src/main.ts

@@ -1,18 +1,22 @@
 import { Plugin } from 'obsidian';
 import { DEFAULT_SETTINGS } from './constants';
 import t from './l10n';
-import { EditorMenuCommandManager, FileMenuCommandManager } from './manager/menuManager';
-import PageHeaderManager from './manager/pageHeaderManager';
-import RibbonManager from './manager/ribbonManager';
-import StatusBarManager from './manager/statusBarManager';
-import TitleBarManager from './manager/titleBarManager';
+import {
+	EditorMenuCommandManager,
+	FileMenuCommandManager,
+	PageHeaderManager,
+	RibbonManager,
+	StatusBarManager,
+	TitleBarManager,
+} from "./manager/commands";
 import { CommanderSettings, Macro } from './types';
 import MacroModal from './ui/macroModal';
 import CommanderSettingTab from './ui/settingTab';
 import SettingTabModal from './ui/settingTabModal';
 
 import 'beautiful-react-diagrams/styles.css';
 import "./styles.scss";
+import { updateHiderStylesheet } from './util';
 
 export default class CommanderPlugin extends Plugin {
 	public settings: CommanderSettings;
@@ -60,6 +64,12 @@ export default class CommanderPlugin extends Plugin {
 		this.registerEvent(
 			app.workspace.on('file-menu', this.manager.fileMenu.applyFileMenuCommands(this)),
 		);
+
+		updateHiderStylesheet(this.settings);
+	}
+
+	public onunload(): void {
+		document.head.querySelector("style#cmdr")?.remove();
 	}
 
 	// Macros become quite large objects, because we are saving the whole flowchart state (including position, etc.)

src/manager/_commandManager.ts → src/manager/commands/commandManager.ts

@@ -1,7 +1,7 @@
 import CommanderPlugin from "src/main";
 import { CommandIconPair } from "src/types";
 
-export default abstract class CommandManager {
+export default abstract class CommandManagerBase {
 	public pairs: CommandIconPair[];
 	protected plugin: CommanderPlugin;
 

src/manager/commands/index.ts

@@ -0,0 +1,14 @@
+import { EditorMenuCommandManager, FileMenuCommandManager } from './menuManager';
+import PageHeaderManager from './pageHeaderManager';
+import RibbonManager from './ribbonManager';
+import StatusBarManager from './statusBarManager';
+import TitleBarManager from './titleBarManager';
+
+export {
+	EditorMenuCommandManager,
+	FileMenuCommandManager,
+	PageHeaderManager,
+	RibbonManager,
+	StatusBarManager,
+	TitleBarManager,
+};

src/manager/menuManager.ts → src/manager/commands/menuManager.ts

@@ -1,14 +1,14 @@
 import { Command, Editor, MarkdownView, Menu, MenuItem, setIcon, TAbstractFile, WorkspaceLeaf } from "obsidian";
-import CommandManager from "./_commandManager";
-import CommanderPlugin from "../main";
-import { CommandIconPair } from "../types";
-import ConfirmDeleteModal from "../ui/confirmDeleteModal";
-import { chooseNewCommand, getCommandFromId, isModeActive } from "../util";
+import CommandManagerBase from "./commandManager";
+import CommanderPlugin from "src/main";
+import { CommandIconPair } from "src/types";
+import ConfirmDeleteModal from "src/ui/confirmDeleteModal";
+import { chooseNewCommand, getCommandFromId, isModeActive } from "src/util";
 import ChooseCustomNameModal from "src/ui/chooseCustomNameModal";
 import ChooseIconModal from "src/ui/chooseIconModal";
 import t from "src/l10n";
 
-abstract class Base extends CommandManager {
+abstract class Base extends CommandManagerBase {
 	public async addCommand(pair: CommandIconPair): Promise<void> {
 		this.pairs.push(pair);
 		await this.plugin.saveSettings();

src/manager/pageHeaderManager.ts → src/manager/commands/pageHeaderManager.ts

@@ -6,9 +6,9 @@ import ChooseCustomNameModal from "src/ui/chooseCustomNameModal";
 import ChooseIconModal from "src/ui/chooseIconModal";
 import ConfirmDeleteModal from "src/ui/confirmDeleteModal";
 import { chooseNewCommand, isModeActive } from "src/util";
-import CommandManager from "./_commandManager";
+import CommandManagerBase from "./commandManager";
 
-export default class PageHeaderManager extends CommandManager {
+export default class PageHeaderManager extends CommandManagerBase {
 	private addBtn = createDiv({ cls: "cmdr view-action cmdr-adder", attr: { "aria-label": t("Add new") } });
 
 	public constructor(plugin: CommanderPlugin, pairArray: CommandIconPair[]) {
@@ -57,7 +57,7 @@ export default class PageHeaderManager extends CommandManager {
 			new Menu()
 				.addItem(item => {
 					item
-						.setTitle(t("Add Command"))
+						.setTitle(t("Add command"))
 						.setIcon("command")
 						.onClick(async () => {
 							const pair = await chooseNewCommand(this.plugin);
@@ -142,12 +142,9 @@ export default class PageHeaderManager extends CommandManager {
 
 	public reorder(): void | Promise<void> {
 		const x = document.getElementsByClassName("view-action cmdr-page-header");
-		const elements: Element[] = [];
-		for (let i = 0; i < x.length; i++) {
-			// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-			elements.push(x.item(i)!);
+		for (let i = x.length - 1; i >= 0; i--) {
+			x.item(i)?.remove();
 		}
-		elements.forEach((e) => e.remove());
 	}
 
 	public async addCommand(pair: CommandIconPair): Promise<void> {
@@ -157,13 +154,12 @@ export default class PageHeaderManager extends CommandManager {
 
 	public async removeCommand(pair: CommandIconPair): Promise<void> {
 		this.pairs.remove(pair);
+
 		const x = document.getElementsByClassName(`view-action cmdr-page-header ${pair.id}`);
-		const elements: Element[] = [];
-		for (let i = 0; i < x.length; i++) {
-			// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-			elements.push(x.item(i)!);
+		for (let i = x.length - 1; i >= 0; i--) {
+			x.item(i)?.remove();
 		}
-		elements.forEach((e) => e.remove());
+
 		await this.plugin.saveSettings();
 	}
 }

src/manager/ribbonManager.ts → src/manager/commands/ribbonManager.ts

@@ -1,15 +1,15 @@
 import { isModeActive } from 'src/util';
 import { Menu, setIcon, WorkspaceRibbon } from "obsidian";
-import CommandManager from "./_commandManager";
-import CommanderPlugin from "../main";
-import { CommandIconPair } from "../types";
-import ConfirmDeleteModal from "../ui/confirmDeleteModal";
-import { chooseNewCommand, getCommandFromId } from "../util";
+import CommandManagerBase from "./commandManager";
+import CommanderPlugin from "src/main";
+import { CommandIconPair } from "src/types";
+import ConfirmDeleteModal from "src/ui/confirmDeleteModal";
+import { chooseNewCommand, getCommandFromId } from "src/util";
 import ChooseCustomNameModal from "src/ui/chooseCustomNameModal";
 import ChooseIconModal from "src/ui/chooseIconModal";
 import t from 'src/l10n';
 
-export default class RibbonManager extends CommandManager {
+export default class RibbonManager extends CommandManagerBase {
 	private actions: {
 		[id: string]: HTMLElement;
 	};
@@ -120,7 +120,7 @@ export default class RibbonManager extends CommandManager {
 			new Menu()
 				.addItem(item => {
 					item
-						.setTitle(t("Add Command"))
+						.setTitle(t("Add command"))
 						.setIcon("command")
 						.onClick(async () => {
 							const pair = await chooseNewCommand(this.plugin);

src/manager/statusBarManager.ts → src/manager/commands/statusBarManager.ts

@@ -6,9 +6,9 @@ import ChooseCustomNameModal from "src/ui/chooseCustomNameModal";
 import ChooseIconModal from "src/ui/chooseIconModal";
 import ConfirmDeleteModal from "src/ui/confirmDeleteModal";
 import { getCommandFromId, chooseNewCommand, isModeActive } from "src/util";
-import CommandManager from "./_commandManager";
+import CommandManagerBase from "./commandManager";
 
-export default class StatusBarManager extends CommandManager {
+export default class StatusBarManager extends CommandManagerBase {
 	private container: HTMLElement;
 	private readonly actions = new Map<CommandIconPair, HTMLElement>();
 	private addBtn = createDiv({ cls: "cmdr status-bar-item cmdr-adder", attr: { "aria-label-position": "top", "aria-label": t("Add new") } });
@@ -42,7 +42,7 @@ export default class StatusBarManager extends CommandManager {
 				new Menu()
 					.addItem(item => {
 						item
-							.setTitle(t("Add Command"))
+							.setTitle(t("Add command"))
 							.setIcon("command")
 							.onClick(async () => {
 								const pair = await chooseNewCommand(this.plugin);
@@ -119,7 +119,7 @@ export default class StatusBarManager extends CommandManager {
 			new Menu()
 				.addItem(item => {
 					item
-						.setTitle(t("Add Command"))
+						.setTitle(t("Add command"))
 						.setIcon("command")
 						.onClick(async () => {
 							const pair = await chooseNewCommand(this.plugin);

src/manager/titleBarManager.ts → src/manager/commands/titleBarManager.ts

@@ -6,9 +6,9 @@ import ChooseCustomNameModal from "src/ui/chooseCustomNameModal";
 import ChooseIconModal from "src/ui/chooseIconModal";
 import ConfirmDeleteModal from "src/ui/confirmDeleteModal";
 import { chooseNewCommand, getCommandFromId, isModeActive } from "src/util";
-import CommandManager from "./_commandManager";
+import CommandManagerBase from "./commandManager";
 
-export default class TitleBarManager extends CommandManager {
+export default class TitleBarManager extends CommandManagerBase {
 	private container: HTMLElement;
 	private readonly actions = new Map<CommandIconPair, HTMLElement>();
 	private addBtn = createDiv({ cls: "cmdr titlebar-button cmdr-adder", attr: { "aria-label": t("Add new") } });
@@ -96,7 +96,7 @@ export default class TitleBarManager extends CommandManager {
 			new Menu()
 				.addItem(item => {
 					item
-						.setTitle(t("Add Command"))
+						.setTitle(t("Add command"))
 						.setIcon("command")
 						.onClick(async () => {
 							const pair = await chooseNewCommand(this.plugin);

src/styles.scss

@@ -51,7 +51,6 @@
 	}
 }
 .cmdr-setting-content {
-	overflow-y: auto;
 	height: calc(100% - 10rem);
 }
 

src/types.ts

@@ -9,7 +9,11 @@ export interface CommanderSettings {
 	titleBar: CommandIconPair[];
 	statusBar: CommandIconPair[];
 	pageHeader: CommandIconPair[];
-	macros: Macro[]
+	macros: Macro[];
+	hide: {
+		statusbar: string[];
+		leftRibbon: string[];
+	}
 }
 
 export interface Macro {

src/ui/components/commandViewerComponent.tsx

@@ -2,18 +2,18 @@ import { createContext, Fragment, h } from "preact";
 import CommanderPlugin from "src/main";
 import CommandComponent from "./commandComponent";
 import logo from "src/assets/commander-logo.svg";
-import CommandManager from "src/manager/_commandManager";
+import CommandManagerBase from "src/manager/commands/commandManager";
 import { chooseNewCommand, isModeActive, ObsidianIcon } from "src/util";
 import { arrayMoveMutable } from "array-move";
 import ChooseIconModal from "../chooseIconModal";
 import ConfirmDeleteModal from "../confirmDeleteModal";
 import t from "src/l10n";
 
 // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-export const ManagerContext = createContext<CommandManager>(null!);
+export const ManagerContext = createContext<CommandManagerBase>(null!);
 
 interface CommandViewerProps {
-	manager: CommandManager;
+	manager: CommandManagerBase;
 	plugin: CommanderPlugin
 	onOpenHider?: () => void
 }