docs: update playground source codes for logging function

playground/src/main/api/index.ts

@@ -10,8 +10,14 @@ export const api = {
   invoke: {
     ping: () => console.log('pong'),
     culc: {
-      add: (_event: IpcMainInvokeEvent, arg0: number, arg1: number) => arg0 + arg1,
-      minus: (_event: IpcMainInvokeEvent, arg0: number, arg1: number) => arg0 - arg1
+      add: async (_event: IpcMainInvokeEvent, arg0: number, arg1: number) => {
+        console.log(`arg0: ${arg0}, arg1:${arg1}`)
+        return arg0 + arg1
+      },
+      minus: async (_event: IpcMainInvokeEvent, arg0: number, arg1: number) => {
+        console.log(`arg0: ${arg0}, arg1: ${arg1}`)
+        return arg0 - arg1
+      }
     },
     showContextMenu: getContextMenuHandler()
   },

playground/src/main/index.ts

@@ -2,13 +2,14 @@ import { join } from 'node:path'
 
 import { app, shell, BrowserWindow } from 'electron'
 import { electronApp, optimizer, is } from '@electron-toolkit/utils'
-import { getIpcApiEmitter, registerIpcHandler } from 'electron-typed-ipc-bridge/main'
+import { getIpcApiEmitter, initialise, registerIpcHandler } from 'electron-typed-ipc-bridge/main'
 
 import icon from '../../resources/icon.png?asset'
 import { api } from './api'
 import { setMenu } from './menu'
 
 import type { IpcSenderType } from './api'
+import { MyLogger } from './logger'
 
 function createWindow(api: IpcSenderType): void {
   // Create the browser window.
@@ -59,6 +60,9 @@ app.whenReady().then(() => {
   })
 
   // IPC test
+  initialise({ logger: { main: new MyLogger() } })
+  // if disable looging, pass the empty object
+  // initialise({ logger: {} })
   registerIpcHandler(api)
 
   const ipcApi = getIpcApiEmitter(api)

playground/src/main/logger.ts

@@ -0,0 +1,9 @@
+import { AbstractLogger } from 'electron-typed-ipc-bridge/main'
+
+import type { LogLevel } from 'electron-typed-ipc-bridge/main'
+
+export class MyLogger extends AbstractLogger {
+  protected writeLog(level: LogLevel, message: string): void {
+    console.log(`[${level}] ${message}`)
+  }
+}

playground/src/preload/index.ts

@@ -1,11 +1,21 @@
 /* eslint-disable @typescript-eslint/ban-ts-comment */
 import { contextBridge } from 'electron'
 import { electronAPI } from '@electron-toolkit/preload'
-import { getApiInvoker } from 'electron-typed-ipc-bridge/preload'
+import { AbstractLogger, getApiInvoker, initialise } from 'electron-typed-ipc-bridge/preload'
 
+import type { LogLevel } from 'electron-typed-ipc-bridge/preload'
 import type { IpcBridgeApi } from '../main/api'
 
 // Custom APIs for renderer
+class MyLogger extends AbstractLogger {
+  protected writeLog(level: LogLevel, message: string): void {
+    console.log(`[${level}] ${message}`)
+  }
+}
+
+initialise({ logger: { preload: new MyLogger() } })
+// if disable looging, pass the empty object
+// initialise({ logger: {} })
 const api = await getApiInvoker<IpcBridgeApi>()
 
 // Use `contextBridge` APIs to expose Electron APIs to

playground/src/renderer/src/App.vue

@@ -3,6 +3,11 @@ import { onBeforeUnmount, onMounted, ref } from 'vue'
 import Versions from './components/Versions.vue'
 
 const ipcHandle = () => window.api.invoke.ping()
+const ipcHandleAdd = async () => {
+  counter.value = await window.api.invoke.culc.add(counter.value, 2)
+}
+const ipcHandleMinus = async () =>
+  (counter.value = await window.api.invoke.culc.minus(counter.value, 2))
 const counter = ref(0)
 const handler = (event: MouseEvent) => {
   event.preventDefault()
@@ -37,6 +42,12 @@ onBeforeUnmount(() => {
     <div class="action">
       <a target="_blank" rel="noreferrer" @click="ipcHandle">Send IPC</a>
     </div>
+    <div class="action">
+      <a target="_blank" rel="noreferrer" @click="ipcHandleAdd">Add 2 to counter</a>
+    </div>
+    <div class="action">
+      <a target="_blank" rel="noreferrer" @click="ipcHandleMinus">Minus 2 to counter</a>
+    </div>
   </div>
   <p class="tip">Please try right click and test message menu. Updated below counter</p>
   <p class="tip">