import { useEffect, useRef, useState } from "react";
import { Button, Dropdown } from "antd";
import localforage from "localforage";
import type { CanvasAssistantMessage } from "@/types/canvas";
import type { AiConfig } from "@/stores/use-config-store";
import { getActiveUserScope } from "@/lib/user-scope";
import { assertCreativeBriefSpecifications, initialCreativeState, normalizeCreativeProposal, type CreativeAgentState } from "@/lib/creation/creative-agent-state";
import type { CreativeAnswers, CreativeQuote } from "@/lib/creation/creative-agent-contract";
import { CreativeAgentController, type CreativeCanvasAdapter, type CreativeControllerView } from "@/services/creative-agent-controller";
import { resourceFileUrl, resourceIdFromStorageKey } from "@/services/api/resources";
import { CreativeProposalCard, CreativeQuestionCard, CreativeQuoteCard } from "@/components/creation/creative-agent-cards";
import { snapshotCreativePlan } from "@/lib/creation/creative-plan";

export type CanvasCreativeDetail = {
    kind: "creative-interaction";
    input: Record<string, unknown>;
    runId?: string;
    status?: string;
    quotes?: CreativeQuote[];
    approvedProposalVersion?: number;
    state: CreativeAgentState;
};
export function canvasCreativeDetail(message: CanvasAssistantMessage): CanvasCreativeDetail | undefined {
    const detail = message.detail as Partial<CanvasCreativeDetail> | undefined;
    return detail?.kind === "creative-interaction" && detail.state?.schemaVersion === 1 ? detail as CanvasCreativeDetail : undefined;
}

// 历史中的失败方案也按当前模型目录校验，将真实错误反馈给原 Agent，而不是丢掉失败的工具参数。
export function creativeProposalFailure(detail: CanvasCreativeDetail, config: AiConfig): string | undefined {
    if (!detail.input.proposal || detail.state.proposal || detail.state.questions?.questions.length) return;
    try {
        const proposal = normalizeCreativeProposal(detail.input.proposal, "validation", 1, config, detail.state.references);
        assertCreativeBriefSpecifications(proposal, detail.state.brief);
    } catch (cause) {
        return cause instanceof Error ? cause.message : "方案结构未通过校验";
    }
}

type Props = {
    message: CanvasAssistantMessage; sessionId: string; active: boolean; superseded?: boolean; config: AiConfig; canvas: CreativeCanvasAdapter;
    onUpdate: (message: CanvasAssistantMessage) => void;
    onContinue: (text: string) => void;
    onReview: () => void;
    onEditPrompt: (text: string) => void;
    onBusy: (id: string, busy: boolean) => void;
};

