feat: improve logging (#254)

## Motivation

<!-- List motivation and changes here -->

Clean up logging for electron


## Issues closed

<!-- List closed issues here -->

Author: pixelass

src/client/pages/[locale]/prompt.tsx

@@ -117,9 +117,12 @@ export default function Page() {
 						setValue(event.target.value);
 						try {
 							const result = evaluate(event.target.value);
-							setEvaluationResult(result.toString());
+							if (["string", "number"].includes(typeof result)) {
+								setEvaluationResult(result.toString());
+							} else {
+								setEvaluationResult("");
+							}
 						} catch {
-							// Console.error(error);
 							setEvaluationResult("");
 						}
 					}}

src/electron/helpers/app-loaders.ts

@@ -7,6 +7,7 @@ import serve from "electron-serve";
 import { globbySync } from "globby";
 import matter from "gray-matter";
 
+import { jsonStringify } from "#/object";
 import { logger } from "@/services/logger";
 import { getCaptainApps } from "@/utils/path-helpers";
 
@@ -80,7 +81,7 @@ export function registerApps() {
 	const installedApps = globbySync(["*/captain.md"], {
 		cwd: getCaptainApps(),
 	});
-	logger.info(JSON.stringify(installedApps, null, 2));
+	logger.info(jsonStringify(installedApps));
 
 	// Register a custom protocol for each installed app, allowing them to be served statically.
 	for (const installedApp of installedApps) {

src/electron/helpers/core-setup.ts

@@ -1,3 +1,4 @@
+import console from "node:console";
 import path from "node:path";
 import process from "node:process";
 
@@ -38,6 +39,7 @@ if (gotTheLock || isTest) {
 	}
 } else {
 	// The app is locked, so we force quit the new instance
+	// Use native log here since this is before the logger was initialized
 	console.log("App is locked by another instance. Closing app");
 	app.quit();
 }

src/electron/helpers/init-local-protocol.ts

@@ -4,6 +4,7 @@ import path from "path";
 import { protocol } from "electron";
 
 import { LOCAL_PROTOCOL } from "#/constants";
+import { logError } from "@/services/logger";
 
 /**
  * Handles requests to a custom protocol for serving local files in an Electron application.
@@ -55,7 +56,7 @@ export function initLocalProtocol() {
 			return new Response(file, { headers: { "Content-Type": "application/octet-stream" } });
 		} catch (error) {
 			// Log and return an error response if the file cannot be read
-			console.error(`Failed to read ${filePath}:`, error);
+			logError(error, `Failed to read ${filePath}:`);
 			return new Response("File not found", { status: 404 });
 		}
 	});

src/electron/helpers/ipc/downloads.ts

@@ -4,6 +4,7 @@ import { ipcMain } from "electron";
 
 import { apps } from "@/apps";
 import { DownloadManager } from "@/services/download-manager";
+import { logError } from "@/services/logger";
 
 const downloadManager = new DownloadManager();
 
@@ -39,7 +40,7 @@ ipcMain.on(
 						payload,
 					});
 				} catch (error) {
-					console.log(error);
+					logError(error);
 				}
 
 				break;

src/electron/helpers/ipc/global.ts

@@ -22,6 +22,7 @@ import { VECTOR_STORE_COLLECTION } from "#/constants";
 import { ID } from "#/enums";
 import { cleanPath, extractH1Headings, getFileType } from "#/string";
 import { apps } from "@/apps";
+import { logError } from "@/services/logger";
 import { VectorStore } from "@/services/vector-store";
 import { inventoryStore, downloadsStore, userStore, appSettingsStore } from "@/stores";
 import { pushToStore } from "@/stores/utils";
@@ -145,7 +146,7 @@ ipcMain.handle(
 			try {
 				await writePngMetaData(filePath, context);
 			} catch (error) {
-				console.log(error);
+				logError(error);
 			}
 		}
 
@@ -370,7 +371,7 @@ ipcMain.handle(
 								apps[item.appId]?.webContents.send("downloadComplete", true);
 							}
 						} catch (error) {
-							console.log(`Error on ${item.id}`, error);
+							logError(error, `Error on ${item.id}`);
 							downloadsStore.set(item.id, DownloadState.FAILED);
 						} finally {
 							downloadsStore.delete(item.id);

src/electron/helpers/ipc/marketplace.ts

@@ -15,7 +15,6 @@ ipcMain.handle(
 
 		try {
 			const { data } = await axios.get(url);
-			console.log("data", data);
 			marketplaceStore.store = data;
 			return data;
 		} catch (error) {

src/electron/helpers/ipc/sdk.ts

@@ -1,3 +1,6 @@
+import console from "node:console";
+
+import type { SDKMessage } from "@captn/react/types";
 import { APP_MESSAGE_KEY, DownloadState } from "@captn/utils/constants";
 import type { VectorStoreDocument } from "@captn/utils/types";
 import { getProperty } from "dot-prop";
@@ -10,16 +13,12 @@ import { ID } from "#/enums";
 import type { StoryRequest } from "#/types/story";
 import { apps } from "@/apps";
 import { captionImages, createStory, maxTokenMap } from "@/ipc/story";
+import { logError, logger } from "@/services/logger";
 import { downloadsStore, inventoryStore, userStore } from "@/stores";
 import { pushToStore } from "@/stores/utils";
 import { clone } from "@/utils/git";
 import { getCaptainDownloads, getUserData } from "@/utils/path-helpers";
 
-export interface SDKMessage<T> {
-	payload: T;
-	action?: string;
-}
-
 ipcMain.on(
 	APP_MESSAGE_KEY,
 	<T>(_event: IpcMainEvent, { message, appId }: { message: SDKMessage<T>; appId: string }) => {
@@ -79,7 +78,7 @@ ipcMain.on(
 						await Promise.all(promises);
 					} catch (error) {
 						// TODO: add "onError" into "clone" to properly catch the error
-						console.log(error);
+						logError(error);
 					}
 				}
 
@@ -110,12 +109,13 @@ ipcMain.on(
 
 					// Seems like no descriptions were generated. Handle as error
 					if (!imageDescriptions) {
-						console.log("missing descriptions");
+						logger.error("missing descriptions");
 
 						return;
 					}
 
 					// Debugging helper to check how the images were captioned
+					// Use native log here as this is only useful while developing
 					console.log(imageDescriptions);
 
 					const maxTokens = maxTokenMap[options.length] * images.length;
@@ -125,7 +125,7 @@ ipcMain.on(
 						{ imageDescriptions, maxTokens, locale, options },
 						{
 							onError(error) {
-								console.log(error);
+								logError(error);
 							},
 							onChunk(story) {
 								event.sender.send(channel, {
@@ -208,13 +208,13 @@ ipcMain.on(
 		// Retaining this log facilitates a deeper understanding of the action's payload and helps identify
 		// potential issues or anomalies in the data structure or content. It's particularly useful for tracking
 		// the flow of data and ensuring that the expected actions are triggered correctly within the SDK.
-		console.log(message);
+		logger.info(message);
 		switch (message.action) {
 			case "function": {
 				try {
 					handleCaptainAction(message.payload as VectorStoreDocument["payload"]);
 				} catch (error) {
-					console.log(error);
+					logError(error);
 				}
 
 				if (apps.prompt) {

src/electron/helpers/ipc/sdk/image-to-image.ts

@@ -1,13 +1,16 @@
+import console from "node:console";
 import fsp from "node:fs/promises";
 
+import type { SDKMessage } from "@captn/react/types";
 import { APP_MESSAGE_KEY } from "@captn/utils/constants";
 import type { IpcMainEvent } from "electron";
 import { ipcMain } from "electron";
 import type { ExecaChildProcess } from "execa";
 import { execa } from "execa";
 
+import { jsonStringify } from "#/object";
 import { cleanPath } from "#/string";
-import { logger } from "@/services/logger";
+import { logError, logger } from "@/services/logger";
 import { createDirectory } from "@/utils/fs";
 import {
 	getCaptainData,
@@ -16,11 +19,6 @@ import {
 	getDirectory,
 } from "@/utils/path-helpers";
 
-export interface SDKMessage<T> {
-	payload: T;
-	action?: string;
-}
-
 let process_: ExecaChildProcess<string> | undefined;
 let cache = "";
 
@@ -94,7 +92,8 @@ ipcMain.on(
 				try {
 					const jsonData = JSON.parse(dataString);
 
-					console.log(`image-to-image: ${JSON.stringify(jsonData)}`);
+					// Use native log here as this is only useful while developing
+					console.log(`image-to-image: ${jsonStringify(jsonData)}`);
 
 					if (process_ && jsonData.status === "starting") {
 						event.sender.send(channel, {
@@ -157,15 +156,12 @@ ipcMain.on(
 					}
 				} catch {
 					logger.info(`image-to-image: Received non-JSON data: ${dataString}`);
-					console.log("Received non-JSON data:", dataString);
 				}
 			});
 
 			logger.info(`image-to-image: processing stderr`);
 			process_.stderr.on("image-to-image:data", data => {
-				console.error(`error: ${data}`);
-
-				logger.info(`image-to-image: error: ${data}`);
+				logError(data, "image-to-image error:");
 
 				event.sender.send(channel, { action: "image-to-image:error", payload: data });
 			});
@@ -204,19 +200,19 @@ ipcMain.on(
 						decodedImageData
 					);
 				} catch (error) {
-					console.error(error);
+					logError(error);
 				}
 
 				break;
 			}
 
 			case "image-to-image:imageBuffer": {
 				try {
-					const { buffer } = message.payload as any;
+					const { buffer } = message.payload as { buffer: Buffer };
 
 					await fsp.writeFile(getCaptainTemporary("image-to-image/input.png"), buffer);
 				} catch (error) {
-					console.error(error);
+					logError(error);
 				}
 
 				break;

src/electron/helpers/ipc/sdk/text-to-image.ts

@@ -6,8 +6,9 @@ import { ipcMain } from "electron";
 import type { ExecaChildProcess } from "execa";
 import { execa } from "execa";
 
+import { jsonStringify } from "#/object";
 import { cleanPath } from "#/string";
-import { logger } from "@/services/logger";
+import { logError, logger } from "@/services/logger";
 import { createDirectory } from "@/utils/fs";
 import {
 	getCaptainData,
@@ -89,7 +90,8 @@ ipcMain.on(
 				try {
 					const jsonData = JSON.parse(dataString);
 
-					console.log(`text-to-image: ${JSON.stringify(jsonData)}`);
+					// Use native log here as this is only useful while developing
+					console.log(`text-to-image: ${jsonStringify(jsonData)}`);
 
 					if (process_ && jsonData.status === "starting") {
 						event.sender.send(channel, {
@@ -152,15 +154,12 @@ ipcMain.on(
 					}
 				} catch {
 					logger.info(`text-to-image: Received non-JSON data: ${dataString}`);
-					console.log("Received non-JSON data:", dataString);
 				}
 			});
 
 			logger.info(`text-to-image: processing stderr`);
 			process_.stderr.on("text-to-image:data", data => {
-				console.error(`error: ${data}`);
-
-				logger.info(`text-to-image: error: ${data}`);
+				logError(data);
 
 				event.sender.send(channel, { action: "text-to-image:error", payload: data });
 			});

src/electron/helpers/ipc/vector-store.ts

@@ -9,6 +9,7 @@ import type { ScrollOptions, SearchOptions } from "@captn/utils/types";
 import { ipcMain } from "electron";
 
 import { VECTOR_STORE_COLLECTION } from "#/constants";
+import { logError } from "@/services/logger";
 import { VectorStore } from "@/services/vector-store";
 
 ipcMain.on(
@@ -21,7 +22,7 @@ ipcMain.on(
 
 			event.sender.send(VECTOR_STORE_SEARCH_RESULT_KEY, result);
 		} catch (error) {
-			console.log(error);
+			logError(error);
 			event.sender.send(ERROR_KEY, error);
 		}
 	}

src/electron/helpers/services/__tests__/download-manager.test.ts

@@ -123,6 +123,7 @@ describe("DownloadManager", () => {
 				await fsp.rm(testDirectory, { recursive: true });
 			}
 		} catch (error) {
+			// Use native log here as this is only useful while developing
 			console.log("Error cleaning up test directory before tests:", error);
 		}
 	});
@@ -134,6 +135,7 @@ describe("DownloadManager", () => {
 				await fsp.rm(testDirectory, { recursive: true });
 			}
 		} catch (error) {
+			// Use native log here as this is only useful while developing
 			console.log("Error cleaning up test directory after all tests:", error);
 		}
 	});

src/electron/helpers/services/__tests__/logger.test.ts

@@ -0,0 +1,41 @@
+import { logError, logger } from "../logger";
+
+import { jsonStringify } from "#/object";
+
+// Mock the logger to prevent actual logging during tests
+jest.mock("electron-log/node", () => ({
+	transports: {
+		file: {
+			level: jest.fn(),
+		},
+		console: {
+			format: jest.fn(),
+		},
+	},
+	error: jest.fn(),
+}));
+
+jest.mock("#/object", () => ({
+	jsonStringify: jest.fn(() => "mocked json"),
+}));
+
+describe("logError", () => {
+	it("logs Error instances correctly", () => {
+		const error = new Error("Test error");
+		logError(error, "Error:");
+		expect(logger.error).toHaveBeenCalledWith("Error:", error.message, error.stack);
+	});
+
+	it("logs plain objects correctly", () => {
+		const error = { key: "value" };
+		logError(error, "Object Error:");
+		expect(jsonStringify).toHaveBeenCalledWith(error);
+		expect(logger.error).toHaveBeenCalledWith("Object Error:", "mocked json");
+	});
+
+	it("logs non-object, non-Error values correctly", () => {
+		const error = "A string error";
+		logError(error, "String Error:");
+		expect(logger.error).toHaveBeenCalledWith("String Error:", error);
+	});
+});

src/electron/helpers/services/__tests__/vector-store.test.e2e.ts

@@ -140,6 +140,7 @@ describe("VectorStore Integration Tests", () => {
 			await vectorStore.search(collectionName2, document1.content);
 		} catch (error) {
 			expect(error).toBeDefined();
+			// Use native log here as this is only useful while developing
 			console.log(error);
 			expect((error as Error).message).toContain(
 				`Collection ${collectionName2} doesn't exist`