feat(core): add manual check for updates (#4957)

work for #4523

add `appBuildType` to `runtimeConfig`
add `useAppUpdater` to manage client updates

<!--
copilot:summary
-->
### <samp>🤖[[deprecated]](https://githubnext.com/copilot-for-prs-sunset) Generated by Copilot at cdd012c</samp>

This pull request refactors and enhances the update functionality for the frontend. It introduces a new custom hook `useAppUpdater` that simplifies the update logic and state management, and uses it in various components and commands. It also adds more options and feedback for the user to control and monitor the update process, such as manual download, auto-check, and auto-download toggles, and update status and progress indicators. It also updates the `AboutAffine` component to show the app icon, version, and build type. It also adds new translations, dependencies, types, and schemas related to the update functionality.

<img width="1073" alt="image" src="https://github.com/toeverything/AFFiNE/assets/102217452/16ae7a6a-0035-4e57-902b-6b8f63169501">

packages/frontend/component/src/components/app-sidebar/app-updater-button/index.jotai.ts

@@ -1,69 +0,0 @@
-import { isBrowser } from '@affine/env/constant';
-import type { UpdateMeta } from '@toeverything/infra/type';
-import { atomWithObservable, atomWithStorage } from 'jotai/utils';
-import { Observable } from 'rxjs';
-
-// todo: move to utils?
-function rpcToObservable<
-  T,
-  H extends () => Promise<T>,
-  E extends (callback: (t: T) => void) => () => void,
->(
-  initialValue: T | null,
-  {
-    event,
-    handler,
-    onSubscribe,
-  }: {
-    event?: E;
-    handler?: H;
-    onSubscribe?: () => void;
-  }
-): Observable<T | null> {
-  return new Observable<T | null>(subscriber => {
-    subscriber.next(initialValue);
-    onSubscribe?.();
-    if (!isBrowser || !environment.isDesktop || !event) {
-      subscriber.complete();
-      return;
-    }
-    handler?.()
-      .then(t => {
-        subscriber.next(t);
-      })
-      .catch(err => {
-        subscriber.error(err);
-      });
-    return event(t => {
-      subscriber.next(t);
-    });
-  });
-}
-
-export const updateReadyAtom = atomWithObservable(() => {
-  return rpcToObservable(null as UpdateMeta | null, {
-    event: window.events?.updater.onUpdateReady,
-  });
-});
-
-export const updateAvailableAtom = atomWithObservable(() => {
-  return rpcToObservable(null as UpdateMeta | null, {
-    event: window.events?.updater.onUpdateAvailable,
-    onSubscribe: () => {
-      window.apis?.updater.checkForUpdatesAndNotify().catch(err => {
-        console.error(err);
-      });
-    },
-  });
-});
-
-export const downloadProgressAtom = atomWithObservable(() => {
-  return rpcToObservable(null as number | null, {
-    event: window.events?.updater.onDownloadProgress,
-  });
-});
-
-export const changelogCheckedAtom = atomWithStorage<Record<string, boolean>>(
-  'affine:client-changelog-checked',
-  {}
-);

packages/frontend/component/src/components/app-sidebar/app-updater-button/index.tsx

@@ -1,18 +1,21 @@
-import { isBrowser, Unreachable } from '@affine/env/constant';
+import { Unreachable } from '@affine/env/constant';
 import { useAFFiNEI18N } from '@affine/i18n/hooks';
 import { CloseIcon, NewIcon, ResetIcon } from '@blocksuite/icons';
 import { Tooltip } from '@toeverything/components/tooltip';
-import clsx from 'clsx';
-import { atom, useAtomValue, useSetAtom } from 'jotai';
-import { startTransition, useCallback, useState } from 'react';
-
-import * as styles from './index.css';
 import {
   changelogCheckedAtom,
+  currentChangelogUnreadAtom,
+  currentVersionAtom,
   downloadProgressAtom,
   updateAvailableAtom,
   updateReadyAtom,
-} from './index.jotai';
+  useAppUpdater,
+} from '@toeverything/hooks/use-app-updater';
+import clsx from 'clsx';
+import { useAtomValue, useSetAtom } from 'jotai';
+import { startTransition, useCallback } from 'react';
+
+import * as styles from './index.css';
 
 export interface AddPageButtonPureProps {
   onClickUpdate: () => void;
@@ -29,26 +32,6 @@ export interface AddPageButtonPureProps {
   style?: React.CSSProperties;
 }
 
-const currentVersionAtom = atom(async () => {
-  if (!isBrowser) {
-    return null;
-  }
-  const currentVersion = await window.apis?.updater.currentVersion();
-  return currentVersion;
-});
-
-const currentChangelogUnreadAtom = atom(async get => {
-  if (!isBrowser) {
-    return false;
-  }
-  const mapping = get(changelogCheckedAtom);
-  const currentVersion = await get(currentVersionAtom);
-  if (currentVersion) {
-    return !mapping[currentVersion];
-  }
-  return false;
-});
-
 export function AppUpdaterButtonPure({
   updateReady,
   onClickUpdate,
@@ -198,12 +181,12 @@ export function AppUpdaterButton({
   const currentChangelogUnread = useAtomValue(currentChangelogUnreadAtom);
   const updateReady = useAtomValue(updateReadyAtom);
   const updateAvailable = useAtomValue(updateAvailableAtom);
-  const currentVersion = useAtomValue(currentVersionAtom);
   const downloadProgress = useAtomValue(downloadProgressAtom);
+  const currentVersion = useAtomValue(currentVersionAtom);
+  const { quitAndInstall, appQuitting } = useAppUpdater();
   const setChangelogCheckAtom = useSetAtom(changelogCheckedAtom);
-  const [appQuitting, setAppQuitting] = useState(false);
 
-  const onDismissCurrentChangelog = useCallback(() => {
+  const dismissCurrentChangelog = useCallback(() => {
     if (!currentVersion) {
       return;
     }
@@ -216,13 +199,10 @@ export function AppUpdaterButton({
       })
     );
   }, [currentVersion, setChangelogCheckAtom]);
-  const onClickUpdate = useCallback(() => {
+
+  const handleClickUpdate = useCallback(() => {
     if (updateReady) {
-      setAppQuitting(true);
-      window.apis?.updater.quitAndInstall().catch(err => {
-        // TODO: add error toast here
-        console.error(err);
-      });
+      quitAndInstall();
     } else if (updateAvailable) {
       if (updateAvailable.allowAutoUpdate) {
         // wait for download to finish
@@ -234,23 +214,25 @@ export function AppUpdaterButton({
       }
     } else if (currentChangelogUnread) {
       window.open(runtimeConfig.changelogUrl, '_blank');
-      onDismissCurrentChangelog();
+      dismissCurrentChangelog();
     } else {
       throw new Unreachable();
     }
   }, [
-    currentChangelogUnread,
-    currentVersion,
-    onDismissCurrentChangelog,
-    updateAvailable,
     updateReady,
+    quitAndInstall,
+    updateAvailable,
+    currentChangelogUnread,
+    dismissCurrentChangelog,
+    currentVersion,
   ]);
+
   return (
     <AppUpdaterButtonPure
       appQuitting={appQuitting}
       updateReady={!!updateReady}
-      onClickUpdate={onClickUpdate}
-      onDismissCurrentChangelog={onDismissCurrentChangelog}
+      onClickUpdate={handleClickUpdate}
+      onDismissCurrentChangelog={dismissCurrentChangelog}
       currentChangelogUnread={currentChangelogUnread}
       updateAvailable={updateAvailable}
       downloadProgress={downloadProgress}
@@ -259,5 +241,3 @@ export function AppUpdaterButton({
     />
   );
 }
-
-export * from './index.jotai';