// 嵌入原助手消息，不拥有输入框、会话列表或模型选择。detail 保存回看快照，run 保存执行事实。
export function CanvasCreativeInteraction(props: Props) {
    const detail = canvasCreativeDetail(props.message)!;
    const [view, setView] = useState<CreativeControllerView>({ state: detail.state, busy: false, hasControl: false });
    const [error, setError] = useState("");
    const [answers, setAnswers] = useState<CreativeAnswers>(detail.state.answers || {});
    const controller = useRef<CreativeAgentController | null>(null);
    const latest = useRef(props); latest.current = props;
    const saved = useRef("");
    const quoteHistory = useRef<CreativeQuote[]>(detail.quotes || []);
    const answersEdited = useRef(false);
    const presentationAttempted = useRef(false);
    const scope = getActiveUserScope();
    const invoke = (promise?: Promise<unknown>) => { if (promise) { setError(""); void promise.catch((cause) => { if (!(cause instanceof DOMException && cause.name === "AbortError")) setError(cause instanceof Error ? cause.message : "操作未完成"); }); } };

    useEffect(() => {
        let live = true;
        presentationAttempted.current = false;
        const original = canvasCreativeDetail(latest.current.message)!;
        setView({ state: original.state, busy: false, hasControl: false });
        const instance = new CreativeAgentController({
            clientKey: `canvas-chat:${props.sessionId}:${props.message.id}`,
            config: () => latest.current.config,
            canvas: () => latest.current.canvas,
            onOpenCanvas: () => setError("当前会话仅操作所在画布，请在对应画布打开历史会话。"),
            onChange: (next) => {
                if (!live) return;
                setView(next); latest.current.onBusy(props.message.id, next.busy);
                if (!next.run || !latest.current.active) return;
                if (next.quote) quoteHistory.current = [...quoteHistory.current.filter((quote) => quote.id !== next.quote!.id), next.quote];
                const nextDetail: CanvasCreativeDetail = { kind: "creative-interaction", input: original.input, state: next.state, runId: next.run.id, status: next.run.status, quotes: quoteHistory.current, approvedProposalVersion: next.run.approvedProposalVersion };
                const signature = JSON.stringify(nextDetail);
                if (signature !== saved.current) {
                    saved.current = signature;
                    latest.current.onUpdate({ ...latest.current.message, detail: nextDetail });
                }
            },
        });
        controller.current = instance;
        const initialize = async () => {
            if (!original.runId && !props.active) return;
            await instance.load(original.runId, original.state, !props.active);
        };
        invoke(initialize());
        return () => { live = false; instance.dispose(); latest.current.onBusy(props.message.id, false); if (controller.current === instance) controller.current = null; };
    }, [props.message.id, props.sessionId, props.canvas.canvasId, props.active, scope]);

    useEffect(() => {
        if (!props.active || !view.hasControl || view.busy || view.state.externalInteractionPresented || presentationAttempted.current) return;
        presentationAttempted.current = true;
        invoke(controller.current?.presentInteraction(detail.input));
    }, [props.active, view.hasControl, view.busy, view.state.externalInteractionPresented]);

    const question = view.state.questions;
    const answerKey = `canvas-creative-answers:${scope}:${props.sessionId}:${props.message.id}:${question?.interactionId || ""}`;
    useEffect(() => {
        let live = true;
        answersEdited.current = false;
        setAnswers(view.state.answers || {});
        if (question?.status === "pending") void localforage.getItem<CreativeAnswers>(answerKey).then((value) => { if (live && !answersEdited.current && value) setAnswers(value); }).catch(() => undefined);
        return () => { live = false; };
    }, [answerKey, question?.status]);
    const blocked = !props.active || !view.hasControl || view.busy;
    const status = view.run?.status || detail.status;
    const awaitingProposal = status === "waiting_proposal" && !view.state.modificationRequested && !view.state.pendingEdits;
    const proposalFailure = creativeProposalFailure({ ...detail, state: view.state }, props.config);
    const modify = (text: string) => {
        if (!props.active) { props.onEditPrompt(text); return; }
        invoke(controller.current?.requestModification().then(() => props.onEditPrompt(text)));
    };
    const continueWork = async () => {
        const instance = controller.current;
        if (!instance) return;
        await instance.takeControl();
        if (proposalFailure) { props.onContinue("请根据当前真实素材和校验反馈调整方案。能自行修正的请修正，需要我提供信息时请直接提问，仍须确认后才制作。"); return; }
        if (detail.input.proposal && !view.state.proposal) { await instance.presentInteraction(detail.input, true); return; }
        if (view.quote && Date.parse(view.quote.expiresAt || "") <= Date.now()) { await instance.refreshQuotes(); return; }
        if (["running", "paused", "waiting_canvas", "waiting_task"].includes(status || "")) { await instance.resume(); return; }
        props.onContinue("保留已确认的要求，在已授权范围内继续当前任务，自行处理常规选择和技术问题；确实阻塞时再询问。");
    };
    const rawError = proposalFailure || error || view.error;
    const feedback = rawError ? /恢复|连接|网络|接管|执行权|代次/.test(rawError) ? "连接暂时中断，正在恢复。已有作品会保留。"
        : /报价|费用|价格|过期/.test(rawError) ? "生成费用需要重新确认，继续后会显示最新价格。"
        : /素材|参考|引用/.test(rawError) ? "参考素材还需要核对，助手会继续处理，必要时请你选择。"
        : "这一步还没有完成。已有内容已保留，可以继续处理或修改要求。" : undefined;
    const submitAnswers = async (submitted: CreativeAnswers) => {
        await controller.current!.answer(submitted, false);
        await localforage.removeItem(answerKey).catch(() => undefined);
        const summary = question!.questions.map((item) => {
            const answer = submitted[item.id];
            const options = item.type === "asset" ? view.state.references.map((ref) => ({ id: ref.id, label: ref.title })) : item.options;
            return `${item.title}：${[...(answer?.selected || []).map((id) => options.find((option) => option.id === id)?.label || id), answer?.custom].filter(Boolean).join("、") || "由助手建议"}`;
        }).join("\n");
        latest.current.onContinue(summary);
    };

    return <div className="space-y-3" data-canvas-no-zoom data-canvas-wheel-scroll>
        {question && <CreativeQuestionCard request={props.superseded && question.status === "pending" ? { ...question, status: "superseded" } : question} answers={answers} assets={view.state.references.map((ref) => ({ id: ref.id, label: ref.title }))} busy={view.busy} disabled={!props.active || !view.hasControl} onModify={() => modify(`我想修改之前的回答（${question.questions.map((item) => item.title).join("、")}）：`)} onAnswersChange={(next) => { answersEdited.current = true; setAnswers(next); invoke(localforage.setItem(answerKey, next)); }} onSubmit={submitAnswers} />}
        {view.state.proposal && <CreativeProposalCard proposal={view.state.proposal} archived={!props.active || !awaitingProposal} modifiable={!view.busy} disabled={props.active ? blocked : false} busy={view.busy} onApprove={() => invoke(controller.current?.approveProposal())} onModify={() => modify(`请修改方案《${view.state.proposal!.title}》：`)} onRedirect={() => modify("保留已确认的要求和素材，换一个创意方向。")} />}
        {view.state.pendingEdits && <div className="creative-agent-card"><p>将调整 {view.state.pendingEdits.length} 个节点的指定字段。</p><Button disabled={blocked} onClick={() => invoke(controller.current?.approveEdits())}>确认节点调整</Button></div>}
        {props.active && view.quote && <CreativeQuoteCard quote={view.quote} busy={view.busy} disabled={blocked} onApprove={() => invoke(controller.current?.approvePayment())} onRefresh={() => invoke(controller.current?.refreshQuotes())} />}
        {(detail.quotes || []).filter((quote) => !props.active || quote.id !== view.quote?.id).map((quote) => <details key={quote.id} className="creative-agent-receipt"><summary>{quote.approvedQuantity ? "已确认生成" : "历史报价"} · {quote.amountLabel} · {quote.items.length} 项</summary><p>{quote.basis}</p><ul>{quote.items.map((item) => <li key={item.id}>{item.label} · {item.model} · {item.specification}</li>)}</ul></details>)}
        {view.state.media.filter((item) => item.storageKey || item.error).map((item) => {
            const resource = resourceIdFromStorageKey(item.storageKey), url = resource ? resourceFileUrl(resource) : "";
            const video = view.state.proposal?.generationItems.find((entry) => entry.ref === item.ref)?.mode === "video";
            return <div className="creative-agent-card" key={item.ref}>
                <strong>{view.state.proposal?.workflow.nodes.find((node) => node.ref === item.ref)?.title || item.ref}</strong>
                {url && (video ? <video className="w-full max-h-80 object-contain" src={url} controls preload="metadata" /> : <img className="w-full max-h-80 object-contain" src={url} alt={item.ref} />)}
                {item.error && <p className="creative-agent-muted">这项作品还需要处理，已有结果会保留。</p>}
                <div className="creative-agent-actions">{url && <a href={url} target="_blank" rel="noreferrer">查看作品</a>}{props.active && <Dropdown trigger={["click"]} disabled={blocked} menu={{ items: [{ key: "adjust", label: "调整作品" }, { key: "redo", label: "重新生成（费用另行确认）" }], onClick: ({ key }) => key === "redo" ? invoke(controller.current?.redo(item.ref)) : modify(`请调整《${view.state.proposal?.workflow.nodes.find((entry) => entry.ref === item.ref)?.title || item.ref}》，保留其他作品：`) }}><Button type="text" disabled={blocked}>更多</Button></Dropdown>}</div>
            </div>;
        })}
        {!props.active && rawError && <details className="creative-agent-receipt"><summary>这一步未完成，后续对话中可继续调整</summary><p>{feedback}</p></details>}
        {props.active && <div className="creative-agent-next" role="status">
            <p>{view.busy ? "正在处理，请稍候…" : !view.hasControl ? "正在恢复当前创作，请稍候…" : view.state.modificationRequested ? "在下方告诉我想改哪里，调整后再确认。" : feedback || (view.quote ? "确认费用后，就开始本批制作。" : awaitingProposal ? "看看方案是否符合你的想法，确认后继续。" : question?.status === "pending" ? "选择一个答案，也可以在下方直接补充。" : status === "completed" ? "本阶段已完成。可以查看作品，或告诉我想改哪里。" : "准备好了，可以继续。")}</p>
            <div className="creative-agent-actions">
                {view.busy && ["running", "waiting_task", "waiting_canvas"].includes(status || "") ? <Button onClick={() => invoke(controller.current?.pause())}>停止后续制作</Button>
                    : !view.busy && view.hasControl && !view.state.modificationRequested && !view.quote && !awaitingProposal && !view.state.pendingEdits && question?.status !== "pending" ? <>
                        <Button type="primary" onClick={() => status === "completed" && !feedback ? props.onReview() : invoke(continueWork())}>{status === "completed" && !feedback ? "继续创作" : "继续处理"}</Button>
                        <Button onClick={() => modify("我想调整当前创作要求：")}>修改</Button>
                    </> : null}
            </div>
            {status === "paused" && <small className="creative-agent-muted">已停止后续制作。已提交的生成可能仍在处理，已有作品不会删除。</small>}
        </div>}
    </div>;
}

export function creativeInteractionSeed(history: CanvasAssistantMessage[]): CreativeAgentState {
    const previous = history.findLast((message) => canvasCreativeDetail(message));
    const state = previous ? canvasCreativeDetail(previous)!.state : initialCreativeState();
    return { ...initialCreativeState(), scene: state.scene, brief: state.brief, references: state.references, dynamicPlan: snapshotCreativePlan(state),
        messages: history.filter((message) => message.role === "user" || message.role === "assistant").slice(-30).map((message) => ({ id: message.id, role: message.role as "user" | "assistant", text: message.text })),
    };
}