fix(crash): useSyncExternalStore thiếu getSnapshot — 'b is not a function' khi vào hang

Root cause: store.js gọi useSync(c) chỉ với 1 tham số (subscribe), thiếu
getSnapshot. React useSyncExternalStore gọi getSnapshot() = undefined()
-> TypeError 'b is not a function' -> CaveErrorBoundary -> màn hình lỗi
khi vào hang, không thấy cửa hang / người chơi (áo đỏ).

Fix: wrapper useSyncStore(subscribe, getSnapshot) cho cả 10 hook
(chat/invites/talk/duel/penalty/tug/ball/voice/notice/rage) — đúng như
bản gốc hangmu.online: useSyncExternalStore(ql.subscribe, ql.getSnapshot).

Kèm:
- patch_backend.mjs: chèn /api/log + /api/logs TRƯỚC catch-all
@app .get('/{path:path}') để đọc được client errors (trước đây bị route
catch-all nuốt -> trả index.html thay vì JSON)
- index.html: cache-bust bundle v=5 (bản cũ v=4 bị browser/service worker
giữ lại bundle crash)

frontend/index.html

@@ -93,6 +93,6 @@
   <body>
     <div id="root"></div>
     <!-- Bundle: app.bundle.js tự chứa toàn bộ (react, three, zustand) -->
-    <script src="/static/app.bundle.js?v=4"></script>
+    <script src="/static/app.bundle.js?v=5"></script>
   </body>
 </html>

frontend/store.js

@@ -207,17 +207,28 @@ function makeRage() {
   }
 }
 
-/* ---- hooks ---- */
-export function useChat() { const c = useGame((s) => s.chat); return useSync(c) }
-export function useInvites() { return useSync(useGame((s) => s.invites)) }
-export function useTalk() { return useSync(useGame((s) => s.talk)) }
-export function useDuel() { return useSync(useGame((s) => s.duel)) }
-export function usePenalty() { return useSync(useGame((s) => s.penalty)) }
-export function useTug() { return useSync(useGame((s) => s.tug)) }
-export function useBall() { return useSync(useGame((s) => s.ball)) }
-export function useVoice() { return useSync(useGame((s) => s.voice)) }
-export function useNotice() { return useSync(useGame((s) => s.notice)) }
-export function useRage() { return useSync(useGame((s) => s.rage)) }
+/* ---- hooks ----
+   useSyncExternalStore(subscribe, getSnapshot) — phải truyền ĐÚNG 2 hàm
+   (bản gốc hangmu.online: `useSyncExternalStore(ql.subscribe, ql.getSnapshot)`).
+   Trước đây gọi `useSync(c)` (thiếu getSnapshot) → React gọi getSnapshot()
+   = undefined() → "TypeError: b is not a function" khi vào hang (toàn bộ
+   màn hang crash). Fix: wrapper bọc subscribe/getSnapshot của sub-store. */
+function useSyncStore(storeObj) {
+  return useSync(
+    (cb) => storeObj.subscribe(cb),
+    () => storeObj.getSnapshot(),
+  )
+}
+export function useChat() { return useSyncStore(useGame((s) => s.chat)) }
+export function useInvites() { return useSyncStore(useGame((s) => s.invites)) }
+export function useTalk() { return useSyncStore(useGame((s) => s.talk)) }
+export function useDuel() { return useSyncStore(useGame((s) => s.duel)) }
+export function usePenalty() { return useSyncStore(useGame((s) => s.penalty)) }
+export function useTug() { return useSyncStore(useGame((s) => s.tug)) }
+export function useBall() { return useSyncStore(useGame((s) => s.ball)) }
+export function useVoice() { return useSyncStore(useGame((s) => s.voice)) }
+export function useNotice() { return useSyncStore(useGame((s) => s.notice)) }
+export function useRage() { return useSyncStore(useGame((s) => s.rage)) }
 /* =========================================================================
    WebSocket client — giao thức JSON (phía server là backend.py)
    ========================================================================= */

patch_backend.mjs

@@ -6,10 +6,28 @@ import fs from 'node:fs'
 
 const path = 'backend.py'
 let s = fs.readFileSync(path, 'utf8')
-const marker = 'if __name__ == "__main__":'
-const idx = s.indexOf(marker)
+// IMPORTANT: phải chèn TRƯỚC catch-all @app.get("/{path:path}") (serve_static) —
+// nếu chèn sau, FastAPI match route theo thứ tự đăng ký → GET /api/logs bị
+// catch-all nuốt, trả index.html thay vì JSON (không đọc được client errors).
+const markers = [
+  '@app.get("/{path:path}")',   // nơi lý tưởng: chèn ngay trước catch-all
+  'if __name__ == "__main__":', // fallback cũ (chỉ dùng nếu không tìm thấy catch-all)
+]
+let idx = -1
+let used = -1
+for (let i = 0; i < markers.length; i++) {
+  const m = markers[i]
+  const at = s.indexOf(m)
+  if (at !== -1) {
+    // tìm đầu dòng để chèn sạch sẽ
+    const lineStart = s.lastIndexOf('\n', at) + 1
+    idx = lineStart
+    used = i
+    break
+  }
+}
 if (idx === -1) {
-  console.error('PATCH FAILED: main marker not found')
+  console.error('PATCH FAILED: marker not found')
   process.exit(1)
 }
 const inject = `# ============ Client error log (từ ErrorBoundary / window.onerror) ============
@@ -31,4 +49,4 @@ async def api_logs():
 `
 s = s.slice(0, idx) + inject + s.slice(idx)
 fs.writeFileSync(path, s)
-console.log('patched backend.py ok: /api/log + /api/logs')
+console.log(`patched backend.py ok: /api/log + /api/logs (inserted at marker [${used}])`)