import { hasText, errorText } from "./text-values.ts";
import {
  conversationChoices,
  conversationHeading,
  conversationShortcut,
  primaryConversationAction,
  primaryConversationHint,
} from "./conversation-menu.ts";
import { ConversationViewport } from "./conversation-viewport.ts";
import { ConversationHistory } from "./conversation-history.ts";
import { ConversationDetails } from "./conversation-details.ts";
import { ConversationSelection } from "./conversation-selection.ts";
import { HistoryCards } from "./history-cards.ts";
import {
  getSelectListTheme,
  type KeybindingsManager,
  type Theme,
} from "@earendil-works/pi-coding-agent";
import {
  Container,
  Editor,
  type ScrollView,
  SelectList,
  matchesKey,
  type Component,
  type TUI,
  type TuiMouseEvent,
  type TuiMouseEventResult,
} from "@earendil-works/pi-tui";
import type { AgentVisit, AgentTask } from "./view-model.ts";
import type { ConversationController } from "./view-ports.ts";
import { conversationControls, conversationFrame } from "./conversation-frame.ts";
import { editorViewport } from "./editor-viewport.ts";

/** Native ScrollView owns follow/scroll state; overlays only need a bounded render adapter. */
export class AgentConversation extends Container {
  private readonly details: ConversationDetails;
  private readonly history: ConversationHistory;
  private readonly cards: HistoryCards;
  readonly editor: Editor;
  readonly scroll: ScrollView;
  private readonly viewport: ConversationViewport;
  private readonly editorViewport: Component;
  private editorHeight = Infinity;
  private editorFocus = true;
  private hasFocus = false;
  private closed = false;
  private beforeInput = "";
  private readonly selection: ConversationSelection;
  private menu?: SelectList;
  private readonly initialVisit: Pick<AgentVisit, "anchor" | "readThrough">;
  private readonly keys?: KeybindingsManager;

  private readonly tui: TUI;
  private readonly theme: Theme;
  private readonly controller: ConversationController;
  readonly key: string;
  private readonly done: (key?: string) => void;

  constructor(
    tui: TUI,
    theme: Theme,
    options: {
      readonly controller: ConversationController;
      readonly key: string;
      readonly done: (key?: string) => void;
      readonly keys?: KeybindingsManager;
    },
  ) {
    super();
    const { controller, key, done, keys } = options;
    this.tui = tui;
    this.theme = theme;
    this.controller = controller;
    this.key = key;
    this.done = done;
    this.keys = keys;
    this.details = this.createDetails();

    this.initialVisit = { anchor: this.visit.anchor, readThrough: this.visit.readThrough };
    this.history = new ConversationHistory(tui, controller, key, {
      initialPosition: () => this.viewport.initialPosition,
      initialVisit: () => this.initialVisit,
      readSequence: (sequence) => {
        this.viewport.readSequence = sequence;
      },
      clearCards: () => this.cards.clear(),
      refresh: () => this.refresh(),
    });

    this.cards = new HistoryCards(
      tui,
      theme,
      () => this.task?.child.launch?.cwd ?? this.task?.run.cwd ?? process.cwd(),
    );
    this.editor = new Editor(
      tui,
      { borderColor: (text) => theme.fg("accent", text), selectList: getSelectListTheme() },
      { paddingX: 0 },
    );
    this.bindEditor();
    this.editorViewport = editorViewport(this.editor, () => this.editorHeight);
    this.viewport = new ConversationViewport(
      tui,
      this.cards,
      {
        task: () => this.task,
        visit: () => this.visit,
        loading: () => this.history.loadingPage,
        detail: () => Boolean(this.details.detail),
        initialVisit: this.initialVisit,
        content: {
          render: (width) =>
            this.cards.render(width, this.history.items(this.details.detail), {
              selectedId: this.selection.id,
              editorFocus: this.editorFocus,
              detail: Boolean(this.details.detail),
              toolsExpanded: this.selection.toolsExpanded,
              toolExpansion: this.selection.toolExpansion,
            }),
          invalidate() {
            /* HistoryCards caches are invalidated by the conversation. */
          },
        },
      },
      (event) => this.historyMouse(event),
    );
    this.scroll = this.viewport.scroll;
    this.selection = new ConversationSelection(this.cards, this.scroll);
    this.run(this.history.loadPage({}, this.visit.anchor?.id ?? this.visit.readThrough));
  }

