/**
 * Session dock > Agent: the one place for this chat's agent. Three sections,
 * in product words: Identity (who the agent is), Capabilities (what it can
 * do), each with where it comes from (the workspace default, or this chat),
 * and Agent learning (whether its changes to knowledge, instructions and
 * skills apply right away or wait for your OK). Identity and capabilities
 * change with Edit and apply from the next turn (the running turn keeps what
 * it started with); Agent learning saves at once. A session created before
 * agent settings (no configuration) says so and converts on its first save,
 * starting from what it can do today. Tool names only appear under Technical
 * details.
 */
import {
  AGENT_IDENTITY_MAX_CHARACTERS,
  legacyEffectiveAgentCapabilities,
  resolveWorkspaceAgentDefaults,
  resolveWorkspaceDefaultAgentIdentity,
} from "@opengeni/contracts";
import { PencilIcon } from "lucide-react";
import { useEffect, useId, useMemo, useRef, useState, type ReactNode, type Ref } from "react";
import { toast } from "../../lib/toast";

import { AgentCapabilityPicker, AgentCapabilitySummary } from "../agent/agent-capability-picker";
import { InAppHelpLink } from "../in-app-help-link";
import {
  learningModesEqual,
  useLearningSettings,
  type LearningModes,
} from "../agent/capability-learning";
import { Button } from "../../../ui/button";
import { Disclosure } from "../../../ui/disclosure";
import { Field, TextArea } from "../../../ui/field";
import { Notice } from "../../../ui/notice";
import { RelativeTime } from "../../../ui/relative-time";
import { KeepActiveSetting, sessionReadOnlyArchive } from "./session-retention";
import { SessionUsageLimitSection } from "./session-usage-limit-section";
import { useAppContext } from "../../app-context";
import {
  AGENT_CAPABILITY_GROUPS,
  AGENT_STARTING_POINTS,
  agentConfigErrorText,
  capabilityAvailability,
  capabilitySummary,
  draftFromResolved,
  draftsEqual,
  requestFromDraft,
  toolOwnerLabel,
  workspaceAgentDefaultsDraft,
  type AgentCapabilityDraft,
} from "../../lib/agent-capabilities";
import { chatLearningScope } from "../../lib/chat-learning-scope";
import { isPersonalWorkspace } from "../../lib/managed-self-context";
import { hasWorkspacePermission } from "../../lib/permissions";
import { sessionUsageLimitCapability } from "../../lib/session-usage-limit";
import { cn } from "../../lib/utils";
import type { Session } from "../../types";
import { apiErrorFacts } from "../../../ui/api-error";

/** Settings > General > Agent defaults: what new chats in the workspace start with. */
export function workspaceAgentDefaultsHref(workspaceId: string): string {
  return `/workspaces/${workspaceId}/settings?section=general&view=agent-defaults`;
}

/** Settings > Agent learning: the workspace and private-chat defaults. */
export function agentLearningHref(workspaceId: string): string {
  return `/workspaces/${workspaceId}/settings?section=learning`;
}

