/* Student-aware assistant panel. Loaded after dcp-backend.js and before dechepro-app.jsx. */
(function () {
  const MAX_QUESTION_LENGTH = 1000;

  function DCPAssistant({ authed }) {
    const A = window.DCP.assistant;
    const [open, setOpen] = React.useState(false);
    const [messages, setMessages] = React.useState([{ from: "bot", text: A.hello }]);
    const [draft, setDraft] = React.useState("");
    const [busy, setBusy] = React.useState(false);
    const [error, setError] = React.useState("");
    const bodyRef = React.useRef(null);
    const identityRef = React.useRef(window.DCPB.identity());

    React.useEffect(() => {
      const resetIfChanged = (event) => {
        if (event.type === "storage" && event.key && event.key !== "ag_token" && event.key !== "token") return;
        const current = window.DCPB.identity();
        if (current === identityRef.current) return;
        identityRef.current = current;
        setMessages([{ from: "bot", text: A.hello }]);
        setDraft(""); setError(""); setBusy(false); setOpen(false);
      };
      for (const name of ["storage", "focus", "dcp-auth-updated"]) window.addEventListener(name, resetIfChanged);
      return () => {
        for (const name of ["storage", "focus", "dcp-auth-updated"]) window.removeEventListener(name, resetIfChanged);
      };
    }, []);

    React.useEffect(() => {
      if (bodyRef.current) bodyRef.current.scrollTop = bodyRef.current.scrollHeight;
    }, [messages, open, busy, error]);

    const addBotMessage = (text) => {
      setMessages((items) => [...items, { from: "bot", text: text }]);
    };

    const ask = async (rawQuestion) => {
      const question = String(rawQuestion || "").trim().slice(0, MAX_QUESTION_LENGTH);
      if (!question || busy) return;
      const requestIdentity = window.DCPB.identity();

      setMessages((items) => [...items, { from: "user", text: question }]);
      setDraft("");
      setError("");

      if (!authed) {
        addBotMessage(A.answers[question] || A.fallback);
        return;
      }

      setBusy(true);
      try {
        if (!window.DCPB || typeof window.DCPB.ask !== "function") {
          throw new Error("Trợ lý chưa sẵn sàng");
        }
        const answer = await window.DCPB.ask(question);
        if (window.DCPB.identity() !== requestIdentity) return;
        if (window.DCPB.isAuthed && !window.DCPB.isAuthed()) {
          throw new Error("Phiên đăng nhập đã hết hạn");
        }
        if (typeof answer !== "string" || !answer.trim()) {
          throw new Error("Không nhận được câu trả lời");
        }
        addBotMessage(answer);
      } catch (requestError) {
        if (window.DCPB.identity() !== requestIdentity) return;
        const expired = /hết hạn|401|đăng nhập/i.test(String(requestError && requestError.message));
        setError(expired
          ? "Phiên đăng nhập đã hết hạn. Hãy đăng nhập lại rồi gửi câu hỏi này."
          : "Không thể xác nhận đã nhận câu hỏi. Kiểm tra với hỗ trợ trước khi gửi lại.");
      } finally {
        if (window.DCPB.identity() === requestIdentity) setBusy(false);
      }
    };


    if (!open) {
      return (
        <button className="dcp-fab" type="button" onClick={() => setOpen(true)} aria-label="Mở trợ lý học tập">
          <img src={A.avatar} alt={A.name} />
          <span className="dcp-fab__txt">Hỗ trợ học tập</span>
        </button>
      );
    }
    return <AssistantChat A={A} authed={authed} messages={messages} busy={busy} error={error}
                          draft={draft} setDraft={setDraft} setOpen={setOpen} bodyRef={bodyRef} ask={ask} />;

  }

  function AssistantChat({ A, authed, messages, busy, error, draft, setDraft, setOpen, bodyRef, ask }) {
    const submit = (event) => { event.preventDefault(); ask(draft); };
    const onKeyDown = (event) => {
      if ((event.ctrlKey || event.metaKey) && event.key === "Enter") submit(event);
    };

    return (
      <section className="dcp-chat" aria-label="Trợ lý học tập">
        <header className="dcp-chat__head">
          <img src={A.avatar} alt={A.name} />
          <div className="dcp-chat__identity">
            <div className="dcp-chat__name">{A.name}</div>
            <div className="dcp-chat__status">Đang hoạt động</div>
          </div>
          <button className="dcp-chat__close" type="button" onClick={() => setOpen(false)} aria-label="Đóng trợ lý">×</button>
        </header>
        <div className="dcp-chat__notice">
          <b>Làm bài tập</b> trong phần mềm <b>Antigravity</b> trên máy tính. Khung này chỉ hỏi đáp chung về khoá học.
        </div>
        <div className="dcp-chat__body" ref={bodyRef} aria-live="polite">
          {messages.map((message, index) => <div key={index} className={`dcp-msg ${message.from}`}>{message.text}</div>)}
          {busy && <div className="dcp-msg bot dcp-chat__pending">Đang tìm câu trả lời…</div>}
        </div>
        {(!authed || messages.length === 1) && <div className="dcp-sugg" aria-label="Câu hỏi gợi ý">
          {A.suggestions.map((suggestion) => (
            <button className="dcp-chat__question" type="button" key={suggestion} onClick={() => ask(suggestion)} disabled={busy}>
              {suggestion}
            </button>
          ))}
        </div>}
        {authed && (
          <form className="dcp-chat__composer" onSubmit={submit}>
            <label className="sr-only" htmlFor="dcp-assistant-question">Câu hỏi về khóa học</label>
            <textarea id="dcp-assistant-question" value={draft} maxLength={MAX_QUESTION_LENGTH} onChange={(event) => setDraft(event.target.value)} onKeyDown={onKeyDown} disabled={busy} rows={2} placeholder="Hỏi về khóa học…" />
            <button className="dcp-chat__send" type="submit" disabled={busy || !draft.trim()}>{busy ? "Đang gửi" : "Gửi"}</button>
          </form>
        )}
        {error && (
          <div className="dcp-chat__error" role="alert">
            <span>{error}</span>
          </div>
        )}
        <footer className="dcp-chat__foot">
          <a className="dcp-chat__cta" href="#dangky" onClick={() => setOpen(false)}>Nhận tư vấn từ Sam</a>
        </footer>
      </section>
    );
  }

  window.DCPAssistant = DCPAssistant;
})();