  private createDetails(): ConversationDetails {
    return new ConversationDetails(this.tui, {
      task: () => this.task,
      visit: () => this.visit,
      selected: () => this.selection.selected(this.details.detail),
      following: () => this.scroll.isFollowingEnd,
      anchor: () => this.viewport.anchor(),
      compose: (value) => {
        this.editorFocus = value;
        this.focused = this.hasFocus;
      },
      closeMenu: () => {
        this.menu = undefined;
      },
      restore: (anchor) => {
        this.viewport.restoreAnchor = anchor;
      },
      toStart: () => this.scroll.scrollToStart(),
      toEnd: () => this.scroll.scrollToEnd(),
      changed: () => this.controller.changed(),
      back: () => this.act("back"),
      changes: () => this.controller.changes(this.key),
    });
  }
  private bindEditor(): void {
    this.editor.setText(this.visit.draft);
    this.editor.onChange = () => {
      if (!this.closed) {
        this.visit.draft = this.editor.getExpandedText();
        this.controller.changed();
      }
    };
    this.editor.onSubmit = (text) => {
      this.editor.setText(this.beforeInput);
      if (!this.details.loadingDetail) {
        this.run(this.controller.send(this.key, text));
      }
    };
  }
  private get visit(): AgentVisit {
    return this.controller.visit(this.key);
  }
  private get task(): AgentTask | undefined {
    return this.controller.task(this.key);
  }
  get focused(): boolean {
    return this.hasFocus;
  }
  set focused(value: boolean) {
    this.hasFocus = value;
    this.editor.focused = value && this.editorFocus && !this.details.detail && !this.menu;
  }
  refresh(): void {
    if (this.closed) {
      return;
    }
    if (this.details.detail?.id === "assignment" && this.task) {
      this.details.detail = this.history.assignment();
    }
    if (!this.viewport.initialPosition && !this.scroll.isFollowingEnd) {
      this.viewport.restoreAnchor = this.viewport.anchor();
    }
    this.refreshFollowing();
    this.tui.requestRender();
  }
  private refreshFollowing(): void {
    if (
      this.history.latestPage &&
      this.scroll.isFollowingEnd &&
      !this.details.detail &&
      !hasText(this.history.pageError)
    ) {
      this.history.refreshPending = this.history.loadingPage;
      if (!this.history.loadingPage) {
        this.run(this.history.loadPage());
      }
    }
  }
  syncDraft(): void {
    if (!this.closed && this.editor.getExpandedText() !== this.visit.draft) {
      this.editor.setText(this.visit.draft);
    }
  }

  private run(operation: Promise<void>): void {
    operation.catch((error: unknown) => {
      if (!this.closed) {
        this.visit.notice = errorText(error);
        this.tui.requestRender();
      }
    });
  }