export function AgentConfigurationPanel(props: {
  session: Session;
  /** The latest change to these settings, when one is in the loaded events. */
  lastChange?: { at: string; pending: boolean } | null | undefined;
  onReloadSession: () => Promise<void>;
  /** A new value (composer + > Chat settings) scrolls to Agent learning and focuses it. */
  learningFocusRequest?: number | undefined;
  /** A new value (header menu, usage limit notice) opens the usage limit editor. */
  usageLimitFocusRequest?: number | undefined;
  /** The goal is paused at the usage limit (raising it doesn't resume). */
  goalPausedAtUsageLimit?: boolean | undefined;
}) {
  const { session } = props;
  const context = useAppContext();
  const workspace =
    context.workspaces.find((candidate) => candidate.id === session.workspaceId) ?? null;
  const canEdit = hasWorkspacePermission(
    context.accessContext,
    session.workspaceId,
    "sessions:control",
  );
  const sectionId = useId();
  const learningHeading = useRef<HTMLHeadingElement>(null);
  const config = session.agent ?? null;
  const availability = useMemo(
    () => capabilityAvailability(context.clientConfig.agentConfig, config?.unavailable ?? []),
    [context.clientConfig.agentConfig, config?.unavailable],
  );
  // A legacy session: what it can do today, as the server will convert it.
  const legacyValues = useMemo(
    () =>
      config
        ? null
        : legacyEffectiveAgentCapabilities({
            firstPartyMcpTools: session.firstPartyMcpTools,
            tools: session.tools,
            toolPolicy: session.toolPolicy,
            humanInputEnabled: workspace?.settings.agentHumanInputEnabled !== false,
            defaultServerIds: context.workspaceDefaultToolIds,
          }),
    [config, session, workspace?.settings, context.workspaceDefaultToolIds],
  );
  const current: AgentCapabilityDraft = config
    ? draftFromResolved(config)
    : { from: "all", values: legacyValues! };
  const [editing, setEditing] = useState(false);
  const [draft, setDraft] = useState<AgentCapabilityDraft>(current);
  const [identity, setIdentity] = useState(config?.identity ?? "");
  const [saving, setSaving] = useState(false);
  const [error, setError] = useState<string | null>(null);
  const scrollRegion = useRef<HTMLDivElement>(null);
  const learningScope = chatLearningScope(
    session,
    isPersonalWorkspace(workspace, context.managedSelfContext),
  );
  // This chat's Agent learning: shown inside Skills and Knowledge, saved with them.
  const learning = useLearningSettings({
    workspaceId: session.workspaceId,
    scope: learningScope,
    source: { kind: "chat", id: session.id },
  });
  const [learningDraft, setLearningDraft] = useState<LearningModes | null>(learning.modes);

  // Someone else's save (or a reload) while not editing shows the new truth.
  const configKey = JSON.stringify(config);
  useEffect(() => {
    if (editing) return;
    setDraft(current);
    setIdentity(config?.identity ?? "");
    setLearningDraft(learning.modes);
    // oxlint-disable-next-line react-hooks/exhaustive-deps -- follow the frozen configuration
  }, [configKey, editing, learning.modes ? JSON.stringify(learning.modes) : null]);

  // Settings that arrive after the editor opened fill an empty draft.
  useEffect(() => {
    if (learning.modes) setLearningDraft((previous) => previous ?? learning.modes);
  }, [learning.modes]);

  const identityChanged = identity.trim() !== (config?.identity ?? "").trim();
  const agentChanged = !draftsEqual(draft, current) || identityChanged || !config;
  const learningChanged =
    learning.modes !== null &&
    learningDraft !== null &&
    !learningModesEqual(learning.modes, learningDraft);
  const dirty = agentChanged || learningChanged;
  const identityTooLong = identity.trim().length > AGENT_IDENTITY_MAX_CHARACTERS;

  async function save() {
    if (!canEdit || saving) return;
    setSaving(true);
    setError(null);
    try {
      if (agentChanged) {
        await context.client.updateSessionAgent(session.workspaceId, session.id, {
          agent: {
            capabilities: requestFromDraft(draft, availability),
            ...(identityChanged ? { identity: identity.trim() || null } : {}),
          },
          expectedVersion: session.toolPolicyVersion,
        });
      }
      if (learningChanged && learningDraft) await learning.save(learningDraft);
      await props.onReloadSession();
      setEditing(false);
      toast.success("Agent settings saved", { description: "They apply from the next turn." });
    } catch (failure) {
      setError(
        agentConfigErrorText(failure, "Couldn't save the agent settings. Nothing was changed."),
      );
      scrollRegion.current?.scrollTo({ top: 0 });
      // A version conflict: someone changed the chat meanwhile; show theirs.
      if (apiErrorFacts(failure).status === 409) {
        await props.onReloadSession();
      }
    } finally {
      setSaving(false);
    }
  }

  const startingPoint =
    AGENT_STARTING_POINTS.find((option) => option.value === current.from)?.title ?? "";

  // Where each part comes from: the workspace's defaults for new chats, or
  // this chat. A chat that matches the defaults says so.
  const workspaceDefaults = useMemo(
    () =>
      workspaceAgentDefaultsDraft({
        capabilities: resolveWorkspaceAgentDefaults(workspace?.settings)?.capabilities,
        legacyHumanInputOff: workspace?.settings.agentHumanInputEnabled === false,
      }),
    [workspace?.settings],
  );
  const workspaceIdentity = resolveWorkspaceDefaultAgentIdentity(
    workspace?.settings,
    workspace?.agentInstructions,
  ).identity;
  const capabilitiesSource = !config
    ? "Set when this chat started"
    : draftsEqual(current, workspaceDefaults)
      ? "Workspace default"
      : config.source === "workspace_default" || config.source === "deployment_default"
        ? "Defaults when this chat started"
        : "Changed for this chat";
  const identitySource = config?.identity ? "Set for this chat" : "Workspace default";
  const defaultsHref = workspaceAgentDefaultsHref(session.workspaceId);
  // Composer + > Chat settings: open the editor on what the agent can do.
  const focusRequest = props.learningFocusRequest ?? 0;
  useEffect(() => {
    if (!focusRequest) return;
    if (canEdit) setEditing(true);
    const frame = requestAnimationFrame(() => {
      const heading = learningHeading.current;
      if (!heading) return;
      heading.scrollIntoView({ block: "start" });
      heading.focus({ preventScroll: true });
    });
    return () => cancelAnimationFrame(frame);
  }, [focusRequest, canEdit]);
  // The usage limit lives in the read view: leave capability editing for it,
  // unless that would drop unsaved capability changes.
  const usageLimitFocusRequest = props.usageLimitFocusRequest ?? 0;
  useEffect(() => {
    if (usageLimitFocusRequest && !dirty) setEditing(false);
    // oxlint-disable-next-line react-hooks/exhaustive-deps -- once per request
  }, [usageLimitFocusRequest]);
  const usageLimitsOffered = sessionUsageLimitCapability(context.clientConfig) !== "absent";

  return (
    <div
      data-agent-panel
      className="flex h-full min-h-[28rem] w-full min-w-0 flex-col overflow-hidden"
    >
      <div className="flex min-w-0 items-start justify-between gap-3 border-b border-border px-4 py-3">
        <div className="min-w-0">
          <h2 className="text-sm font-medium text-fg">{editing ? "Edit agent" : "Agent"}</h2>
          <p className="mt-0.5 text-xs leading-4.5 text-fg-muted">
            {editing
              ? `Applies from the next turn · ${capabilitySummary(draft.values, availability)}`
              : `${config ? startingPoint : "Before agent settings"} · ${capabilitySummary(current.values, availability)}`}
          </p>
        </div>
        {!editing && canEdit ? (
          <Button
            type="button"
            size="sm"
            variant="outline"
            className="shrink-0 pointer-coarse:h-11"
            onClick={() => {
              setDraft(current);
              setIdentity(config?.identity ?? "");
              setError(null);
              setEditing(true);
            }}
          >
            <PencilIcon aria-hidden="true" />
            Edit
          </Button>
        ) : null}
      </div>
      <div
        ref={scrollRegion}
        // Focusable so keyboard users can scroll a long list.
        tabIndex={0}
        role="region"
        aria-label={editing ? "Edit agent" : "Agent settings"}
        className="min-h-0 min-w-0 flex-1 overflow-y-auto overscroll-contain focus-visible:outline-2 focus-visible:-outline-offset-2 focus-visible:outline-brand/55"
      >
        <div className="flex min-w-0 flex-col gap-6 px-4 py-4">
          {editing ? (
            <>
              {error ? (
                // First in the form, so it is seen right after pressing Save.
                <Notice tone="failed" title="Not saved">
                  {error}
                </Notice>
              ) : null}
              {!config ? (
                <Notice tone="info">
                  Saving converts this session to agent settings, starting from what it can do now.
                </Notice>
              ) : null}
              <PanelSection id={`${sectionId}-identity`} title="Identity">
                <Field
                  label="Who the agent is"
                  optional
                  aside={`${identity.trim().length.toLocaleString()} / ${AGENT_IDENTITY_MAX_CHARACTERS.toLocaleString()}`}
                  error={
                    identityTooLong
                      ? `Use ${AGENT_IDENTITY_MAX_CHARACTERS.toLocaleString()} characters or fewer.`
                      : undefined
                  }
                  hint="Empty uses the workspace default, or Opengeni's own."
                >
                  <TextArea
                    rows={3}
                    value={identity}
                    disabled={saving}
                    placeholder={workspaceIdentity ?? undefined}
                    onChange={(event) => setIdentity(event.target.value)}
                  />
                </Field>
              </PanelSection>
              <PanelSection
                id={`${sectionId}-capabilities`}
                title="Capabilities"
                headingRef={learningHeading}
              >
                <AgentCapabilityPicker
                  draft={draft}
                  onChange={setDraft}
                  availability={availability}
                  disabled={saving}
                  learning={
                    learningDraft ? { modes: learningDraft, onChange: setLearningDraft } : undefined
                  }
                />
              </PanelSection>
            </>
          ) : (
            <>
              {!config ? (
                <Notice>
                  This session started before agent settings and keeps the tools it started with.
                  Editing converts it, starting from what it can do now.
                </Notice>
              ) : props.lastChange ? (
                <p className="text-xs leading-4.5 text-fg-muted">
                  Changed <RelativeTime date={props.lastChange.at} inSentence />.{" "}
                  {props.lastChange.pending
                    ? "Applies from the next turn."
                    : "The latest turn used these settings."}
                </p>
              ) : null}
              {!canEdit ? (
                <p className="text-xs leading-4.5 text-fg-muted">
                  You can see these settings. Changing them needs permission to run this session.
                </p>
              ) : null}
              <PanelSection
                id={`${sectionId}-identity`}
                title="Identity"
                source={<SourceLine label={identitySource} href={defaultsHref} />}
              >
                <p
                  className={cn(
                    "text-sm leading-5 break-words whitespace-pre-wrap",
                    config?.identity || workspaceIdentity ? "text-fg" : "text-fg-muted",
                  )}
                >
                  {config?.identity ?? workspaceIdentity ?? "Opengeni's general assistant."}
                </p>
              </PanelSection>
              <PanelSection
                id={`${sectionId}-capabilities`}
                title="Capabilities"
                source={<SourceLine label={capabilitiesSource} href={defaultsHref} />}
                headingRef={learningHeading}
              >
                <AgentCapabilitySummary
                  values={current.values}
                  availability={availability}
                  learningModes={learning.modes}
                />
              </PanelSection>
              {context.clientConfig.sessionArchive && !sessionReadOnlyArchive(session) ? (
                <PanelSection id={`${sectionId}-storage`} title="Storage">
                  <KeepActiveSetting
                    session={session}
                    idleDays={context.clientConfig.sessionArchive.idleDays}
                    onSaved={props.onReloadSession}
                  />
                </PanelSection>
              ) : null}
              {usageLimitsOffered ? (
                <PanelSection id={`${sectionId}-usage`} title="Usage">
                  <SessionUsageLimitSection
                    session={session}
                    focusRequest={usageLimitFocusRequest}
                    goalPausedAtLimit={props.goalPausedAtUsageLimit}
                  />
                </PanelSection>
              ) : null}
              <ConnectedApps session={session} />
              <TechnicalDetails session={session} />
            </>
          )}
        </div>
      </div>
      {editing ? (
        <div className="flex min-w-0 flex-wrap items-center justify-end gap-2 border-t border-border px-4 py-3">
          <Button
            type="button"
            variant="ghost"
            size="sm"
            className="pointer-coarse:h-11"
            disabled={saving}
            onClick={() => {
              setEditing(false);
              setError(null);
            }}
          >
            Cancel
          </Button>
          <Button
            type="button"
            size="sm"
            className="pointer-coarse:h-11"
            disabled={!dirty || saving || identityTooLong}
            onClick={() => void save()}
          >
            {saving ? "Saving…" : "Save"}
          </Button>
        </div>
      ) : null}
    </div>
  );
}

