import { useCallback } from "react";
import { useAtomSet, useAtomValue } from "@effect/atom-react";
import * as AsyncResult from "effect/unstable/reactivity/AsyncResult";

import { useScope } from "@executor-js/react/api/scope-context";
import { sourceWriteKeys } from "@executor-js/react/api/reactivity-keys";
import { connectionsAtom } from "@executor-js/react/api/atoms";
import {
  OAuthSignInButton,
  oauthCallbackUrl,
  oauthConnectionId,
  useOAuthPopupFlow,
  type OAuthCompletionPayload,
} from "@executor-js/react/plugins/oauth-sign-in";
import { slugifyNamespace } from "@executor-js/react/plugins/source-identity";

import { mcpSourceAtom, updateMcpSource } from "./atoms";
import type { McpStoredSourceSchemaType } from "../sdk/stored-source";

// ---------------------------------------------------------------------------
// McpSignInButton — top-bar action on the source detail page.
//
// Reads the source's stored endpoint + oauth2 pointer, re-runs the DCR /
// authorization-code flow against a stable `mcp-oauth2-${namespace}`
// connection id, and on success rewrites the source's auth pointer to
// the freshly minted connection. Works whether or not the previous
// Connection still exists — source-owned config is the source of truth.
// ---------------------------------------------------------------------------

export default function McpSignInButton(props: { sourceId: string }) {
  const scopeId = useScope();
  const sourceResult = useAtomValue(
    mcpSourceAtom(scopeId, props.sourceId),
  ) as AsyncResult.AsyncResult<McpStoredSourceSchemaType | null, unknown>;
  const connectionsResult = useAtomValue(connectionsAtom(scopeId));
  const doUpdate = useAtomSet(updateMcpSource, { mode: "promise" });
  const oauth = useOAuthPopupFlow({
    popupName: "mcp-oauth",
  });

  const source =
    AsyncResult.isSuccess(sourceResult) && sourceResult.value ? sourceResult.value : null;
  const remote = source && source.config.transport === "remote" ? source.config : null;
  const oauth2 = remote && remote.auth.kind === "oauth2" ? remote.auth : null;
  const connections = AsyncResult.isSuccess(connectionsResult)
    ? (connectionsResult.value as readonly { readonly id: string }[])
    : null;
  const isConnected =
    oauth2 !== null &&
    connections !== null &&
    connections.some((c) => c.id === oauth2.connectionId);

  const handleSignIn = useCallback(async () => {
    if (!remote || !oauth2 || !source) return;
    const namespaceSlug = slugifyNamespace(source.namespace) || "mcp";
    await oauth.start({
      payload: {
        endpoint: remote.endpoint,
        ...(remote.headers ? { headers: remote.headers } : {}),
        ...(remote.queryParams ? { queryParams: remote.queryParams } : {}),
        redirectUrl: oauthCallbackUrl(),
        connectionId: oauthConnectionId({
          pluginId: "mcp",
          namespace: namespaceSlug,
        }),
        strategy: { kind: "dynamic-dcr" },
        pluginId: "mcp",
        identityLabel: `${source.name.trim() || source.namespace || "MCP"} OAuth`,
      },
      onSuccess: async (result: OAuthCompletionPayload) => {
        await doUpdate({
          params: { scopeId, namespace: props.sourceId },
          payload: {
            auth: { kind: "oauth2", connectionId: result.connectionId },
          },
          reactivityKeys: sourceWriteKeys,
        });
      },
    });
  }, [remote, oauth2, source, scopeId, props.sourceId, doUpdate, oauth]);

  if (!oauth2) return null;

  return (
    <OAuthSignInButton
      busy={oauth.busy}
      error={oauth.error}
      isConnected={isConnected}
      onSignIn={() => void handleSignIn()}
      reconnectingLabel="Reconnecting…"
      signingInLabel="Signing in…"
    />
  );
}