  private entrance(): string {
    if (this.details.detail) {
      return "Agents";
    }
    if (this.history.loadingPage && !this.task?.page) {
      return "Loading conversation…";
    }
    return this.history.pageError !== undefined ? "History unavailable · F5 retry" : "Agents";
  }
  render(width: number): string[] {
    const task = this.task,
      height = this.controller.availableHeight(this.tui);
    const primary = primaryConversationAction(task, this.editorFocus);
    const footer = conversationControls(
      {
        menu: Boolean(this.menu),
        detail: Boolean(this.details.detail),
        compact: height < 16,
        width,
        primary,
        actionHint: primaryConversationHint(
          primary,
          width,
          this.details.loadingDetail && !this.details.detail,
          task,
        ),
        act: (action) => this.act(action),
      },
      this.theme,
    );
    const entrance = this.entrance();
    this.editorHeight = Infinity;
    const frame = conversationFrame(
      {
        width,
        height,
        ...conversationHeading(task, {
          entrance,
          detail: this.details.detail !== undefined,
          following: this.scroll.isFollowingEnd,
          busy: this.controller.isBusy(this.key),
        }),
        menu: this.menu,
        detail: Boolean(this.details.detail),
        footer,
        viewport: this.viewport,
        editorViewport: this.editorViewport,
        editorRows: this.editor.render(Math.max(1, width - 2)).length,
        notice: this.visit.notice,
        quoteTitle: this.visit.quote?.title,
        act: (action) => this.act(action),
      },
      this.theme,
    );
    this.editorHeight = frame.editorHeight;
    this.viewport.height = frame.historyHeight;
    this.clear();
    this.addChild(frame.component);
    this.focused = this.hasFocus;
    return super.render(width);
  }

  invalidate(): void {
    this.cards.clear();
    super.invalidate();
  }

  handleMouse(event: Readonly<TuiMouseEvent>): ReturnType<Container["handleMouse"]> {
    const result = super.handleMouse(event);
    if (result?.target.component === this.editorViewport) {
      this.editorFocus = true;
      this.focused = this.hasFocus;
    }
    return result;
  }

