import React from "react";
import { fireEvent, render, screen } from "@testing-library/react";
import { ThemeProvider, createTheme } from "@mui/material/styles";

import { AgentHeader } from "./AgentHeader";

jest.mock("next/image", () => ({
  __esModule: true,
  default: (props: React.ComponentProps<"img">) => <img {...props} alt={props.alt ?? ""} />,
}));

const renderWithTheme = (ui: React.ReactElement) =>
  render(<ThemeProvider theme={createTheme()}>{ui}</ThemeProvider>);

describe("AgentHeader", () => {
  it("submits a renamed active session title", () => {
    const onRenameSessionTitle = jest.fn();

    renderWithTheme(
      <AgentHeader
        sessionTitle="原始标题"
        canRenameSessionTitle
        isStreaming={false}
        isHistoryOpen={false}
        onHistoryToggle={jest.fn()}
        onRenameSessionTitle={onRenameSessionTitle}
        onNewConversation={jest.fn()}
        onClose={jest.fn()}
      />,
    );

    fireEvent.click(screen.getByRole("button", { name: "修改对话标题" }));
    fireEvent.change(screen.getByPlaceholderText("请输入对话标题"), {
      target: { value: "更新后的标题" },
    });
    fireEvent.click(screen.getByLabelText("确认"));

    expect(onRenameSessionTitle).toHaveBeenCalledWith("更新后的标题");
  });
});
