All: Use Lerna to manage monorepo

packages/lib/services/commands/MenuUtils.ts

@@ -0,0 +1,130 @@
+import CommandService from '../CommandService';
+import KeymapService from '../KeymapService';
+import propsHaveChanged from './propsHaveChanged';
+const { createSelectorCreator, defaultMemoize } = require('reselect');
+const { createCachedSelector } = require('re-reselect');
+
+interface MenuItem {
+	id: string,
+	label: string,
+	click: Function,
+	role?: any,
+	accelerator?: string,
+}
+
+interface MenuItems {
+	[key: string]: MenuItem,
+}
+
+interface MenuItemProps {
+	[key:string]: any,
+}
+
+interface MenuItemPropsCache {
+	[key:string]: any,
+}
+
+interface MenuItemCache {
+	[key:string]: MenuItems,
+}
+
+const createShallowObjectEqualSelector = createSelectorCreator(
+	defaultMemoize,
+	(prev:any, next:any) => {
+		if (Object.keys(prev).length !== Object.keys(next).length) return false;
+		for (const n in prev) {
+			if (prev[n] !== next[n]) return false;
+		}
+		return true;
+	}
+);
+
+// This selector ensures that for the given command names, the same toolbar
+// button array is returned if the underlying toolbar buttons have not changed.
+const selectObjectByCommands = createCachedSelector(
+	(state:any) => state.array,
+	(array:any[]) => array
+)({
+	keySelector: (_state:any, commandNames:string[]) => {
+		return commandNames.join('_');
+	},
+	selectorCreator: createShallowObjectEqualSelector,
+});
+
+export default class MenuUtils {
+
+	private service_:CommandService;
+	private menuItemCache_:MenuItemCache = {};
+	private menuItemPropsCache_:MenuItemPropsCache = {};
+
+	constructor(service:CommandService) {
+		this.service_ = service;
+	}
+
+	private get service():CommandService {
+		return this.service_;
+	}
+
+	private get keymapService():KeymapService {
+		return KeymapService.instance();
+	}
+
+	public commandToMenuItem(commandName:string, onClick:Function):MenuItem {
+		const command = this.service.commandByName(commandName);
+
+		const item:MenuItem = {
+			id: command.declaration.name,
+			label: this.service.label(commandName),
+			click: () => onClick(command.declaration.name),
+		};
+
+		if (command.declaration.role) item.role = command.declaration.role;
+
+		if (this.keymapService && this.keymapService.acceleratorExists(commandName)) {
+			item.accelerator = this.keymapService.getAccelerator(commandName);
+		}
+
+		return item;
+	}
+
+	public commandToStatefulMenuItem(commandName:string, ...args:any[]):MenuItem {
+		return this.commandToMenuItem(commandName, () => {
+			return this.service.execute(commandName, ...args);
+		});
+	}
+
+	public commandsToMenuItems(commandNames:string[], onClick:Function):MenuItems {
+		const key:string = `${this.keymapService.lastSaveTime}_${commandNames.join('_')}`;
+		if (this.menuItemCache_[key]) return this.menuItemCache_[key];
+
+		const output:MenuItems = {};
+
+		for (const commandName of commandNames) {
+			output[commandName] = this.commandToMenuItem(commandName, onClick);
+		}
+
+		this.menuItemCache_[key] = output;
+
+		return output;
+	}
+
+	public commandsToMenuItemProps(commandNames:string[], whenClauseContext:any):MenuItemProps {
+		const output:MenuItemProps = {};
+
+		for (const commandName of commandNames) {
+			const newProps = {
+				enabled: this.service.isEnabled(commandName, whenClauseContext),
+			};
+
+			if (newProps === null || propsHaveChanged(this.menuItemPropsCache_[commandName], newProps)) {
+				output[commandName] = newProps;
+				this.menuItemPropsCache_[commandName] = newProps;
+			} else {
+				output[commandName] = this.menuItemPropsCache_[commandName];
+			}
+		}
+
+		return selectObjectByCommands({ array: output }, commandNames);
+	}
+
+}

packages/lib/services/commands/ToolbarButtonUtils.ts