/** One titled part of the Agent tab, with where its value comes from on the right. */
function PanelSection({
  id,
  title,
  source,
  headingRef,
  children,
}: {
  id: string;
  title: string;
  source?: ReactNode | undefined;
  headingRef?: Ref<HTMLHeadingElement> | undefined;
  children: ReactNode;
}) {
  return (
    <section
      aria-labelledby={id}
      data-agent-section={title}
      className="flex min-w-0 flex-col gap-3 border-t border-border pt-5 first:border-t-0 first:pt-0"
    >
      <div className="flex min-w-0 flex-wrap items-baseline justify-between gap-x-3 gap-y-1">
        <h3
          id={id}
          ref={headingRef}
          tabIndex={headingRef ? -1 : undefined}
          className="scroll-mt-4 text-sm leading-5 font-medium text-fg outline-hidden"
        >
          {title}
        </h3>
        {source ? <p className="m-0 text-xs leading-4.5 text-fg-muted">{source}</p> : null}
      </div>
      {children}
    </section>
  );
}

/** "Workspace default · Defaults": where a value comes from, and the page that sets it. */
function SourceLine({ label, href }: { label: string; href: string }) {
  return (
    <>
      {label} · <InAppHelpLink href={href}>Defaults</InAppHelpLink>
    </>
  );
}

