feat: update indicator

Author: kasvith

build/entitlements.mac.plist

@@ -8,5 +8,7 @@
     <true/>
     <key>com.apple.security.cs.allow-dyld-environment-variables</key>
     <true/>
+    <key>com.apple.security.cs.disable-library-validation</key>
+    <true/>
   </dict>
 </plist>

electron-builder.yml

@@ -19,6 +19,7 @@ nsis:
   uninstallDisplayName: ${productName}ß
   createDesktopShortcut: always
 mac:
+  artifactName: ${name}-${version}-${arch}-mac.${ext}
   entitlementsInherit: build/entitlements.mac.plist
   extendInfo:
     - NSCameraUsageDescription: Application requests access to the device's camera.

package.json

@@ -1,6 +1,6 @@
 {
   "name": "op-notes",
-  "version": "0.0.11",
+  "version": "0.0.10",
   "description": "Op Notes",
   "main": "./out/main/index.js",
   "author": "Kasun Vithanage",

src/main/index.ts

@@ -5,20 +5,10 @@ import icon from '../../resources/icon.png?asset'
 
 import { db, migrateToLatest } from './db'
 import { registerApi } from './api'
+import { setupAutoUpdater, registerUpdaterIpcHandlers } from './updater'
 
-import electronUpdater, { type AppUpdater } from 'electron-updater'
 import { PrintDialogArgs } from '../preload/interfaces'
 
-export function getAutoUpdater(): AppUpdater {
-  // Using destructuring to access autoUpdater due to the CommonJS module of 'electron-updater'.
-  // It is a workaround for ESM compatibility issues, see https://github.com/electron-userland/electron-builder/issues/7976.
-  const { autoUpdater } = electronUpdater
-  const log = require('electron-log')
-  log.transports.file.level = 'debug'
-  autoUpdater.logger = log
-  return autoUpdater
-}
-
 function createWindow() {
   // Create the browser window.
   const mainWindow = new BrowserWindow({
@@ -119,7 +109,16 @@ app.whenReady().then(() => {
   // Set app user model id for windows
   electronApp.setAppUserModelId('com.wavezync.opnotes')
 
-  getAutoUpdater().checkForUpdatesAndNotify()
+  // Setup auto-updater with custom event handlers
+  const autoUpdater = setupAutoUpdater()
+  registerUpdaterIpcHandlers()
+
+  // Check for updates after a short delay to allow the window to initialize
+  setTimeout(() => {
+    autoUpdater.checkForUpdates().catch((err) => {
+      console.error('Failed to check for updates:', err)
+    })
+  }, 3000)
 
   // Default open or close DevTools by F12 in development
   // and ignore CommandOrControl + R in production.

src/main/updater.ts

@@ -0,0 +1,106 @@
+import { BrowserWindow, ipcMain } from 'electron'
+import electronUpdater, { type AppUpdater, type UpdateInfo } from 'electron-updater'
+
+export type UpdateStatus =
+  | 'idle'
+  | 'checking'
+  | 'available'
+  | 'not-available'
+  | 'downloading'
+  | 'ready'
+  | 'error'
+
+export interface UpdateStatusPayload {
+  status: UpdateStatus
+  updateInfo?: UpdateInfo
+  progress?: {
+    percent: number
+    bytesPerSecond: number
+    transferred: number
+    total: number
+  }
+  error?: string
+}
+
+let autoUpdater: AppUpdater | null = null
+
+function getMainWindow(): BrowserWindow | null {
+  const windows = BrowserWindow.getAllWindows()
+  return windows.length > 0 ? windows[0] : null
+}
+
+function sendUpdateStatus(payload: UpdateStatusPayload): void {
+  const mainWindow = getMainWindow()
+  if (mainWindow && !mainWindow.isDestroyed()) {
+    mainWindow.webContents.send('update-status', payload)
+  }
+}
+
+export function setupAutoUpdater(): AppUpdater {
+  const { autoUpdater: updater } = electronUpdater
+  const log = require('electron-log')
+  log.transports.file.level = 'debug'
+  updater.logger = log
+
+  updater.autoDownload = false
+  updater.autoInstallOnAppQuit = true
+
+  autoUpdater = updater
+
+  updater.on('checking-for-update', () => {
+    sendUpdateStatus({ status: 'checking' })
+  })
+
+  updater.on('update-available', (info: UpdateInfo) => {
+    sendUpdateStatus({ status: 'available', updateInfo: info })
+  })
+
+  updater.on('update-not-available', (info: UpdateInfo) => {
+    sendUpdateStatus({ status: 'not-available', updateInfo: info })
+  })
+
+  updater.on('download-progress', (progress) => {
+    sendUpdateStatus({
+      status: 'downloading',
+      progress: {
+        percent: progress.percent,
+        bytesPerSecond: progress.bytesPerSecond,
+        transferred: progress.transferred,
+        total: progress.total
+      }
+    })
+  })
+
+  updater.on('update-downloaded', (info: UpdateInfo) => {
+    sendUpdateStatus({ status: 'ready', updateInfo: info })
+  })
+
+  updater.on('error', (error: Error) => {
+    sendUpdateStatus({ status: 'error', error: error.message })
+  })
+
+  return updater
+}
+
+export function registerUpdaterIpcHandlers(): void {
+  ipcMain.handle('checkForUpdates', async () => {
+    if (!autoUpdater) {
+      throw new Error('Auto updater not initialized')
+    }
+    return await autoUpdater.checkForUpdates()
+  })
+
+  ipcMain.handle('downloadUpdate', async () => {
+    if (!autoUpdater) {
+      throw new Error('Auto updater not initialized')
+    }
+    await autoUpdater.downloadUpdate()
+  })
+
+  ipcMain.handle('quitAndInstall', () => {
+    if (!autoUpdater) {
+      throw new Error('Auto updater not initialized')
+    }
+    autoUpdater.quitAndInstall()
+  })
+}

src/preload/index.d.ts

@@ -1,12 +1,16 @@
 import { ElectronAPI } from '@electron-toolkit/preload'
 import type { ApiType } from '../main/api'
-import { PrintDialogArgs } from './interfaces'
+import { PrintDialogArgs, UpdateStatusPayload } from './interfaces'
 
 type ElectronApi = ElectronAPI & {
   getAppVersion: () => Promise<string>
   boot: () => Promise<boolean>
   openPrintDialog: (options: PrintDialogArgs) => Promise<void>
   onPrintData: (callback: (options: PrintDialogArgs) => void) => void
+  checkForUpdates: () => Promise<unknown>
+  downloadUpdate: () => Promise<void>
+  quitAndInstall: () => Promise<void>
+  onUpdateStatus: (callback: (payload: UpdateStatusPayload) => void) => () => void
 }
 
 declare global {

src/preload/index.ts

@@ -1,6 +1,6 @@
 import { contextBridge, ipcRenderer } from 'electron'
 import { electronAPI } from '@electron-toolkit/preload'
-import { PrintDialogArgs } from './interfaces'
+import { PrintDialogArgs, UpdateStatusPayload } from './interfaces'
 
 // Use `contextBridge` APIs to expose Electron APIs to
 // renderer only if context isolation is enabled, otherwise
@@ -29,12 +29,36 @@ const openPrintDialog = async (options: PrintDialogArgs) => {
 const onPrintData = (callback: (options: PrintDialogArgs) => void) =>
   ipcRenderer.on('printData', (_, options) => callback(options))
 
+const checkForUpdates = async () => {
+  return await ipcRenderer.invoke('checkForUpdates')
+}
+
+const downloadUpdate = async () => {
+  return await ipcRenderer.invoke('downloadUpdate')
+}
+
+const quitAndInstall = () => {
+  return ipcRenderer.invoke('quitAndInstall')
+}
+
+const onUpdateStatus = (callback: (payload: UpdateStatusPayload) => void) => {
+  const handler = (_: Electron.IpcRendererEvent, payload: UpdateStatusPayload) => callback(payload)
+  ipcRenderer.on('update-status', handler)
+  return () => {
+    ipcRenderer.removeListener('update-status', handler)
+  }
+}
+
 const electronApi = {
   ...electronAPI,
   getAppVersion,
   boot,
   openPrintDialog,
-  onPrintData
+  onPrintData,
+  checkForUpdates,
+  downloadUpdate,
+  quitAndInstall,
+  onUpdateStatus
 }
 
 if (process.contextIsolated) {

src/preload/interfaces.ts

@@ -2,3 +2,29 @@ export interface PrintDialogArgs {
   title?: string
   data?: object
 }
+
+export type UpdateStatus =
+  | 'idle'
+  | 'checking'
+  | 'available'
+  | 'not-available'
+  | 'downloading'
+  | 'ready'
+  | 'error'
+
+export interface UpdateStatusPayload {
+  status: UpdateStatus
+  updateInfo?: {
+    version: string
+    releaseNotes?: string | null
+    releaseName?: string | null
+    releaseDate?: string
+  }
+  progress?: {
+    percent: number
+    bytesPerSecond: number
+    transferred: number
+    total: number
+  }
+  error?: string
+}