feat(stage-tamagotchi): basic widget window manager, moved partial code from component-calling

Author: nekomeowww

apps/stage-tamagotchi/src/main/index.ts

@@ -1,5 +1,7 @@
 import type { BrowserWindow } from 'electron'
 
+import type { WidgetsWindowManager } from './windows/widgets'
+
 import { platform } from 'node:process'
 
 import { electronApp, optimizer } from '@electron-toolkit/utils'
@@ -22,6 +24,7 @@ import { setupInlayWindow } from './windows/inlay'
 import { setupMainWindow } from './windows/main'
 import { setupSettingsWindowReusableFunc } from './windows/settings'
 import { toggleWindowShow } from './windows/shared/window'
+import { setupWidgetsWindowManager } from './windows/widgets'
 
 // TODO: once we refactored eventa to support window-namespaced contexts,
 // we can remove the setMaxListeners call below since eventa will be able to dispatch and
@@ -56,6 +59,7 @@ function setupTray(params: {
   mainWindow: BrowserWindow
   settingsWindow: () => Promise<BrowserWindow>
   captionWindow: ReturnType<typeof setupCaptionWindowManager>
+  widgetsWindow: WidgetsWindowManager
 }): void {
   once(() => {
     const trayImage = nativeImage.createFromPath(isMacOS ? macOSTrayIcon : icon).resize({ width: 16 })
@@ -69,6 +73,7 @@ function setupTray(params: {
       { label: 'Settings...', click: () => params.settingsWindow().then(window => toggleWindowShow(window)) },
       { type: 'separator' },
       { label: 'Open Inlay...', click: () => setupInlayWindow() },
+      { label: 'Open Widgets...', click: () => params.widgetsWindow.getWindow().then(window => toggleWindowShow(window)) },
       { label: 'Open Caption...', click: () => params.captionWindow.getWindow().then(window => toggleWindowShow(window)) },
       {
         type: 'submenu',
@@ -96,18 +101,23 @@ app.whenReady().then(async () => {
   injecta.setLogger(createLoggLogger(useLogg('injecta').useGlobalConfig()))
 
   const channelServerModule = injecta.provide('modules:channel-server', async () => setupChannelServer())
-  const settingsWindow = injecta.provide('windows:settings', () => setupSettingsWindowReusableFunc())
   const chatWindow = injecta.provide('windows:chat', { build: () => setupChatWindowReusableFunc() })
+  const widgetsManager = injecta.provide('windows:widgets', { build: () => setupWidgetsWindowManager() })
+
+  const settingsWindow = injecta.provide('windows:settings', {
+    dependsOn: { widgetsManager },
+    build: ({ dependsOn }) => setupSettingsWindowReusableFunc(dependsOn),
+  })
   const mainWindow = injecta.provide('windows:main', {
-    dependsOn: { settingsWindow, chatWindow },
+    dependsOn: { settingsWindow, chatWindow, widgetsManager },
     build: async ({ dependsOn }) => setupMainWindow(dependsOn),
   })
   const captionWindow = injecta.provide('windows:caption', {
     dependsOn: { mainWindow },
     build: async ({ dependsOn }) => setupCaptionWindowManager(dependsOn),
   })
   const tray = injecta.provide('app:tray', {
-    dependsOn: { mainWindow, settingsWindow, captionWindow },
+    dependsOn: { mainWindow, settingsWindow, captionWindow, widgetsWindow: widgetsManager },
     build: async ({ dependsOn }) => setupTray(dependsOn),
   })
   injecta.invoke({

apps/stage-tamagotchi/src/main/libs/electron/window-manager/reusable.ts

@@ -2,19 +2,34 @@ import type { BrowserWindow } from 'electron'
 
 export function createReusableWindow(setupFn: () => BrowserWindow | Promise<BrowserWindow>): { getWindow: () => Promise<BrowserWindow> } {
   let window: BrowserWindow | undefined
+  let windowSetupFnPromise: Promise<BrowserWindow> | undefined
 
-  return {
-    getWindow: async () => {
-      if (!window) {
-        window = await setupFn()
-        return window
-      }
-      if (window.isDestroyed()) {
-        window = await setupFn()
-        return window
-      }
-
+  const ensureWindow = async () => {
+    if (window && !window.isDestroyed())
       return window
-    },
+
+    if (windowSetupFnPromise)
+      return windowSetupFnPromise
+
+    windowSetupFnPromise = Promise.resolve(setupFn()).then((created) => {
+      window = created
+      windowSetupFnPromise = undefined
+
+      created.on?.('closed', () => {
+        if (window === created)
+          window = undefined
+      })
+
+      return created
+    }).catch((error) => {
+      windowSetupFnPromise = undefined
+      throw error
+    })
+
+    return windowSetupFnPromise
+  }
+
+  return {
+    getWindow: async () => ensureWindow(),
   }
 }

apps/stage-tamagotchi/src/main/services/airi/widgets/index.ts

@@ -0,0 +1,67 @@
+import type { createContext } from '@unbird/eventa/adapters/electron/main'
+import type { BrowserWindow, IpcMainEvent } from 'electron'
+
+import type { WidgetsWindowManager } from '../../../windows/widgets'
+
+import { defineInvokeHandlers } from '@unbird/eventa'
+
+import { widgetsAdd, widgetsClear, widgetsFetch, widgetsOpenWindow, widgetsPrepareWindow, widgetsRemove, widgetsUpdate } from '../../../../shared/eventa'
+
+interface InvokeOptions {
+  raw?: { ipcMainEvent?: IpcMainEvent }
+}
+
+function isFromWindow(options: InvokeOptions | undefined, window: BrowserWindow) {
+  const sender = options?.raw?.ipcMainEvent?.sender
+  if (!sender)
+    return false
+  return sender.id === window.webContents.id
+}
+
+export function createWidgetsService(params: { context: ReturnType<typeof createContext>['context'], widgetsManager: WidgetsWindowManager, window: BrowserWindow }) {
+  defineInvokeHandlers(params.context, {
+    widgetsPrepareWindow,
+    widgetsOpenWindow,
+    widgetsAdd,
+    widgetsUpdate,
+    widgetsRemove,
+    widgetsClear,
+    widgetsFetch,
+  }, {
+    widgetsPrepareWindow: async (payload, options) => {
+      if (!isFromWindow(options as InvokeOptions, params.window))
+        return undefined
+      return params.widgetsManager!.prepareWidgetWindow(payload ?? undefined)
+    },
+    widgetsOpenWindow: async (payload, options) => {
+      if (!isFromWindow(options as InvokeOptions, params.window))
+        return undefined
+      return params.widgetsManager!.openWindow(payload ?? undefined)
+    },
+    widgetsAdd: async (payload, options) => {
+      if (!isFromWindow(options as InvokeOptions, params.window))
+        return undefined
+      return payload ? params.widgetsManager!.pushWidget(payload) : undefined
+    },
+    widgetsUpdate: async (payload, options) => {
+      if (!isFromWindow(options as InvokeOptions, params.window))
+        return undefined
+      return payload ? params.widgetsManager!.updateWidget(payload) : undefined
+    },
+    widgetsRemove: async (payload, options) => {
+      if (!isFromWindow(options as InvokeOptions, params.window))
+        return undefined
+      return payload?.id ? params.widgetsManager!.removeWidget(payload.id) : undefined
+    },
+    widgetsClear: async (_payload, options) => {
+      if (!isFromWindow(options as InvokeOptions, params.window))
+        return undefined
+      return params.widgetsManager!.clearWidgets()
+    },
+    widgetsFetch: async (payload, options) => {
+      if (!isFromWindow(options as InvokeOptions, params.window))
+        return undefined
+      return payload?.id ? params.widgetsManager!.getWidgetSnapshot(payload.id) : undefined
+    },
+  })
+}

apps/stage-tamagotchi/src/main/windows/main/index.ts

@@ -1,5 +1,7 @@
 import type { BrowserWindowConstructorOptions, Rectangle } from 'electron'
 
+import type { WidgetsWindowManager } from '../widgets'
+
 import { dirname, join, resolve } from 'node:path'
 import { env } from 'node:process'
 import { fileURLToPath } from 'node:url'
@@ -28,6 +30,7 @@ interface AppConfig {
 export async function setupMainWindow(params: {
   settingsWindow: () => Promise<BrowserWindow>
   chatWindow: () => Promise<BrowserWindow>
+  widgetsManager: WidgetsWindowManager
 }) {
   const {
     setup: setupConfig,
@@ -123,7 +126,12 @@ export async function setupMainWindow(params: {
 
   await load(window, baseUrl(resolve(getElectronMainDirname(), '..', 'renderer')))
 
-  setupMainWindowElectronInvokes({ window, settingsWindow: params.settingsWindow, chatWindow: params.chatWindow })
+  setupMainWindowElectronInvokes({
+    window,
+    settingsWindow: params.settingsWindow,
+    chatWindow: params.chatWindow,
+    widgetsManager: params.widgetsManager,
+  })
 
   /**
    * This is a know issue (or expected behavior maybe) to Electron.

apps/stage-tamagotchi/src/main/windows/main/rpc/index.electron.ts

@@ -1,17 +1,21 @@
 import type { BrowserWindow } from 'electron'
 
+import type { WidgetsWindowManager } from '../../widgets'
+
 import { defineInvokeHandler } from '@unbird/eventa'
 import { createContext } from '@unbird/eventa/adapters/electron/main'
 import { ipcMain } from 'electron'
 
 import { electronOpenChat, electronOpenMainDevtools, electronOpenSettings } from '../../../../shared/eventa'
+import { createWidgetsService } from '../../../services/airi/widgets'
 import { createScreenService, createWindowService } from '../../../services/electron'
 import { toggleWindowShow } from '../../shared'
 
 export function setupMainWindowElectronInvokes(params: {
   window: BrowserWindow
   settingsWindow: () => Promise<BrowserWindow>
   chatWindow: () => Promise<BrowserWindow>
+  widgetsManager: WidgetsWindowManager
 }) {
   // TODO: once we refactored eventa to support window-namespaced contexts,
   // we can remove the setMaxListeners call below since eventa will be able to dispatch and
@@ -22,6 +26,7 @@ export function setupMainWindowElectronInvokes(params: {
 
   createScreenService({ context, window: params.window })
   createWindowService({ context, window: params.window })
+  createWidgetsService({ context, widgetsManager: params.widgetsManager, window: params.window })
 
   defineInvokeHandler(context, electronOpenMainDevtools, () => params.window.webContents.openDevTools({ mode: 'detach' }))
   defineInvokeHandler(context, electronOpenSettings, async () => toggleWindowShow(await params.settingsWindow()))

apps/stage-tamagotchi/src/main/windows/settings/index.ts

@@ -1,3 +1,5 @@
+import type { WidgetsWindowManager } from '../widgets'
+
 import { join, resolve } from 'node:path'
 
 import { BrowserWindow, shell } from 'electron'
@@ -8,7 +10,9 @@ import { baseUrl, getElectronMainDirname, load, withHashRoute } from '../../libs
 import { createReusableWindow } from '../../libs/electron/window-manager'
 import { setupSettingsWindowInvokes } from './rpc/index.electron'
 
-export function setupSettingsWindowReusableFunc() {
+export function setupSettingsWindowReusableFunc(params: {
+  widgetsManager: WidgetsWindowManager
+}) {
   return createReusableWindow(async () => {
     const window = new BrowserWindow({
       title: 'Settings',
@@ -29,7 +33,7 @@ export function setupSettingsWindowReusableFunc() {
     })
 
     await load(window, withHashRoute(baseUrl(resolve(getElectronMainDirname(), '..', 'renderer')), '/settings'))
-    await setupSettingsWindowInvokes({ settingsWindow: window })
+    await setupSettingsWindowInvokes({ settingsWindow: window, widgetsManager: params.widgetsManager })
 
     return window
   }).getWindow

apps/stage-tamagotchi/src/main/windows/settings/rpc/index.electron.ts

@@ -1,13 +1,16 @@
 import type { BrowserWindow } from 'electron'
 
+import type { WidgetsWindowManager } from '../../widgets'
+
 import { defineInvokeHandler } from '@unbird/eventa'
 import { createContext } from '@unbird/eventa/adapters/electron/main'
 import { ipcMain } from 'electron'
 
 import { electronOpenSettingsDevtools } from '../../../../shared/eventa'
+import { createWidgetsService } from '../../../services/airi/widgets'
 import { createScreenService, createWindowService } from '../../../services/electron'
 
-export async function setupSettingsWindowInvokes(params: { settingsWindow: BrowserWindow }) {
+export async function setupSettingsWindowInvokes(params: { settingsWindow: BrowserWindow, widgetsManager: WidgetsWindowManager }) {
   // TODO: once we refactored eventa to support window-namespaced contexts,
   // we can remove the setMaxListeners call below since eventa will be able to dispatch and
   // manage events within eventa's context system.
@@ -17,6 +20,7 @@ export async function setupSettingsWindowInvokes(params: { settingsWindow: Brows
 
   createScreenService({ context, window: params.settingsWindow })
   createWindowService({ context, window: params.settingsWindow })
+  createWidgetsService({ context, widgetsManager: params.widgetsManager, window: params.settingsWindow })
 
   defineInvokeHandler(context, electronOpenSettingsDevtools, async () => params.settingsWindow.webContents.openDevTools({ mode: 'detach' }))
 }