@@ -0,0 +1,86 @@
+import CommandService from '../CommandService';
+import { stateUtils } from '../../reducer';
+
+const separatorItem = { type: 'separator' };
+
+export interface ToolbarButtonInfo {
+	name: string,
+	tooltip: string,
+	iconName: string,
+	enabled: boolean,
+	onClick():void,
+	title: string,
+}
+
+interface ToolbarButtonCacheItem {
+	info: ToolbarButtonInfo,
+}
+
+interface ToolbarButtonCache {
+	[key:string]: ToolbarButtonCacheItem,
+}
+
+export default class ToolbarButtonUtils {
+
+	private service_:CommandService;
+	private toolbarButtonCache_:ToolbarButtonCache = {};
+
+	constructor(service:CommandService) {
+		this.service_ = service;
+	}
+
+	private get service():CommandService {
+		return this.service_;
+	}
+
+	private commandToToolbarButton(commandName:string, whenClauseContext:any):ToolbarButtonInfo {
+		const newEnabled = this.service.isEnabled(commandName, whenClauseContext);
+		const newTitle = this.service.title(commandName);
+
+		if (
+			this.toolbarButtonCache_[commandName] &&
+			this.toolbarButtonCache_[commandName].info.enabled === newEnabled &&
+			this.toolbarButtonCache_[commandName].info.title === newTitle
+		) {
+			return this.toolbarButtonCache_[commandName].info;
+		}
+
+		const command = this.service.commandByName(commandName, { runtimeMustBeRegistered: true });
+
+		const output = {
+			name: commandName,
+			tooltip: this.service.label(commandName),
+			iconName: command.declaration.iconName,
+			enabled: newEnabled,
+			onClick: async () => {
+				this.service.execute(commandName);
+			},
+			title: newTitle,
+		};
+
+		this.toolbarButtonCache_[commandName] = {
+			info: output,
+		};
+
+		return this.toolbarButtonCache_[commandName].info;
+	}
+
+	// This method ensures that if the provided commandNames and state hasn't changed
+	// the output also won't change. Invididual toolbarButtonInfo also won't changed
+	// if the state they use hasn't changed. This is to avoid useless renders of the toolbars.
+	public commandsToToolbarButtons(commandNames:string[], whenClauseContext:any):ToolbarButtonInfo[] {
+		const output:ToolbarButtonInfo[] = [];
+
+		for (const commandName of commandNames) {
+			if (commandName === '-') {
+				output.push(separatorItem as any);
+				continue;
+			}
+
+			output.push(this.commandToToolbarButton(commandName, whenClauseContext));
+		}
+
+		return stateUtils.selectArrayShallow({ array: output }, commandNames.join('_'));
+	}
+
+}

packages/lib/services/commands/commandsToMarkdownTable.ts

@@ -0,0 +1,32 @@
+import markdownUtils, { MarkdownTableHeader, MarkdownTableRow } from '../../markdownUtils';
+
+export default function commandsToMarkdownTable():string {
+	const headers:MarkdownTableHeader[] = [
+		{
+			name: 'commandName',
+			label: 'Name',
+		},
+		{
+			name: 'description',
+			label: 'Description',
+		},
+		{
+			name: 'props',
+			label: 'Props',
+		},
+	];
+
+	const rows:MarkdownTableRow[] = [];
+
+	for (const commandName in this.commands_) {
+
+		const row:MarkdownTableRow = {
+			commandName: commandName,
+			description: this.label(commandName),
+		};
+
+		rows.push(row);
+	}
+
+	return markdownUtils.createMarkdownTable(headers, rows);
+}

packages/lib/services/commands/propsHaveChanged.ts

@@ -0,0 +1,15 @@
+export default function propsHaveChanged(previous:any, next:any):boolean {
+	if (!previous && next) return true;
+	if (previous && !next) return true;
+	if (!previous && !next) return false;
+
+	if (Object.keys(previous).length !== Object.keys(next).length) return true;
+
+	for (const n in previous) {
+		if (previous[n] !== next[n]) {
+			return true;
+		}
+	}
+
+	return false;
+}

packages/lib/services/commands/stateToWhenClauseContext.ts

@@ -0,0 +1,47 @@
+import { stateUtils } from '../../reducer';
+
+const BaseModel = require('../../BaseModel').default;
+const Folder = require('../../models/Folder');
+const MarkupToHtml = require('@joplinapp/renderer/MarkupToHtml').default;
+
+export default function stateToWhenClauseContext(state:any) {
+	const noteId = state.selectedNoteIds.length === 1 ? state.selectedNoteIds[0] : null;
+	const note = noteId ? BaseModel.byId(state.notes, noteId) : null;
+
+	return {
+		// UI elements
+		markdownEditorVisible: !!state.settings['editor.codeView'],
+		richTextEditorVisible: !state.settings['editor.codeView'],
+		markdownEditorPaneVisible: state.settings['editor.codeView'] && state.noteVisiblePanes.includes('editor'),
+		markdownViewerPaneVisible: state.settings['editor.codeView'] && state.noteVisiblePanes.includes('viewer'),
+		modalDialogVisible: !!Object.keys(state.visibleDialogs).length,
+		sideBarVisible: !!state.sidebarVisibility,
+		noteListHasNotes: !!state.notes.length,
+
+		// Application state
+		notesAreBeingSaved: stateUtils.hasNotesBeingSaved(state),
+		syncStarted: state.syncStarted,
+
+		// Current location
+		inConflictFolder: state.selectedFolderId === Folder.conflictFolderId(),
+
+		// Note selection
+		oneNoteSelected: !!note,
+		someNotesSelected: state.selectedNoteIds.length > 0,
+		multipleNotesSelected: state.selectedNoteIds.length > 1,
+		noNotesSelected: !state.selectedNoteIds.length,
+
+		// Note history
+		historyhasBackwardNotes: state.backwardHistoryNotes.length > 0,
+		historyhasForwardNotes: state.forwardHistoryNotes.length > 0,
+
+		// Folder selection
+		oneFolderSelected: !!state.selectedFolderId,
+
+		// Current note properties
+		noteIsTodo: note ? !!note.is_todo : false,
+		noteTodoCompleted: note ? !!note.todo_completed : false,
+		noteIsMarkdown: note ? note.markup_language === MarkupToHtml.MARKUP_LANGUAGE_MARKDOWN : false,
+		noteIsHtml: note ? note.markup_language === MarkupToHtml.MARKUP_LANGUAGE_HTML : false,
+	};
+}