/** Apps this session can use: its own, then the workspace's, as names. */
function ConnectedApps({ session }: { session: Session }) {
  const context = useAppContext();
  const servers = session.effectiveTools?.mcpServers ?? [];
  const nameOf = (id: string) =>
    session.mcpServers.find((server) => server.id === id)?.name ??
    context.toolMcpServers.find((server) => server.id === id)?.name ??
    "Custom app";
  const names = (capability: "product" | "workspaceConnectors") =>
    servers
      .filter((server) => server.capability === capability)
      .map((server) => nameOf(server.id))
      .sort((left, right) => left.localeCompare(right));
  const own = names("product");
  const workspace = names("workspaceConnectors");
  if (own.length === 0 && workspace.length === 0) return null;
  return (
    <section aria-labelledby="agent-connected-apps" className="min-w-0">
      <h3 id="agent-connected-apps" className="pb-1 text-xs leading-4.5 font-medium text-fg-subtle">
        Connected apps
      </h3>
      <dl className="m-0 flex min-w-0 flex-col gap-2 text-sm leading-5">
        {own.length > 0 ? (
          <div className="min-w-0">
            <dt className="text-xs leading-4.5 text-fg-muted">Added to this session</dt>
            <dd className="m-0 break-words text-fg">{own.join(", ")}</dd>
          </div>
        ) : null}
        {workspace.length > 0 ? (
          <div className="min-w-0">
            <dt className="text-xs leading-4.5 text-fg-muted">
              From the workspace ({workspace.length})
            </dt>
            <dd className="m-0 break-words text-fg">{workspace.join(", ")}</dd>
          </div>
        ) : null}
      </dl>
      <p className="mt-2 text-xs leading-4.5 text-fg-muted">
        Each app lists its own tools when a turn starts.
      </p>
    </section>
  );
}

