Feat logging (#28)

* feat: add logging functionality

* refactor: move into types folder

* feat: add log statement for saving

* refactor: use logger.warn instead of console.error

package.json

@@ -1,34 +1,35 @@
 {
-	"name": "obsidian-vault-explorer",
-	"version": "1.0.0",
-	"description": "Explore your vault in visual format",
-	"main": "main.js",
-	"scripts": {
-		"dev": "node esbuild.config.mjs",
-		"build": "tsc -noEmit -skipLibCheck && node esbuild.config.mjs production",
-		"version": "node version-bump.mjs && git add manifest.json versions.json"
-	},
-	"keywords": [],
-	"author": "Trey Wallis",
-	"license": "MIT",
-	"devDependencies": {
-		"@tsconfig/svelte": "^5.0.4",
-		"@types/bun": "latest",
-		"@types/lodash": "^4.17.0",
-		"@types/node": "^16.11.6",
-		"@typescript-eslint/eslint-plugin": "5.29.0",
-		"@typescript-eslint/parser": "5.29.0",
-		"builtin-modules": "3.3.0",
-		"esbuild": "0.17.3",
-		"esbuild-svelte": "^0.8.0",
-		"obsidian": "latest",
-		"svelte-preprocess": "^5.1.4",
-		"tslib": "2.4.0",
-		"typescript": "4.7.4"
-	},
-	"dependencies": {
-		"lodash": "^4.17.21",
-		"nanoid": "^5.0.7",
-		"svelte": "^4.2.15"
-	}
+  "name": "obsidian-vault-explorer",
+  "version": "1.0.0",
+  "description": "Explore your vault in visual format",
+  "main": "main.js",
+  "scripts": {
+    "dev": "node esbuild.config.mjs",
+    "build": "tsc -noEmit -skipLibCheck && node esbuild.config.mjs production",
+    "version": "node version-bump.mjs && git add manifest.json versions.json"
+  },
+  "keywords": [],
+  "author": "Trey Wallis",
+  "license": "MIT",
+  "devDependencies": {
+    "@tsconfig/svelte": "^5.0.4",
+    "@types/bun": "latest",
+    "@types/lodash": "^4.17.0",
+    "@types/node": "^16.11.6",
+    "@typescript-eslint/eslint-plugin": "5.29.0",
+    "@typescript-eslint/parser": "5.29.0",
+    "builtin-modules": "3.3.0",
+    "esbuild": "0.17.3",
+    "esbuild-svelte": "^0.8.0",
+    "obsidian": "latest",
+    "svelte-preprocess": "^5.1.4",
+    "tslib": "2.4.0",
+    "typescript": "4.7.4"
+  },
+  "dependencies": {
+    "js-logger": "^1.6.1",
+    "lodash": "^4.17.21",
+    "nanoid": "^5.0.7",
+    "svelte": "^4.2.15"
+  }
 }

src/constants.ts

@@ -1,10 +1,13 @@
+import { LOG_LEVEL_WARN } from "./logger/constants";
 import { generateUUID } from "./svelte/shared/services/uuid";
 import { VaultExplorerPluginSettings } from "./types";
 
 export const VAULT_EXPLORER_VIEW = "vault-explorer";
 
-const uuid = generateUUID();
+const groupUUID = generateUUID();
+
 export const DEFAULT_SETTINGS: VaultExplorerPluginSettings = {
+	logLevel: LOG_LEVEL_WARN,
 	properties: {
 		favorite: "",
 		url: "",
@@ -19,11 +22,11 @@ export const DEFAULT_SETTINGS: VaultExplorerPluginSettings = {
 		timestamp: "all",
 		sort: "file-name-asc",
 		properties: {
-			selectedGroupId: uuid,
+			selectedGroupId: groupUUID,
 			groups:
 				[
 					{
-						id: uuid,
+						id: groupUUID,
 						name: "Group 1",
 						filters: [],
 						isEnabled: true

src/logger/constants.ts

@@ -0,0 +1,6 @@
+export const LOG_LEVEL_OFF = "off";
+export const LOG_LEVEL_ERROR = "error";
+export const LOG_LEVEL_WARN = "warn";
+export const LOG_LEVEL_INFO = "info";
+export const LOG_LEVEL_DEBUG = "debug";
+export const LOG_LEVEL_TRACE = "trace";

src/logger/index.ts

@@ -0,0 +1,54 @@
+import Logger, { ILogLevel } from "js-logger";
+import { LOG_LEVEL_OFF, LOG_LEVEL_ERROR, LOG_LEVEL_WARN, LOG_LEVEL_INFO, LOG_LEVEL_DEBUG, LOG_LEVEL_TRACE } from "./constants";
+import { FormattedLogMessage, LogMessageHeader } from "./types";
+
+
+export const logLevelToString = (level: ILogLevel) => {
+	switch (level) {
+		case Logger.OFF:
+			return LOG_LEVEL_OFF;
+		case Logger.ERROR:
+			return LOG_LEVEL_ERROR;
+		case Logger.WARN:
+			return LOG_LEVEL_WARN;
+		case Logger.INFO:
+			return LOG_LEVEL_INFO;
+		case Logger.DEBUG:
+			return LOG_LEVEL_DEBUG;
+		case Logger.TRACE:
+			return LOG_LEVEL_TRACE;
+		default:
+			throw new Error("Unhandled log level");
+	}
+}
+
+export const stringToLogLevel = (value: string) => {
+	switch (value) {
+		case LOG_LEVEL_OFF:
+			return Logger.OFF;
+		case LOG_LEVEL_ERROR:
+			return Logger.ERROR;
+		case LOG_LEVEL_WARN:
+			return Logger.WARN;
+		case LOG_LEVEL_INFO:
+			return Logger.INFO;
+		case LOG_LEVEL_DEBUG:
+			return Logger.DEBUG;
+		case LOG_LEVEL_TRACE:
+			return Logger.TRACE;
+		default:
+			throw new Error(`Unhandled log level: ${value}`);
+	}
+}
+
+export const formatMessageForLogger = (...args: unknown[]): FormattedLogMessage => {
+	const head: unknown = args[0];
+	const body = args[1] as unknown as Record<string, unknown>;
+	if (typeof args[0] == "object") {
+		const headers = head as LogMessageHeader;
+		const { fileName, functionName, message } = headers;
+		return { message: `[${fileName}:${functionName}] ${message}`, data: body };
+	} else {
+		return { message: String(head), data: body };
+	}
+}

src/logger/types.ts

@@ -0,0 +1,10 @@
+export interface FormattedLogMessage {
+	message: string;
+	data: Record<string, unknown> | null;
+}
+
+export interface LogMessageHeader {
+	fileName: string;
+	functionName: string;
+	message: string;
+}

src/main.ts

@@ -8,8 +8,11 @@ import { DEFAULT_SETTINGS, VAULT_EXPLORER_VIEW } from './constants';
 import _ from 'lodash';
 import EventManager from './event/event-manager';
 import { isVersionLessThan } from './utils';
-import { VaultExplorerPluginSettings_0_3_3 } from './types-0.3.0';
-import { VaultExplorerPluginSettings_0_5_5 } from './types-0.5.5';
+import { VaultExplorerPluginSettings_0_3_3 } from './types/types-0.3.0';
+import { VaultExplorerPluginSettings_0_5_5 } from './types/types-0.5.5';
+import Logger from 'js-logger';
+import { formatMessageForLogger, stringToLogLevel } from './logger';
+import { LOG_LEVEL_WARN } from './logger/constants';
 
 export default class VaultExplorerPlugin extends Plugin {
 	settings: VaultExplorerPluginSettings = DEFAULT_SETTINGS;
@@ -17,6 +20,20 @@ export default class VaultExplorerPlugin extends Plugin {
 	async onload() {
 		await this.loadSettings();
 
+		//Setup logger
+		Logger.useDefaults();
+		Logger.setHandler(function (messages) {
+			const { message, data } = formatMessageForLogger(...messages);
+			console.log(message);
+			if (data) {
+				console.log(data);
+			}
+		});
+
+		const logLevel = stringToLogLevel(this.settings.logLevel);
+		Logger.setLevel(logLevel);
+
+
 		this.registerView(
 			VAULT_EXPLORER_VIEW,
 			(leaf) => new VaultExplorerView(leaf, this)
@@ -106,7 +123,7 @@ export default class VaultExplorerPlugin extends Plugin {
 				if (isVersionLessThan(settingsVersion, "0.4.0")) {
 					console.log("Upgrading settings from version 0.3.3 to 0.4.0");
 					const typedData = (data as unknown) as VaultExplorerPluginSettings_0_3_3;
-					const newData: VaultExplorerPluginSettings = {
+					const newData: VaultExplorerPluginSettings_0_5_5 = {
 						...typedData,
 						filters: {
 							...typedData.filters,
@@ -124,6 +141,7 @@ export default class VaultExplorerPlugin extends Plugin {
 					const typedData = (data as unknown) as VaultExplorerPluginSettings_0_5_5;
 					const newData: VaultExplorerPluginSettings = {
 						...typedData,
+						logLevel: LOG_LEVEL_WARN,
 						filters: {
 							...typedData.filters,
 							properties: {
@@ -153,7 +171,8 @@ export default class VaultExplorerPlugin extends Plugin {
 	}
 
 	async saveSettings() {
+		Logger.trace({ fileName: "main.ts", functionName: "saveSettings", message: "called" });
+		Logger.debug({ fileName: "main.ts", functionName: "saveSettings", message: "Saving settings" }, this.settings);
 		await this.saveData(this.settings);
-		// console.log("Settings saved");
 	}
 }

src/obsidian/vault-explorer-settings-tab.ts

@@ -1,6 +1,9 @@
 import { App, PluginSettingTab, Setting } from "obsidian";
 import VaultExplorerPlugin from "src/main";
-import { getAllObsidianProperties, getDropdownOptionsForProperties, getObsidianPropertiesByType } from "./utils";
+import { getDropdownOptionsForProperties, getObsidianPropertiesByType } from "./utils";
+import { LOG_LEVEL_DEBUG, LOG_LEVEL_ERROR, LOG_LEVEL_INFO, LOG_LEVEL_OFF, LOG_LEVEL_TRACE, LOG_LEVEL_WARN } from "src/logger/constants";
+import Logger from "js-logger";
+import { stringToLogLevel } from "src/logger";
 
 export default class VaultExplorerSettingsTab extends PluginSettingTab {
 	plugin: VaultExplorerPlugin;
@@ -89,5 +92,29 @@ export default class VaultExplorerSettingsTab extends PluginSettingTab {
 					await this.plugin.saveSettings();
 				}));
 
+		new Setting(containerEl).setName("Debugging").setHeading();
+		new Setting(containerEl)
+			.setName("Log level")
+			.setDesc(
+				"Sets the log level. Please use trace to see all log messages."
+			)
+			.addDropdown((cb) => {
+				cb.addOptions({
+					[LOG_LEVEL_OFF]: "Off",
+					[LOG_LEVEL_ERROR]: "Error",
+					[LOG_LEVEL_WARN]: "Warn",
+					[LOG_LEVEL_INFO]: "Info",
+					[LOG_LEVEL_DEBUG]: "Debug",
+					[LOG_LEVEL_TRACE]: "Trace"
+				})
+				cb.setValue(this.plugin.settings.logLevel).onChange(
+					async (value) => {
+						this.plugin.settings.logLevel = value;
+						await this.plugin.saveSettings();
+						Logger.setLevel(stringToLogLevel(value));
+					}
+				);
+			});
+
 	}
 }

src/svelte/app/services/filters/property-filter.ts

@@ -2,6 +2,7 @@ import { FrontMatterCache } from "obsidian";
 import { CheckboxFilterCondition, DateFilterCondition, ListFilterCondition, NumberFilterCondition, PropertyFilterGroup } from "src/types";
 import { FilterCondition, TextFilterCondition } from "src/types";
 import { getBeforeMidnightMillis, getMidnightMillis, getMillis } from "../time-utils";
+import Logger from "js-logger";
 
 //Tests
 //Group is enabled/disabled
@@ -30,14 +31,14 @@ export const filterByProperty = (frontmatter: FrontMatterCache | undefined, grou
 			if (type === "text") {
 				//If the value is not a string, skip the filter
 				if (propertyValue !== null && typeof propertyValue !== "string") {
-					console.error(`Property value is not a string: ${propertyValue}`);
+					Logger.warn(`Property value is not a string: ${propertyValue}`);
 					return true;
 				}
 				const doesMatch = doesTextMatchFilter(condition, propertyValue, value);
 				return doesMatch;
 			} else if (type === "list") {
 				if (propertyValue !== null && !Array.isArray(propertyValue)) {
-					console.error(`Property value is not an array: ${propertyValue}`);
+					Logger.warn(`Property value is not an array: ${propertyValue}`);
 					return true;
 				}
 				const compare = value.split(",").map((v) => v.trim());
@@ -45,7 +46,7 @@ export const filterByProperty = (frontmatter: FrontMatterCache | undefined, grou
 				return doesMatch;
 			} else if (type === "number") {
 				if (propertyValue !== null && typeof propertyValue !== "number") {
-					console.error(`Property value is not a number: ${propertyValue}`);
+					Logger.warn(`Property value is not a number: ${propertyValue}`);
 					return true;
 				}
 				const compare = parseFloat(value);
@@ -53,7 +54,7 @@ export const filterByProperty = (frontmatter: FrontMatterCache | undefined, grou
 				return doesMatch;
 			} else if (type === "checkbox") {
 				if (propertyValue !== null && typeof propertyValue !== "boolean") {
-					console.error(`Property value is not a boolean: ${propertyValue}`);
+					Logger.warn(`Property value is not a boolean: ${propertyValue}`);
 					return true;
 				}
 
@@ -63,7 +64,7 @@ export const filterByProperty = (frontmatter: FrontMatterCache | undefined, grou
 
 			} else if (type === "date" || type === "datetime") {
 				if (propertyValue !== null && typeof propertyValue !== "string") {
-					console.error(`Property value is not a string: ${propertyValue}`);
+					Logger.warn(`Property value is not a string: ${propertyValue}`);
 					return true;
 				}
 

src/types/index.ts

@@ -1,4 +1,5 @@
 export interface VaultExplorerPluginSettings {
+	logLevel: string;
 	properties: {
 		favorite: string;
 		url: string;