feat(backthink): 后台思考页全 WS 实时驱动——去掉轮询整页重渲
后端每次思考落库发 ws.backthink → useAppStore.backthink head-insert。页面临近打开时 冷拉一次历史(adminBackthink),此后靠 WS 事件增量更新;去掉 useAutoReload(10s)轮询替换 数组(会整页重渲)。行 key=id → React 只插入新记录、不动已有行。build 99模块绿。
This commit is contained in:
1 parent
0a645b7212
commit
9e7b4ebaac
1 file changed
+5
-5
@@ -8,7 +8,6 @@ import { Icon } from "../../components/Icon";
|
|||||||
import { FlowGraphView } from "./FlowGraph";
|
import { FlowGraphView } from "./FlowGraph";
|
||||||
import { adminBackthink } from "../../lib/api";
|
import { adminBackthink } from "../../lib/api";
|
||||||
import { useAsyncData } from "../../lib/useAsyncData";
|
import { useAsyncData } from "../../lib/useAsyncData";
|
||||||
import { useAutoReload } from "../hooks";
|
|
||||||
|
|
||||||
function BackthinkRow({ item }: { item: BackthinkItem }): React.ReactNode {
|
function BackthinkRow({ item }: { item: BackthinkItem }): React.ReactNode {
|
||||||
const markPushed = useAppStore((s) => s.markBackthinkPushed);
|
const markPushed = useAppStore((s) => s.markBackthinkPushed);
|
||||||
@@ -57,10 +56,11 @@ export function BackthinkModule(): React.ReactNode {
|
|||||||
const log = useAuditStore((s) => s.log);
|
const log = useAuditStore((s) => s.log);
|
||||||
const [filter, setFilter] = useState<"all" | "notify" | "silent">("all");
|
const [filter, setFilter] = useState<"all" | "notify" | "silent">("all");
|
||||||
const [interveneHint, setInterveneHint] = useState(false);
|
const [interveneHint, setInterveneHint] = useState(false);
|
||||||
// Persisted records (design/12 §4) + live WS backthink events, deduped by id,
|
// Cold-load persisted history once (design/12 §4); real-time updates come from the
|
||||||
// newest first. The panel previously only showed live WS events and hid history.
|
// WS `backthink` events already feeding useAppStore.backthink (head-inserted), so we
|
||||||
|
// do NOT poll-replace the array (which would re-render the whole list). Rows are keyed
|
||||||
|
// by id → React reconciles incrementally, appending only NEW records.
|
||||||
const rec = useAsyncData(() => adminBackthink(100), []);
|
const rec = useAsyncData(() => adminBackthink(100), []);
|
||||||
useAutoReload(rec.reload, 10000);
|
|
||||||
const byId = new Map<string, BackthinkItem>();
|
const byId = new Map<string, BackthinkItem>();
|
||||||
for (const b of backthink) if (b.id) byId.set(b.id, b);
|
for (const b of backthink) if (b.id) byId.set(b.id, b);
|
||||||
for (const b of rec.data ?? []) if (b.id) byId.set(b.id, b);
|
for (const b of rec.data ?? []) if (b.id) byId.set(b.id, b);
|
||||||
@@ -110,7 +110,7 @@ export function BackthinkModule(): React.ReactNode {
|
|||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
|
|
||||||
<Notice>数据源:GET /api/v1/admin/backthink(已存记录,每 10s 刷新)+ /ws/chat 下行 backthink / thinking 与 graph_update 事件(实时)合并去重。干预为后端 M10+ 提供,当前为只读展示。</Notice>
|
<Notice>数据源:/ws/chat 下行 backthink / thinking 事件(实时,主驱动)+ 打开时一次拉取 GET /api/v1/admin/backthink 历史,两者按 id 去重、按时间倒序,新记录增量插入(不整页重渲)。干预为后端 M10+ 提供,当前为只读展示。</Notice>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in new issue
Block a user