function TechnicalDetails({ session }: { session: Session }) {
  const tools = session.effectiveTools?.tools ?? [];
  const servers = session.effectiveTools?.mcpServers ?? [];
  if (!session.effectiveTools) return null;
  const owners: Array<AgentEffectiveToolOwner> = [
    ...AGENT_CAPABILITY_GROUPS.flatMap((group) => group.capabilities),
    "product",
    "sandbox",
    "runtime",
  ];
  const groups = owners
    .map((owner) => ({ owner, tools: tools.filter((tool) => tool.capability === owner) }))
    .filter((group) => group.tools.length > 0);
  const anyVisibility = tools.some((tool) => tool.visibility !== undefined);
  return (
    <Disclosure
      title="Technical details"
      summary={`${tools.length} tools${servers.length ? ` · ${servers.length} tool servers` : ""}`}
    >
      <div className="flex min-w-0 flex-col gap-5 pt-2 pb-2">
        <p className="text-xs leading-4.5 text-fg-muted">
          {anyVisibility
            ? "Up front: sent with every request. On demand: the agent finds it by search when it needs it."
            : "What this session can use. Each app lists its own tools when a turn starts."}
        </p>
        {groups.map((group) => (
          <section key={group.owner} className="min-w-0">
            <h4 className="pb-1 text-xs leading-4.5 font-medium text-fg-subtle">
              {toolOwnerLabel(group.owner)}
            </h4>
            <ul className="m-0 flex min-w-0 list-none flex-col p-0">
              {group.tools.map((tool) => (
                <li
                  key={`${tool.source}:${tool.name}`}
                  className="flex min-h-7 min-w-0 items-center justify-between gap-3"
                >
                  <code className="min-w-0 font-mono text-xs break-all text-fg">{tool.name}</code>
                  {tool.visibility ? (
                    <span
                      className={cn(
                        "shrink-0 rounded-full border px-2 text-2xs leading-4.5",
                        tool.visibility === "upfront"
                          ? "border-brand/30 text-brand"
                          : "border-border text-fg-muted",
                      )}
                    >
                      {tool.visibility === "upfront" ? "Up front" : "On demand"}
                    </span>
                  ) : null}
                </li>
              ))}
            </ul>
          </section>
        ))}
        {servers.length > 0 ? (
          <section className="min-w-0">
            <h4 className="pb-1 text-xs leading-4.5 font-medium text-fg-subtle">Tool servers</h4>
            <ul className="m-0 flex min-w-0 list-none flex-col p-0">
              {servers.map((server) => (
                <li
                  key={server.id}
                  className="flex min-h-7 min-w-0 items-center justify-between gap-3"
                >
                  <code className="min-w-0 font-mono text-xs break-all text-fg">{server.id}</code>
                  <span className="shrink-0 text-2xs text-fg-subtle">
                    {server.toolsKnown
                      ? toolOwnerLabel(server.capability)
                      : "Tools listed when a turn starts"}
                  </span>
                </li>
              ))}
            </ul>
          </section>
        ) : null}
      </div>
    </Disclosure>
  );
}

type AgentEffectiveToolOwner = NonNullable<
  Session["effectiveTools"]
>["tools"][number]["capability"];