  private historyMouse(event: Readonly<TuiMouseEvent>): TuiMouseEventResult | undefined {
    if (event.type === "wheel") {
      this.scroll.scrollBy(event.wheelDelta ?? 0);
      this.viewport.restoreAnchor = this.viewport.anchor();
      return { handled: true };
    }
    const anchor = this.viewport.anchor();
    const result = this.selection.mouse(event, this.details.detail !== undefined);
    if (result?.focus === true) {
      this.viewport.restoreAnchor = anchor;
      this.editorFocus = false;
    }
    return result;
  }
  private select(delta: number): void {
    if (this.selection.select(delta, this.viewport.height)) {
      this.viewport.restoreAnchor = this.viewport.anchor();
    }
  }
  private actions(): void {
    const choices = conversationChoices(this.task, {
      expanded: this.selection.toolsExpanded,
      pinned: this.controller.pinned === this.key,
      quote: this.visit.quote,
    });
    this.menu = new SelectList(
      choices,
      Math.max(1, this.controller.availableHeight(this.tui) - 7),
      getSelectListTheme(),
    );
    this.menu.onSelect = (item) => {
      this.menu = undefined;
      this.act(item.value);
    };
    this.menu.onCancel = () => {
      this.menu = undefined;
    };
  }
  private back(): void {
    if (this.menu) {
      this.menu.onCancel?.();
      return;
    }
    if (!this.details.close()) {
      this.finish();
    }
  }
  private choose(): void {
    const menu = this.menu,
      item = menu?.getSelectedItem();
    if (menu && item) {
      menu.onSelect?.(item);
    }
  }
  private focusEditor(): void {
    if (this.details.detail) {
      return;
    }
    this.editorFocus = !this.editorFocus;
    if (!this.editorFocus) {
      this.select(0);
    }
  }
  private page(direction: string): void {
    const page = this.task?.page;
    if (direction === "earlier" && page?.previousBefore !== undefined) {
      this.run(this.history.loadPage({ before: page.previousBefore }));
    } else if (direction === "later" && !this.history.latestPage && page?.nextAfter !== undefined) {
      this.run(this.history.loadPage({ after: page.nextAfter }));
    }
    this.cards.clear();
    this.selection.id = undefined;
    this.scroll.scrollToEnd();
  }
  private async retry(): Promise<void> {
    await this.controller.retry(this.key);
    if (!this.closed) {
      await this.history.loadPage();
    }
  }
  private latest(): void {
    this.viewport.initialPosition = false;
    this.details.detailRequest++;
    this.details.loadingDetail = false;
    this.details.detail = undefined;
    this.cards.clear();
    this.run(this.history.loadPage());
    this.viewport.restoreAnchor = undefined;
    this.details.conversationAnchor = undefined;
    this.scroll.scrollToEnd();
    this.selection.id = this.editorFocus ? undefined : this.history.items().at(-1)?.id;
  }
  private expand(): void {
    if (!this.scroll.isFollowingEnd) {
      this.viewport.restoreAnchor = this.viewport.anchor();
    }
    this.selection.expand();
  }
  private submit(continuing: boolean): void {
    if (this.details.loadingDetail) {
      return;
    }
    const text = this.editor.getExpandedText();
    this.run(this.controller.send(this.key, continuing ? text : text.trim(), continuing));
  }
  private readonly commands: Readonly<Record<string, (() => void) | undefined>> = {
    back: () => this.back(),
    choose: () => this.choose(),
    actions: () => this.actions(),
    focus: () => this.focusEditor(),
    send: () => this.submit(false),
    continue: () => this.submit(true),
    reply: () => this.run(this.details.reply()),
    details: () => this.run(this.details.inspectSelected()),
    earlier: () => this.page("earlier"),
    later: () => this.page("later"),
    retry: () => this.run(this.retry()),
    assignment: () => {
      if (this.task) {
        this.run(this.details.inspect(this.history.assignment()));
      }
    },
    expand: () => this.expand(),
    changes: () => this.run(this.details.changes()),
    latest: () => this.latest(),
    pin: () => this.controller.pin(this.controller.pinned === this.key ? undefined : this.key),
    unquote: () => this.details.unquote(),
    stop: () => this.run(this.controller.stop(this.key)),
    picker: () => this.finish("picker"),
    peers: () => this.finish("peers"),
  };
  private act(action: string): void {
    if (this.closed) {
      return;
    }
    this.commands[action]?.();
    this.focused = this.hasFocus;
    this.tui.requestRender();
  }
  private shortcut(data: string): string | undefined {
    if (this.keys?.matches(data, "app.tools.expand") ?? matchesKey(data, "ctrl+o")) {
      return "expand";
    }
    if (matchesKey(data, "alt+d") && (!this.editorFocus || this.details.detail)) {
      return "details";
    }
    if (matchesKey(data, "tab") && !this.details.detail) {
      return "focus";
    }
    return conversationShortcut(data);
  }
  private navigate(data: string): void {
    if (matchesKey(data, "up")) {
      this.select(-1);
    } else if (matchesKey(data, "down")) {
      this.select(1);
    } else if (matchesKey(data, "home")) {
      this.scroll.scrollToStart();
      this.viewport.restoreAnchor = this.viewport.anchor();
    } else if (matchesKey(data, "end")) {
      this.act("latest");
    } else if (matchesKey(data, "enter")) {
      this.act("details");
    }
  }
  private input(data: string): void {
    const action = this.shortcut(data);
    if (action !== undefined) {
      this.act(action);
      return;
    }
    if (matchesKey(data, "pageUp") || matchesKey(data, "pageDown")) {
      this.scroll.scrollBy(
        matchesKey(data, "pageUp") ? -this.viewport.height : this.viewport.height,
      );
      this.viewport.restoreAnchor = this.viewport.anchor();
    } else if (!this.editorFocus || this.details.detail) {
      this.navigate(data);
    } else {
      this.beforeInput = this.editor.getExpandedText();
      this.editor.handleInput(data);
    }
  }
  handleInput(data: string): void {
    if (this.closed) {
      return;
    }
    if (matchesKey(data, this.controller.shortcut)) {
      this.finish();
      return;
    }
    if (this.menu) {
      this.menu.handleInput(data);
    } else {
      this.input(data);
    }
    this.focused = this.hasFocus;
    this.tui.requestRender();
  }

  private finish(key?: string): void {
    this.controller.changed();
    this.done(key);
  }
  dispose(): void {
    this.closed = true;
    this.details.dispose();
    this.history.dispose();
    this.editor.onChange = undefined;
    this.editor.onSubmit = undefined;
    this.cards.clear();
  }
}