From deba7ab2bbd4af5b90e5693ad07175f593257ce9 Mon Sep 17 00:00:00 2001
From: kurihada <kurihada@qq.com>
Date: Thu, 26 Feb 2026 20:25:56 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20AudioContext=20=E5=A4=8D=E7=94=A8=20+=20?=
 =?UTF-8?q?=E7=9B=B2=E7=9B=92=E5=8A=A0=E8=BD=BD=E9=94=99=E8=AF=AF=E6=8F=90?=
 =?UTF-8?q?=E7=A4=BA=20+=20icon=20=E6=8C=89=E9=92=AE=20aria-label?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- #27: panic/blindbox/ShareCardModal/AuthModal 中 icon-only 按钮补 aria-label
- #28: playChime 缓存复用单个 AudioContext，避免超出浏览器 ~6 个上限
- #29: 已完成（上一批次 ApiError.name = "ApiError"）
- #30: blindbox lobby fetchRooms 失败时显示"加载失败/点击重试"
- #31: 已完成（theme.ts VALID_THEMES 校验）
---
 src/app/blindbox/[code]/page.tsx  |  3 +++
 src/app/blindbox/page.tsx         | 23 +++++++++++++++++++++--
 src/app/panic/page.tsx            |  3 +++
 src/components/AuthModal.tsx      |  1 +
 src/components/ShareCardModal.tsx |  1 +
 src/lib/celebrate.ts              | 15 ++++++++++++---
 6 files changed, 41 insertions(+), 5 deletions(-)

