oa-login-password-recovery-ux 改进登录找回密码体验

client/src/hooks/usePwaUpdatePrompt.ts

@@ -0,0 +1,47 @@
+import { useCallback, useEffect, useRef, useState } from "react";
+import { PWA_UPDATE_READY_EVENT } from "../lib/pwaUpdateEvents";
+
+type PwaUpdateReadyDetail = {
+  applyUpdate?: () => void | Promise<void>;
+};
+
+function resolveApplyUpdate(event: Event) {
+  const detail = (event as CustomEvent<PwaUpdateReadyDetail>).detail;
+  return typeof detail?.applyUpdate === "function" ? detail.applyUpdate : null;
+}
+
+export function usePwaUpdatePrompt() {
+  const applyUpdateRef = useRef<(() => void | Promise<void>) | null>(null);
+  const [updateReady, setUpdateReady] = useState(false);
+
+  useEffect(() => {
+    const handleUpdateReady = (event: Event) => {
+      applyUpdateRef.current = resolveApplyUpdate(event);
+      setUpdateReady(true);
+    };
+
+    window.addEventListener(PWA_UPDATE_READY_EVENT, handleUpdateReady);
+    return () => {
+      window.removeEventListener(PWA_UPDATE_READY_EVENT, handleUpdateReady);
+    };
+  }, []);
+
+  const applyUpdate = useCallback(() => {
+    const handler = applyUpdateRef.current;
+    if (handler) {
+      void handler();
+      return;
+    }
+    window.location.reload();
+  }, []);
+
+  const dismissUpdate = useCallback(() => {
+    setUpdateReady(false);
+  }, []);
+
+  return {
+    updateReady,
+    applyUpdate,
+    dismissUpdate,
+  };
+}