[v17] Show app updater in UI

lib/teleterm/autoupdate/service.go

@@ -96,7 +96,7 @@ func (s *Service) GetClusterVersions(ctx context.Context, _ *api.GetClusterVersi
 				mu.Lock()
 				unreachableClusters = append(unreachableClusters, &api.UnreachableCluster{
 					ClusterUri:   cluster.URI.String(),
-					ErrorMessage: err.Error(),
+					ErrorMessage: pingErr.Error(),
 				})
 				mu.Unlock()
 				return nil
@@ -147,6 +147,7 @@ func (s *Service) GetDownloadBaseUrl(_ context.Context, _ *api.GetDownloadBaseUr
 func resolveBaseURL() (string, error) {
 	envBaseURL := os.Getenv(autoupdate.BaseURLEnvVar)
 	if envBaseURL != "" {
+		// TODO(gzdunek): Validate if it's correct URL.
 		return envBaseURL, nil
 	}
 

web/packages/design/src/StepSlider/StepSlider.tsx

@@ -61,6 +61,7 @@ export function StepSlider<Flows>(props: Props<Flows>) {
     defaultStepIndex = 0,
     tDuration = 500,
     wrapping = false,
+    className,
     // extraProps are the props required by our step components defined in our flows.
     ...extraProps
   } = props;
@@ -274,7 +275,7 @@ export function StepSlider<Flows>(props: Props<Flows>) {
   const transitionRef = keyToNodeRef.current.get(key);
 
   return (
-    <Box ref={rootRef} style={rootStyle}>
+    <Box ref={rootRef} style={rootStyle} className={className}>
       {preMount && <HiddenBox>{$preContent}</HiddenBox>}
       <Wrap className={animationDirectionPrefix} tDuration={tDuration}>
         <TransitionGroup component={null}>
@@ -420,6 +421,8 @@ type Props<Flows> =
          * one and backwards from the first one to the last one.
          */
         wrapping?: boolean;
+        /** Allows styling of the container element. */
+        className?: string;
       } & ExtraProps // Extra props that are passed to each step component. Each step of each flow needs to accept the same set of extra props.
     : any;
 

web/packages/teleterm/src/mainProcess/fixtures/mocks.ts

@@ -177,6 +177,26 @@ export class MockMainProcessClient implements MainProcessClient {
   async selectDirectoryForDesktopSession() {
     return '';
   }
+
+  supportsAppUpdates() {
+    return true;
+  }
+  async changeAppUpdatesManagingCluster() {}
+  async maybeRemoveAppUpdatesManagingCluster() {}
+  async checkForAppUpdates() {}
+  async downloadAppUpdate() {}
+  async cancelAppUpdateDownload() {}
+  async quitAndInstallAppUpdate() {}
+  subscribeToAppUpdateEvents(): {
+    cleanup: () => void;
+  } {
+    return { cleanup: () => undefined };
+  }
+  subscribeToOpenAppUpdateDialog(): {
+    cleanup: () => void;
+  } {
+    return { cleanup: () => undefined };
+  }
 }
 
 export const makeRuntimeSettings = (

web/packages/teleterm/src/mainProcess/ipcSerializer.ts

@@ -0,0 +1,43 @@
+/**
+ * Teleport
+ * Copyright (C) 2025 Gravitational, Inc.
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU Affero General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU Affero General Public License for more details.
+ *
+ * You should have received a copy of the GNU Affero General Public License
+ * along with this program.  If not, see <http://www.gnu.org/licenses/>.
+ */
+
+export type SerializedError = {
+  name: string;
+  message: string;
+  stack?: string;
+  cause?: unknown;
+};
+
+/** Serializes an Error into a plain object for transport through Electron IPC. */
+export function serializeError(error: Error): SerializedError {
+  return {
+    name: error.name,
+    message: error.message,
+    cause: error.cause,
+    stack: error.stack,
+  };
+}
+
+/** Deserializes a plain object back into an Error instance. */
+export function deserializeError(serialized: SerializedError): Error {
+  const error = new Error(serialized.message);
+  error.name = serialized.name;
+  error.cause = serialized.cause;
+  error.stack = serialized.stack;
+  return error;
+}

web/packages/teleterm/src/mainProcess/mainProcess.ts

@@ -83,6 +83,7 @@ import {
   removeAgentDirectory,
   type CreateAgentConfigFileArgs,
 } from './createAgentConfigFile';
+import { serializeError } from './ipcSerializer';
 import { ResolveError, resolveNetworkAddress } from './resolveNetworkAddress';
 import { terminateWithTimeout } from './terminateWithTimeout';
 import { WindowsManager } from './windowsManager';
@@ -161,7 +162,15 @@ export default class MainProcess {
     this.appUpdater = new AppUpdater(
       makeAppUpdaterStorage(this.appStateFileStorage),
       getClusterVersions,
-      getDownloadBaseUrl
+      getDownloadBaseUrl,
+      event => {
+        if (event.kind === 'error') {
+          event.error = serializeError(event.error);
+        }
+        this.windowsManager
+          .getWindow()
+          .webContents.send(RendererIpc.AppUpdateEvent, event);
+      }
     );
   }
 
@@ -180,8 +189,8 @@ export default class MainProcess {
 
   async dispose(): Promise<void> {
     this.windowsManager.dispose();
-    this.appUpdater.dispose();
     await Promise.all([
+      this.appUpdater.dispose(),
       // sending usage events on tshd shutdown has 10-seconds timeout
       terminateWithTimeout(this.tshdProcess, 10_000, () => {
         this.gracefullyKillTshdProcess();
@@ -639,6 +648,46 @@ export default class MainProcess {
       }
     );
 
+    ipcMain.on(MainProcessIpc.SupportsAppUpdates, event => {
+      event.returnValue = this.appUpdater.supportsUpdates();
+    });
+
+    ipcMain.handle(MainProcessIpc.CheckForAppUpdates, () =>
+      this.appUpdater.checkForUpdates()
+    );
+
+    ipcMain.handle(
+      MainProcessIpc.ChangeAppUpdatesManagingCluster,
+      (
+        event,
+        args: {
+          clusterUri: RootClusterUri | undefined;
+        }
+      ) => this.appUpdater.changeManagingCluster(args.clusterUri)
+    );
+
+    ipcMain.handle(
+      MainProcessIpc.MaybeRemoveAppUpdatesManagingCluster,
+      (
+        event,
+        args: {
+          clusterUri: RootClusterUri;
+        }
+      ) => this.appUpdater.maybeRemoveManagingCluster(args.clusterUri)
+    );
+
+    ipcMain.handle(MainProcessIpc.DownloadAppUpdate, () =>
+      this.appUpdater.download()
+    );
+
+    ipcMain.handle(MainProcessIpc.CancelAppUpdateDownload, () =>
+      this.appUpdater.cancelDownload()
+    );
+
+    ipcMain.handle(MainProcessIpc.QuiteAndInstallAppUpdate, () =>
+      this.appUpdater.quitAndInstall()
+    );
+
     subscribeToTerminalContextMenuEvent(this.configService);
     subscribeToTabContextMenuEvent(
       this.settings.availableShells,
@@ -673,7 +722,28 @@ export default class MainProcess {
         };
 
     const macTemplate: MenuItemConstructorOptions[] = [
-      { role: 'appMenu' },
+      {
+        role: 'appMenu',
+        submenu: [
+          { role: 'about' },
+          {
+            label: 'Check for Updates…',
+            click: () => {
+              this.windowsManager
+                .getWindow()
+                .webContents.send(RendererIpc.OpenAppUpdateDialog);
+            },
+          },
+          { type: 'separator' },
+          { role: 'services' },
+          { type: 'separator' },
+          { role: 'hide' },
+          { role: 'hideOthers' },
+          { role: 'unhide' },
+          { type: 'separator' },
+          { role: 'quit' },
+        ],
+      },
       { role: 'editMenu' },
       viewMenuTemplate,
       {

web/packages/teleterm/src/mainProcess/mainProcessClient.ts

@@ -19,6 +19,7 @@
 import { ipcRenderer } from 'electron';
 
 import { CreateAgentConfigFileArgs } from 'teleterm/mainProcess/createAgentConfigFile';
+import { AppUpdateEvent } from 'teleterm/services/appUpdater';
 import { createFileStorageClient } from 'teleterm/services/fileStorage';
 import { RootClusterUri } from 'teleterm/ui/uri';
 
@@ -199,5 +200,54 @@ export default function createMainProcessClient(): MainProcessClient {
         args
       );
     },
+    supportsAppUpdates() {
+      return ipcRenderer.sendSync(MainProcessIpc.SupportsAppUpdates);
+    },
+    checkForAppUpdates() {
+      return ipcRenderer.invoke(MainProcessIpc.CheckForAppUpdates);
+    },
+    downloadAppUpdate() {
+      return ipcRenderer.invoke(MainProcessIpc.DownloadAppUpdate);
+    },
+    cancelAppUpdateDownload() {
+      return ipcRenderer.invoke(MainProcessIpc.CancelAppUpdateDownload);
+    },
+    quitAndInstallAppUpdate() {
+      return ipcRenderer.invoke(MainProcessIpc.QuiteAndInstallAppUpdate);
+    },
+    changeAppUpdatesManagingCluster(clusterUri) {
+      return ipcRenderer.invoke(
+        MainProcessIpc.ChangeAppUpdatesManagingCluster,
+        {
+          clusterUri,
+        }
+      );
+    },
+    maybeRemoveAppUpdatesManagingCluster(clusterUri) {
+      return ipcRenderer.invoke(
+        MainProcessIpc.MaybeRemoveAppUpdatesManagingCluster,
+        {
+          clusterUri,
+        }
+      );
+    },
+    subscribeToAppUpdateEvents: listener => {
+      const ipcListener = (_, updateEvent: AppUpdateEvent) => {
+        listener(updateEvent);
+      };
+
+      ipcRenderer.addListener(RendererIpc.AppUpdateEvent, ipcListener);
+      return {
+        cleanup: () =>
+          ipcRenderer.removeListener(RendererIpc.AppUpdateEvent, ipcListener),
+      };
+    },
+    subscribeToOpenAppUpdateDialog: listener => {
+      ipcRenderer.addListener(RendererIpc.OpenAppUpdateDialog, listener);
+      return {
+        cleanup: () =>
+          ipcRenderer.removeListener(RendererIpc.OpenAppUpdateDialog, listener),
+      };
+    },
   };
 }

web/packages/teleterm/src/mainProcess/types.ts

@@ -18,6 +18,7 @@
 
 import { DeepLinkParseResult } from 'teleterm/deepLinks';
 import { CreateAgentConfigFileArgs } from 'teleterm/mainProcess/createAgentConfigFile';
+import { AppUpdateEvent } from 'teleterm/services/appUpdater';
 import { FileStorage } from 'teleterm/services/fileStorage';
 import { Document } from 'teleterm/ui/services/workspacesService';
 import { RootClusterUri } from 'teleterm/ui/uri';
@@ -146,10 +147,10 @@ export type MainProcessClient = {
    * Tells the OS to focus the window. If wait is true, polls periodically for window status and
    * resolves when it's focused or after a short timeout.
    *
-   * Most of the time wait shouldn't be used, it's there for use cases where it's important for the
-   * app to be focused (e.g., the business logic needs to use the clipboard API). Even in that case,
-   * the logic must handle a scenario where focus wasn't received as focus cannot be guaranteed.
-   * Any app can steal focus at any time.
+   * Most of the time wait shouldn't be used. It's for use cases where the app must be focused
+   * before carrying out the rest of the logic (e.g., the clipboard API requires focus). Even in
+   * those cases, the logic must handle a scenario where focus wasn't received as focus cannot be
+   * guaranteed. Any app can steal focus at any time.
    */
   forceFocusWindow(
     args?: { wait?: false } | { wait: true; signal?: AbortSignal }
@@ -206,6 +207,23 @@ export type MainProcessClient = {
     desktopUri: string;
     login: string;
   }): Promise<string>;
+  changeAppUpdatesManagingCluster(
+    clusterUri: RootClusterUri | undefined
+  ): Promise<void>;
+  maybeRemoveAppUpdatesManagingCluster(
+    clusterUri: RootClusterUri
+  ): Promise<void>;
+  supportsAppUpdates(): boolean;
+  checkForAppUpdates(): Promise<void>;
+  downloadAppUpdate(): Promise<void>;
+  cancelAppUpdateDownload(): Promise<void>;
+  quitAndInstallAppUpdate(): Promise<void>;
+  subscribeToAppUpdateEvents(listener: (args: AppUpdateEvent) => void): {
+    cleanup: () => void;
+  };
+  subscribeToOpenAppUpdateDialog(listener: () => void): {
+    cleanup: () => void;
+  };
 };
 
 export type ChildProcessAddresses = {
@@ -311,6 +329,8 @@ export enum RendererIpc {
   NativeThemeUpdate = 'renderer-native-theme-update',
   ConnectMyComputerAgentUpdate = 'renderer-connect-my-computer-agent-update',
   DeepLinkLaunch = 'renderer-deep-link-launch',
+  OpenAppUpdateDialog = 'renderer-open-app-update-dialog',
+  AppUpdateEvent = 'renderer-app-update-event',
 }
 
 export enum MainProcessIpc {
@@ -322,6 +342,13 @@ export enum MainProcessIpc {
   SaveTextToFile = 'main-process-save-text-to-file',
   ForceFocusWindow = 'main-process-force-focus-window',
   SelectDirectoryForDesktopSession = 'main-process-select-directory-for-desktop-session',
+  CheckForAppUpdates = 'main-process-check-for-app-updates',
+  DownloadAppUpdate = 'main-process-download-app-update',
+  CancelAppUpdateDownload = 'main-process-cancel-app-update-download',
+  QuiteAndInstallAppUpdate = 'main-process-quit-and-install-app-update',
+  ChangeAppUpdatesManagingCluster = 'main-process-change-app-updates-managing-cluster',
+  MaybeRemoveAppUpdatesManagingCluster = 'main-process-maybe-remove-app-updates-managing-cluster',
+  SupportsAppUpdates = 'main-process-supports-app-updates',
 }
 
 export enum WindowsManagerIpc {