feat(frontend): 整章「再沟通/重写」面板——给意见流式重写整章,版本栈迭代,接受替换正文

WFW-8 整章级再沟通(前端)。底栏新增「整章重写」→ ChapterRewritePanel:
- 作者给意见 → useChapterRewrite 消费 POST .../rewrite 的 SSE 流(复用 lib/stream/sse
  帧解析),流式 live 展示新一版;
- 每轮完成压入版本栈,「再改一版」以最新版为 prior_draft + 新意见迭代(多轮对话式);
- 接受某版才「替换整章正文」落草稿(HITL,AI 绝不静默覆盖);停/错误/网络异常均归一处理。
四张 AI 结果卡(润色/续写/工具箱/整章重写)互斥。gen:api 重生成 TS 客户端。
门禁绿:tsc/lint/vitest 636(+7 useChapterRewrite)/build/coverage 95.36%。
This commit is contained in:
Yaojia Wang
2026-07-08 07:12:04 +02:00
parent 6ed9c89430
commit 542c2abac9
5 changed files with 567 additions and 1 deletions

View File

@@ -157,6 +157,29 @@ export interface paths {
patch?: never;
trace?: never;
};
"/projects/{project_id}/chapters/{chapter_no}/rewrite": {
parameters: {
query?: never;
header?: never;
path?: never;
cookie?: never;
};
get?: never;
put?: never;
/**
* Stream Rewrite
* @description 整章再沟通/重写:组装记忆 + 当前草稿 + 作者意见 → 网关流 → 归一 SSE → event-stream。
*
* HITL新版停前端/草稿,接受才落库(不变量 #3rewrite 是工具非写节点,不破坏章
* 纯函数性(不变量 #7。项目不存在 → 404触网关前 fail-fast同 draftQA C1
*/
post: operations["stream_rewrite_projects__project_id__chapters__chapter_no__rewrite_post"];
delete?: never;
options?: never;
head?: never;
patch?: never;
trace?: never;
};
"/projects/{project_id}/chapters/{chapter_no}/review": {
parameters: {
query?: never;
@@ -1868,6 +1891,20 @@ export interface components {
/** Draft */
draft?: string | null;
};
/**
* RewriteStreamRequest
* @description POST /projects/:id/chapters/:no/rewrite整章再沟通/重写。
*
* `feedback` = 作者对本章的修改意见;`prior_draft` = 当前整章草稿(前端传入,据此 + 记忆
* 注入流式重写一版)。临时输入、不持久化、无迁移;只入 volatile守缓存前缀不变量 #9
* 新版停前端/草稿接受才落库HITL不变量 #3
*/
RewriteStreamRequest: {
/** Feedback */
feedback: string;
/** Prior Draft */
prior_draft: string;
};
/**
* RuleCreateRequest
* @description POST /projects/:id/rules新增一条规则。
@@ -2727,6 +2764,42 @@ export interface operations {
};
};
};
stream_rewrite_projects__project_id__chapters__chapter_no__rewrite_post: {
parameters: {
query?: never;
header?: never;
path: {
project_id: string;
chapter_no: number;
};
cookie?: never;
};
requestBody: {
content: {
"application/json": components["schemas"]["RewriteStreamRequest"];
};
};
responses: {
/** @description Successful Response */
200: {
headers: {
[name: string]: unknown;
};
content: {
"application/json": unknown;
};
};
/** @description Validation Error */
422: {
headers: {
[name: string]: unknown;
};
content: {
"application/json": components["schemas"]["HTTPValidationError"];
};
};
};
};
review_chapter_projects__project_id__chapters__chapter_no__review_post: {
parameters: {
query?: never;

View File

@@ -0,0 +1,162 @@
// @vitest-environment jsdom
import { act, renderHook } from "@testing-library/react";
import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
import { useChapterRewrite } from "./useChapterRewrite";
// fetchSSE 流)是 hook 的外部副作用边界,单测一律 stub 全局 fetch。
const fetchMock = vi.fn();
function sseStream(chunks: string[]): ReadableStream<Uint8Array> {
const enc = new TextEncoder();
return new ReadableStream({
start(c) {
for (const ch of chunks) c.enqueue(enc.encode(ch));
c.close();
},
});
}
function sseResponse(chunks: string[]): Response {
return new Response(sseStream(chunks), {
status: 200,
headers: { "Content-Type": "text/event-stream" },
});
}
describe("useChapterRewrite", () => {
beforeEach(() => {
fetchMock.mockReset();
vi.stubGlobal("fetch", fetchMock);
});
afterEach(() => {
vi.unstubAllGlobals();
vi.clearAllMocks();
});
it("初始为 idle、无版本", () => {
const { result } = renderHook(() => useChapterRewrite());
expect(result.current.state.phase).toBe("idle");
expect(result.current.versions).toEqual([]);
expect(result.current.latest).toBeNull();
});
it("重写完成token+done流式累积正文并压入版本栈带作者意见", async () => {
fetchMock.mockResolvedValue(
sseResponse([
'event:token\ndata:{"text":"新版"}\n\n',
'event:token\ndata:{"text":"正文"}\n\n',
'event:done\ndata:{"length":4}\n\n',
]),
);
const { result } = renderHook(() => useChapterRewrite());
await act(async () => {
await result.current.send("p1", 3, "节奏太慢", "旧草稿");
});
// POST body 带 feedback + prior_draftsnake_case
const call = fetchMock.mock.calls[0];
expect(call?.[0]).toContain("/projects/p1/chapters/3/rewrite");
expect(JSON.parse((call?.[1]?.body as string) ?? "")).toEqual({
feedback: "节奏太慢",
prior_draft: "旧草稿",
});
expect(result.current.state.phase).toBe("done");
expect(result.current.versions).toEqual([
{ feedback: "节奏太慢", text: "新版正文" },
]);
expect(result.current.latest?.text).toBe("新版正文");
});
it("多轮迭代第二轮再压一版latest 为最新版", async () => {
fetchMock
.mockResolvedValueOnce(
sseResponse([
'event:token\ndata:{"text":"第一版"}\n\n',
'event:done\ndata:{"length":3}\n\n',
]),
)
.mockResolvedValueOnce(
sseResponse([
'event:token\ndata:{"text":"第二版"}\n\n',
'event:done\ndata:{"length":3}\n\n',
]),
);
const { result } = renderHook(() => useChapterRewrite());
await act(async () => {
await result.current.send("p1", 1, "意见一", "原草稿");
});
await act(async () => {
await result.current.send("p1", 1, "意见二", "第一版");
});
expect(result.current.versions).toHaveLength(2);
expect(result.current.latest).toEqual({ feedback: "意见二", text: "第二版" });
});
it("error 帧phase=error 且不入版本栈", async () => {
fetchMock.mockResolvedValue(
sseResponse([
'event:error\ndata:{"code":"RATE_LIMIT","message":"配额不足"}\n\n',
]),
);
const { result } = renderHook(() => useChapterRewrite());
await act(async () => {
await result.current.send("p1", 1, "改", "草稿");
});
expect(result.current.state.phase).toBe("error");
expect(result.current.state.error).toMatchObject({ code: "RATE_LIMIT" });
expect(result.current.versions).toEqual([]);
});
it("流前错误(!res.ok解析 JSON 信封提取错误码", async () => {
fetchMock.mockResolvedValue(
new Response(
JSON.stringify({ error: { code: "LLM_UNAVAILABLE", message: "无可用凭据" } }),
{ status: 503 },
),
);
const { result } = renderHook(() => useChapterRewrite());
await act(async () => {
await result.current.send("p1", 1, "改", "草稿");
});
expect(result.current.state.error).toMatchObject({ code: "LLM_UNAVAILABLE" });
expect(result.current.versions).toEqual([]);
});
it("网络抛异常(非 Abortphase=error 且 code=NETWORK", async () => {
fetchMock.mockRejectedValue(new Error("connection reset"));
const { result } = renderHook(() => useChapterRewrite());
await act(async () => {
await result.current.send("p1", 1, "改", "草稿");
});
expect(result.current.state.error).toMatchObject({
code: "NETWORK",
message: "connection reset",
});
});
it("reset 清回 idle 与空版本栈", async () => {
fetchMock.mockResolvedValue(
sseResponse([
'event:token\ndata:{"text":"x"}\n\n',
'event:done\ndata:{"length":1}\n\n',
]),
);
const { result } = renderHook(() => useChapterRewrite());
await act(async () => {
await result.current.send("p1", 1, "改", "草稿");
});
act(() => result.current.reset());
expect(result.current.state.phase).toBe("idle");
expect(result.current.versions).toEqual([]);
});
});

View File

@@ -0,0 +1,163 @@
"use client";
import { useCallback, useReducer, useRef, useState } from "react";
import { API_BASE_PUBLIC } from "@/lib/api/config";
import {
SseFrameBuffer,
initialStreamState,
reduceStream,
type StreamState,
} from "@/lib/stream/sse";
// 一轮整章重写的产出(作者意见 + 产出正文)。多轮迭代累积成版本栈。
export interface RewriteVersion {
feedback: string;
text: string;
}
type Action =
| { type: "start" }
| { type: "events"; events: ReturnType<SseFrameBuffer["push"]> }
| { type: "abort" }
| { type: "fail"; code: string; message: string }
| { type: "reset" };
function reducer(state: StreamState, action: Action): StreamState {
switch (action.type) {
case "start":
return { phase: "streaming", text: "", error: null };
case "events":
return action.events.reduce(reduceStream, state);
case "abort":
return { ...state, phase: "aborted" };
case "fail":
return {
...state,
phase: "error",
error: { code: action.code, message: action.message },
};
case "reset":
return initialStreamState;
default:
return state;
}
}
export interface UseChapterRewrite {
// 当前流式状态text = 正在生成/最新一版正文,供 live 展示)。
state: StreamState;
isStreaming: boolean;
// 已完成的版本栈(每轮一版)。
versions: RewriteVersion[];
latest: RewriteVersion | null;
// 发起一轮整章重写:作者意见 + 当前整章草稿 → 流式重写一版。
send: (
projectId: string,
chapterNo: number,
feedback: string,
priorDraft: string,
) => Promise<void>;
stop: () => void;
reset: () => void;
}
// 整章再沟通/重写流POST .../rewritefeedback + prior_draft→ 消费 SSE → 累积成新一版。
// 每轮完成压入版本栈;下一轮以最新版正文为 prior_draft + 新意见迭代HITL接受才落草稿
// 用 fetch+ReadableStreamEventSource 不支持 POST复用 lib/stream/sse 的帧解析与归一。
export function useChapterRewrite(): UseChapterRewrite {
const [state, dispatch] = useReducer(reducer, initialStreamState);
const [versions, setVersions] = useState<RewriteVersion[]>([]);
const controllerRef = useRef<AbortController | null>(null);
const textRef = useRef("");
const stop = useCallback(() => {
controllerRef.current?.abort();
controllerRef.current = null;
dispatch({ type: "abort" });
}, []);
const reset = useCallback(() => {
dispatch({ type: "reset" });
setVersions([]);
}, []);
const send = useCallback<UseChapterRewrite["send"]>(
async (projectId, chapterNo, feedback, priorDraft) => {
const controller = new AbortController();
controllerRef.current = controller;
textRef.current = "";
dispatch({ type: "start" });
try {
const res = await fetch(
`${API_BASE_PUBLIC}/projects/${projectId}/chapters/${chapterNo}/rewrite`,
{
method: "POST",
headers: {
Accept: "text/event-stream",
"Content-Type": "application/json",
},
body: JSON.stringify({ feedback, prior_draft: priorDraft }),
signal: controller.signal,
},
);
if (!res.ok || !res.body) {
// 流前错误(如无凭据 → 503 LLM_UNAVAILABLEJSON 信封而非帧)。
let code = "STREAM_FAILED";
let message = `整章重写请求失败(${res.status}`;
try {
const body = (await res.json()) as {
error?: { code?: string; message?: string };
};
if (body.error?.code) code = body.error.code;
if (body.error?.message) message = body.error.message;
} catch {
// 非 JSON 信封,沿用默认文案。
}
dispatch({ type: "fail", code, message });
return;
}
const reader = res.body.getReader();
const decoder = new TextDecoder();
const buffer = new SseFrameBuffer();
let done = false;
for (;;) {
const { value, done: readerDone } = await reader.read();
if (readerDone) break;
const events = buffer.push(decoder.decode(value, { stream: true }));
if (events.length > 0) {
dispatch({ type: "events", events });
for (const ev of events) {
if (ev.event === "token") textRef.current += ev.data.text;
if (ev.event === "done") done = true;
}
}
}
// 收到 done 且有正文 → 压入版本栈(未 done/空文本不入栈,避免脏版本)。
if (done && textRef.current.length > 0) {
const version: RewriteVersion = { feedback, text: textRef.current };
setVersions((prev) => [...prev, version]);
}
} catch (err: unknown) {
if (err instanceof DOMException && err.name === "AbortError") {
return; // 用户主动停止state 已置 aborted。
}
const message = err instanceof Error ? err.message : "未知网络错误";
dispatch({ type: "fail", code: "NETWORK", message });
} finally {
controllerRef.current = null;
}
},
[],
);
return {
state,
isStreaming: state.phase === "streaming",
versions,
latest: versions.at(-1) ?? null,
send,
stop,
reset,
};
}