ability to upgrade to latest daemon while the app is running

hostd/electron-src/download.ts

@@ -18,6 +18,7 @@ export async function downloadRelease(): Promise<void> {
 
     const release = releaseData.data
     const asset = release.assets.find((asset) => asset.name === releaseAsset())
+    console.log(`Downloading ${releaseAsset()}`)
 
     if (asset) {
       console.log('Release name:', release.name)

hostd/electron-src/ipc.ts

@@ -14,6 +14,7 @@ import {
   getIsConfigured,
   saveConfig,
 } from './config'
+import { downloadRelease } from './download'
 
 export function initIpc() {
   ipcMain.handle('open-browser', (_, url: string) => {
@@ -26,8 +27,10 @@ export function initIpc() {
     await stopDaemon()
   })
   ipcMain.handle('daemon-is-running', (_) => {
-    const isDaemonRunning = getIsDaemonRunning()
-    return isDaemonRunning
+    return getIsDaemonRunning()
+  })
+  ipcMain.handle('daemon-update', async (_) => {
+    await downloadRelease()
   })
   ipcMain.handle('config-get', (_) => {
     const config = getConfig()

hostd/electron-src/preload.ts

@@ -10,6 +10,7 @@ contextBridge.exposeInMainWorld('electron', {
   checkIsDaemonRunning: () => ipcRenderer.invoke('daemon-is-running'),
   daemonStart: () => ipcRenderer.invoke('daemon-start'),
   daemonStop: () => ipcRenderer.invoke('daemon-stop'),
+  daemonUpdate: () => ipcRenderer.invoke('daemon-update'),
   openBrowser: (url: string) => ipcRenderer.invoke('open-browser', url),
   getConfig: () => ipcRenderer.invoke('config-get'),
   saveConfig: (config: Config) => ipcRenderer.invoke('config-save', config),

hostd/electron-src/startup.ts

@@ -1,6 +1,6 @@
 import { startDaemon } from './daemon'
 import { getIsConfigured } from './config'
-import { state } from './state'
+import { state, system } from './state'
 
 export function startup() {
   // If the app is already configured, start the daemon and open browser
@@ -9,4 +9,10 @@ export function startup() {
     startDaemon()
     state.mainWindow?.close()
   }
+
+  if (system.isDev) {
+    state.mainWindow?.setMaximumSize(2000, 2000)
+    state.mainWindow?.setSize(1000, 800)
+    state.mainWindow?.webContents.openDevTools()
+  }
 }

hostd/electron-src/state.ts

@@ -1,5 +1,6 @@
 import { ChildProcess } from 'child_process'
 import { BrowserWindow, Tray } from 'electron'
+import isDev from 'electron-is-dev'
 
 export let state: {
   mainWindow: BrowserWindow | null
@@ -14,10 +15,12 @@ export let state: {
 }
 
 export const system: {
+  isDev: boolean
   isDarwin: boolean
   isLinux: boolean
   isWindows: boolean
 } = {
+  isDev,
   isDarwin: process.platform === 'darwin',
   isLinux: process.platform === 'linux',
   isWindows: process.platform === 'win32',

hostd/electron-src/tray.ts

@@ -1,11 +1,10 @@
 import path from 'path'
 import { app, Tray, Menu } from 'electron'
-import isDev from 'electron-is-dev'
 import { state, system } from './state'
 
 export function initTray() {
   const iconName = system.isDarwin ? 'tray.png' : 'tray-win.png'
-  const iconPath = isDev
+  const iconPath = system.isDev
     ? path.join(process.cwd(), 'assets', iconName)
     : path.join(__dirname, '../assets', iconName)
 

hostd/electron-src/window.ts

@@ -1,6 +1,5 @@
 import path, { join } from 'path'
 import { BrowserWindow, app } from 'electron'
-import isDev from 'electron-is-dev'
 import { format } from 'url'
 import { state, system } from './state'
 
@@ -45,18 +44,12 @@ export function initWindow() {
     return false
   })
 
-  const url = isDev
+  const url = system.isDev
     ? 'http://localhost:8000/'
     : format({
         pathname: path.join(__dirname, '../renderer/out/index.html'),
         protocol: 'file:',
         slashes: true,
       })
   state.mainWindow.loadURL(url)
-
-  if (isDev) {
-    state.mainWindow.setMaximumSize(2000, 2000)
-    state.mainWindow.setSize(1000, 800)
-    state.mainWindow.webContents.openDevTools()
-  }
 }

hostd/renderer/components/UpdateBanner.tsx

@@ -1,21 +1,81 @@
 'use client'
 
-import { Text } from '@siafoundation/design-system'
+import {
+  LoadingDots,
+  Text,
+  triggerErrorToast,
+  triggerSuccessToast,
+} from '@siafoundation/design-system'
 import { Upgrade16 } from '@siafoundation/react-icons'
 import { useLatestVersion } from './useLatestVersion'
 import { useInstalledVersion } from './useInstalledVersion'
+import { useCallback, useState } from 'react'
 
 export function UpdateBanner() {
   const latestVersion = useLatestVersion()
   const installedVersion = useInstalledVersion()
+  const [isUpdating, setIsUpdating] = useState(false)
+  const [isRestarting, setIsRestarting] = useState(false)
+
+  const update = useCallback(async () => {
+    try {
+      setIsUpdating(true)
+      await window.electron.daemonUpdate()
+    } catch (e) {
+      console.log(e)
+      triggerErrorToast('Error downloading update. Please try again.')
+      setIsUpdating(false)
+      setIsRestarting(false)
+      return
+    }
+    try {
+      setIsRestarting(true)
+      await window.electron.daemonStart()
+    } catch (e) {
+      console.log(e)
+      triggerErrorToast('Error restarting daemon. Please try again.')
+      setIsUpdating(false)
+      setIsRestarting(false)
+      return
+    }
+    triggerSuccessToast(`Updated to hostd version ${installedVersion.data}.`)
+    setIsUpdating(false)
+    setIsRestarting(false)
+  }, [setIsUpdating, installedVersion.data])
+
+  if (latestVersion.data === installedVersion.data) {
+    return null
+  }
+
   return (
-    <div className="flex w-full gap-2 items-center justify-center py-2 px-3 bg-amber-600 dark:bg-amber-500">
-      <Text color="lo">
-        <Upgrade16 />
-      </Text>
-      <Text size="14" color="lo">
-        An update to version {latestVersion.data} is available.
-      </Text>
+    <div
+      className="flex w-full gap-2 items-center justify-center py-2 px-3 bg-amber-600 dark:bg-amber-500 cursor-pointer"
+      onClick={update}
+    >
+      {isRestarting ? (
+        <>
+          <LoadingDots />
+          <Text size="14" color="lo">
+            Restarting hostd daemon {latestVersion.data}
+          </Text>
+        </>
+      ) : isUpdating ? (
+        <>
+          <LoadingDots />
+          <Text size="14" color="lo">
+            Updating to hostd {latestVersion.data}
+          </Text>
+        </>
+      ) : (
+        <>
+          <Text color="lo">
+            <Upgrade16 />
+          </Text>
+          <Text size="14" color="lo">
+            An update to hostd {latestVersion.data} is available.
+          </Text>
+        </>
+      )}
     </div>
   )
 }

hostd/renderer/renderer.d.ts

@@ -5,6 +5,7 @@ export interface API {
   openBrowser: (url: string) => Promise<void>
   daemonStart: () => Promise<void>
   daemonStop: () => Promise<void>
+  daemonUpdate: () => Promise<void>
   getConfig: () => Promise<Config>
   openDataDirectory: () => Promise<void>
   getIsConfigured: () => Promise<boolean>

renterd/electron-src/download.ts

@@ -18,6 +18,7 @@ export async function downloadRelease(): Promise<void> {
 
     const release = releaseData.data
     const asset = release.assets.find((asset) => asset.name === releaseAsset())
+    console.log(`Downloading ${releaseAsset()}`)
 
     if (asset) {
       console.log('Release name:', release.name)

renterd/electron-src/ipc.ts

@@ -14,6 +14,7 @@ import {
   getIsConfigured,
   saveConfig,
 } from './config'
+import { downloadRelease } from './download'
 
 export function initIpc() {
   ipcMain.handle('open-browser', (_, url: string) => {
@@ -26,8 +27,10 @@ export function initIpc() {
     await stopDaemon()
   })
   ipcMain.handle('daemon-is-running', (_) => {
-    const isDaemonRunning = getIsDaemonRunning()
-    return isDaemonRunning
+    return getIsDaemonRunning()
+  })
+  ipcMain.handle('daemon-update', async (_) => {
+    await downloadRelease()
   })
   ipcMain.handle('config-get', (_) => {
     const config = getConfig()

renterd/electron-src/preload.ts

@@ -10,6 +10,7 @@ contextBridge.exposeInMainWorld('electron', {
   checkIsDaemonRunning: () => ipcRenderer.invoke('daemon-is-running'),
   daemonStart: () => ipcRenderer.invoke('daemon-start'),
   daemonStop: () => ipcRenderer.invoke('daemon-stop'),
+  daemonUpdate: () => ipcRenderer.invoke('daemon-update'),
   openBrowser: (url: string) => ipcRenderer.invoke('open-browser', url),
   getConfig: () => ipcRenderer.invoke('config-get'),
   saveConfig: (config: Config) => ipcRenderer.invoke('config-save', config),

renterd/electron-src/startup.ts

@@ -1,7 +1,7 @@
 import { shell } from 'electron'
 import { startDaemon } from './daemon'
 import { getConfig, getIsConfigured } from './config'
-import { state } from './state'
+import { state, system } from './state'
 
 export function startup() {
   // If the app is already configured, start the daemon and open browser
@@ -11,4 +11,10 @@ export function startup() {
     state.mainWindow?.close()
     shell.openExternal(`http://${getConfig().http.address}`)
   }
+
+  if (system.isDev) {
+    state.mainWindow?.setMaximumSize(2000, 2000)
+    state.mainWindow?.setSize(1000, 800)
+    state.mainWindow?.webContents.openDevTools()
+  }
 }

renterd/electron-src/state.ts

@@ -1,5 +1,6 @@
 import { ChildProcess } from 'child_process'
 import { BrowserWindow, Tray } from 'electron'
+import isDev from 'electron-is-dev'
 
 export let state: {
   mainWindow: BrowserWindow | null
@@ -14,10 +15,12 @@ export let state: {
 }
 
 export const system: {
+  isDev: boolean
   isDarwin: boolean
   isLinux: boolean
   isWindows: boolean
 } = {
+  isDev: isDev,
   isDarwin: process.platform === 'darwin',
   isLinux: process.platform === 'linux',
   isWindows: process.platform === 'win32',

renterd/electron-src/tray.ts

@@ -1,11 +1,10 @@
 import path from 'path'
 import { app, Tray, Menu } from 'electron'
-import isDev from 'electron-is-dev'
 import { state, system } from './state'
 
 export function initTray() {
   const iconName = system.isDarwin ? 'tray.png' : 'tray-win.png'
-  const iconPath = isDev
+  const iconPath = system.isDev
     ? path.join(process.cwd(), 'assets', iconName)
     : path.join(__dirname, '../assets', iconName)
 

renterd/electron-src/window.ts

@@ -1,6 +1,5 @@
 import path, { join } from 'path'
 import { BrowserWindow, app } from 'electron'
-import isDev from 'electron-is-dev'
 import { format } from 'url'
 import { state, system } from './state'
 
@@ -45,18 +44,12 @@ export function initWindow() {
     return false
   })
 
-  const url = isDev
+  const url = system.isDev
     ? 'http://localhost:8000/'
     : format({
         pathname: path.join(__dirname, '../renderer/out/index.html'),
         protocol: 'file:',
         slashes: true,
       })
   state.mainWindow.loadURL(url)
-
-  if (isDev) {
-    state.mainWindow.setMaximumSize(2000, 2000)
-    state.mainWindow.setSize(1000, 800)
-    state.mainWindow.webContents.openDevTools()
-  }
 }