diff --git a/src/app/blindbox/[code]/page.tsx b/src/app/blindbox/[code]/page.tsx
index 5f377de..edbb3b4 100644
--- a/src/app/blindbox/[code]/page.tsx
+++ b/src/app/blindbox/[code]/page.tsx
@@ -334,6 +334,7 @@ export default function BlindboxRoomPage() {
       <div className="flex w-full max-w-sm items-center gap-3">
         <button
           onClick={() => router.push("/blindbox")}
+          aria-label="返回"
           className="flex h-8 w-8 shrink-0 items-center justify-center rounded-full bg-surface ring-1 ring-border transition-colors active:bg-elevated"
         >
           <ArrowLeft size={16} className="text-muted" />
@@ -363,6 +364,7 @@ export default function BlindboxRoomPage() {
 
         <button
           onClick={() => setShowInvite(!showInvite)}
+          aria-label="邀请成员"
           className="flex h-8 w-8 shrink-0 items-center justify-center rounded-full bg-purple-600/15 text-purple-400 ring-1 ring-purple-500/20 transition-colors active:bg-purple-600/25"
         >
           <Share2 size={14} />
@@ -486,6 +488,7 @@ export default function BlindboxRoomPage() {
                   <button
                     onClick={handleSubmit}
                     disabled={!input.trim() || submitting}
+                    aria-label="提交想法"
                     className="flex h-12 w-12 items-center justify-center rounded-xl bg-purple-600 text-white transition-colors hover:bg-purple-500 disabled:opacity-30"
                   >
                     {submitting ? <Loader2 size={18} className="animate-spin" /> : <Send size={18} />}
diff --git a/src/app/blindbox/page.tsx b/src/app/blindbox/page.tsx
index 82f786d..ddc4d43 100644
--- a/src/app/blindbox/page.tsx
+++ b/src/app/blindbox/page.tsx
@@ -42,6 +42,7 @@ export default function BlindboxLobbyPage() {
   const [joinCode, setJoinCode] = useState("");
   const [joining, setJoining] = useState(false);
   const [error, setError] = useState("");
+  const [loadError, setLoadError] = useState(false);
 
   useEffect(() => {
     const registered = isRegistered();
@@ -65,12 +66,14 @@ export default function BlindboxLobbyPage() {
     const p = getCachedProfile();
     if (!p) return;
     setLoading(true);
+    setLoadError(false);
     try {
       const res = await fetch(`/api/blindbox/rooms?userId=${p.id}`);
+      if (!res.ok) throw new Error();
       const data = await res.json();
-      setRooms(data.rooms ?? []);
+      setRooms(Array.isArray(data.rooms) ? data.rooms : []);
     } catch {
-      /* ignore */
+      setLoadError(true);
     } finally {
       setLoading(false);
     }
@@ -219,6 +222,22 @@ export default function BlindboxLobbyPage() {
           </motion.div>
         ) : loading ? (
           <BlindboxListSkeleton />
+        ) : loadError ? (
+          <motion.div
+            key="load-error"
+            className="mt-16 flex flex-col items-center gap-3"
+            initial={{ opacity: 0, y: 20 }}
+            animate={{ opacity: 1, y: 0 }}
+          >
+            <Package size={36} className="text-purple-400/30" strokeWidth={1.5} />
+            <p className="text-sm text-muted">加载房间失败</p>
+            <button
+              onClick={fetchRooms}
+              className="mt-1 text-xs font-medium text-purple-400 active:text-purple-300"
+            >
+              点击重试
+            </button>
+          </motion.div>
         ) : rooms.length === 0 ? (
           /* ============ Layer 2: Logged in, no rooms — Create first ============ */
           <motion.div
diff --git a/src/app/panic/page.tsx b/src/app/panic/page.tsx
index cacca66..cda186a 100644
--- a/src/app/panic/page.tsx
+++ b/src/app/panic/page.tsx
@@ -297,6 +297,7 @@ export default function PanicPage() {
             {(selectedLocation || locationQuery) && !loading && (
               <button
                 onClick={clearLocation}
+                aria-label="清除位置"
                 className="absolute right-2.5 flex h-5 w-5 items-center justify-center rounded-full text-muted hover:text-secondary"
               >
                 <X size={14} />
@@ -399,6 +400,7 @@ export default function PanicPage() {
               {cuisine && !loading && (
                 <button
                   onClick={() => setCuisine("")}
+                  aria-label="清除口味"
                   className="absolute right-2 flex h-4 w-4 items-center justify-center rounded-full text-muted hover:text-secondary"
                 >
                   <X size={12} />
@@ -515,6 +517,7 @@ export default function PanicPage() {
           <button
             type="submit"
             disabled={loading || roomCode.length !== 4}
+            aria-label="加入房间"
             className="flex h-11 w-11 items-center justify-center rounded-xl bg-elevated text-secondary ring-1 ring-subtle transition-colors hover:bg-subtle disabled:opacity-30"
           >
             <LogIn size={18} />
diff --git a/src/components/AuthModal.tsx b/src/components/AuthModal.tsx
index d03e089..237a2f1 100644
--- a/src/components/AuthModal.tsx
+++ b/src/components/AuthModal.tsx
@@ -188,6 +188,7 @@ export default function AuthModal({ open, onClose, onAuth, defaultTab = "login"
           <button
             type="button"
             onClick={() => setShowPassword(!showPassword)}
+            aria-label={showPassword ? "隐藏密码" : "显示密码"}
             className="absolute right-3 top-1/2 -translate-y-1/2 text-muted transition-colors active:text-secondary"
           >
             {showPassword ? <EyeOff size={16} /> : <Eye size={16} />}
diff --git a/src/components/ShareCardModal.tsx b/src/components/ShareCardModal.tsx
index 93ad04b..db7e6ef 100644
--- a/src/components/ShareCardModal.tsx
+++ b/src/components/ShareCardModal.tsx
@@ -130,6 +130,7 @@ export default function ShareCardModal({
             <div className="relative flex shrink-0 justify-center">
               <button
                 onClick={onClose}
+                aria-label="关闭"
                 className="absolute right-3 top-3 z-10 flex h-8 w-8 items-center justify-center rounded-full bg-black/40 text-white/70 transition-colors active:bg-black/60"
               >
                 <X size={16} />
diff --git a/src/lib/celebrate.ts b/src/lib/celebrate.ts
index decd438..1c10146 100644
--- a/src/lib/celebrate.ts
+++ b/src/lib/celebrate.ts
@@ -62,9 +62,20 @@ export function fireCelebration() {
   setTimeout(frame, 300);
 }
 
+let _audioCtx: AudioContext | null = null;
+
+function getAudioContext(): AudioContext {
+  if (!_audioCtx || _audioCtx.state === "closed") {
+    _audioCtx = new AudioContext();
+  }
+  return _audioCtx;
+}
+
 export function playChime() {
   try {
-    const ctx = new AudioContext();
+    const ctx = getAudioContext();
+    if (ctx.state === "suspended") ctx.resume();
+
     const gain = ctx.createGain();
     gain.connect(ctx.destination);
     gain.gain.setValueAtTime(0.15, ctx.currentTime);
@@ -88,8 +99,6 @@ export function playChime() {
       osc.start(start);
       osc.stop(start + 0.6);
     });
-
-    setTimeout(() => ctx.close(), 2000);
   } catch {
     // Audio not available — silent fallback
   }