feat: toast when upgrade

Signed-off-by: Innei <i@innei.in>

src/renderer/src/App.tsx

@@ -5,6 +5,7 @@ import { Outlet } from "react-router-dom"
 import { env } from "../../env.js"
 import { useAppIsReady } from "./atoms/app"
 import { useUISettingKey } from "./atoms/settings/ui"
+import { applyAfterReadyCallbacks } from "./initialize/queue.js"
 import { appLog } from "./lib/log"
 import { cn, getOS } from "./lib/utils"
 import { Titlebar } from "./modules/app/Titlebar.js"
@@ -43,22 +44,20 @@ function App() {
 
   const windowsElectron = window.electron && getOS() === "Windows"
   return (
-    <>
-      <RootProviders>
-        {window.electron && (
-          <div
-            className={cn(
-              "drag-region absolute inset-x-0 top-0 h-12 shrink-0",
-              windowsElectron && "pointer-events-none z-[9999]",
-            )}
-            aria-hidden
-          >
-            {windowsElectron && <Titlebar />}
-          </div>
-        )}
-        <AppLayer />
-      </RootProviders>
-    </>
+    <RootProviders>
+      {window.electron && (
+        <div
+          className={cn(
+            "drag-region absolute inset-x-0 top-0 h-12 shrink-0",
+            windowsElectron && "pointer-events-none z-[9999]",
+          )}
+          aria-hidden
+        >
+          {windowsElectron && <Titlebar />}
+        </div>
+      )}
+      <AppLayer />
+    </RootProviders>
   )
 }
 
@@ -71,6 +70,8 @@ const AppLayer = () => {
       time: doneTime,
     })
     appLog("App is ready", `${doneTime}ms`)
+
+    applyAfterReadyCallbacks()
   }, [appIsReady])
 
   return appIsReady ? <Outlet /> : <AppSkeleton />

src/renderer/src/atoms/app.ts

@@ -3,7 +3,7 @@ import { getStorageNS } from "@renderer/lib/ns"
 import { atom } from "jotai"
 import { atomWithStorage } from "jotai/utils"
 
-export const [, , useAppIsReady, , , setAppIsReady] = createAtomHooks(
+export const [, , useAppIsReady, , appIsReady, setAppIsReady] = createAtomHooks(
   atom(false),
 )
 

src/renderer/src/initialize/index.ts

@@ -13,6 +13,7 @@ import duration from "dayjs/plugin/duration"
 import localizedFormat from "dayjs/plugin/localizedFormat"
 import relativeTime from "dayjs/plugin/relativeTime"
 import { enableMapSet } from "immer"
+import { createElement } from "react"
 import { toast } from "sonner"
 
 import { subscribeNetworkStatus } from "../atoms/network"
@@ -27,6 +28,7 @@ import {
   setHydrated,
 } from "./hydrate"
 import { initPostHog } from "./posthog"
+import { pushAfterReadyCallback } from "./queue"
 import { initSentry } from "./sentry"
 
 const cleanup = subscribeShouldUseIndexedDB((value) => {
@@ -64,7 +66,31 @@ export const initializeApp = async () => {
 
   if (lastVersion && lastVersion !== APP_VERSION) {
     appLog(`Upgrade from ${lastVersion} to ${APP_VERSION}`)
-    // TODO
+
+    pushAfterReadyCallback(() => {
+      setTimeout(() => {
+        toast.success(
+          // `App is upgraded to ${APP_VERSION}, enjoy the new features! 🎉`,
+          createElement("div", {
+            children: [
+              "App is upgraded to ",
+              createElement(
+                "a",
+                {
+                  href: `${repository.url}/releases/tag/${APP_VERSION}`,
+                  target: "_blank",
+                  className: "underline",
+                },
+                createElement("strong", {
+                  children: APP_VERSION,
+                }),
+              ),
+              ", enjoy the new features! 🎉",
+            ],
+          }),
+        )
+      }, 1000)
+    })
   }
   localStorage.setItem(appVersionKey, APP_VERSION)
 

src/renderer/src/initialize/queue.ts

@@ -0,0 +1,16 @@
+import { appIsReady } from "@renderer/atoms/app"
+
+const afterReadyCallbackQueue = [] as Array<() => void>
+
+export const pushAfterReadyCallback = (callback: () => void) => {
+  if (appIsReady()) {
+    callback()
+  } else {
+    afterReadyCallbackQueue.push(callback)
+  }
+}
+
+export const applyAfterReadyCallbacks = () => {
+  afterReadyCallbackQueue.forEach((callback) => callback())
+  afterReadyCallbackQueue.length = 0
+}