/**
 * @license
 * Copyright 2025 Vybestack LLC
 * SPDX-License-Identifier: Apache-2.0
 */

import type React from 'react';
import { useState, useCallback, useMemo, useEffect, useRef } from 'react';
import { Box, Text } from 'ink';
import { Colors } from '../colors.js';
import { RadioButtonSelect } from './shared/RadioButtonSelect.js';
import type { LoadedSettings } from '../../config/settings.js';
import { SettingScope } from '../../config/settings.js';
import { useKeypress } from '../hooks/useKeypress.js';
import { useRuntimeApi } from '../contexts/RuntimeContext.js';
import type { AuthStatus } from '@vybestack/llxprt-code-providers/auth.js';
import { firstNonEmptyString } from '../../utils/coalesce.js';
import { getBorderStyle } from '../contexts/UnicodeRenderingContext.js';

interface AuthDialogProps {
  onSelect: (authMethod: string | undefined, scope: SettingScope) => void;
  settings: LoadedSettings;
  initialErrorMessage?: string | null;
}

interface AuthDialogState {
  enabledProviders: Set<string>;
  setEnabledProviders: React.Dispatch<React.SetStateAction<Set<string>>>;
  authStatuses: Map<string, AuthStatus>;
  reloadAuthStatuses: () => Promise<void>;
}

function getEnabledProviders(
  oauthProviders: Record<string, boolean> | undefined,
): Set<string> {
  const enabled = new Set<string>();
  const providers = oauthProviders ?? {};
  for (const [provider, isEnabled] of Object.entries(providers)) {
    if (isEnabled) {
      enabled.add(`oauth_${provider}`);
    }
  }
  return enabled;
}

const AuthDialogHeader: React.FC = () => (
  <>
    <Text bold color={Colors.Foreground}>
      OAuth Authentication
    </Text>
    <Box marginTop={1}>
      <Text color={Colors.Foreground}>
        Select an OAuth provider to toggle enable/disable:
      </Text>
    </Box>
    <Box marginTop={1}>
      <Text color={Colors.DimComment}>
        Note: You can also use API keys via /key, /keyfile, --key, --keyfile,
        --key-name, or environment variables
      </Text>
    </Box>
  </>
);

const AuthDialogFooter: React.FC = () => (
  <>
    <Box marginTop={1}>
      <Text color={Colors.Gray}>(Use Enter to select, ESC to close)</Text>
    </Box>
    <Box marginTop={1}>
      <Text color={Colors.Foreground}>
        Terms of Services and Privacy Notice for Gemini CLI
      </Text>
    </Box>
    <Box marginTop={1}>
      <Text color={Colors.AccentBlue}>
        {
          'https://github.com/acoliver/llxprt-code/blob/main/docs/tos-privacy.md'
        }
      </Text>
    </Box>
  </>
);

function getStatusLabel(
  provider: string,
  authStatuses: ReadonlyMap<string, AuthStatus>,
): string {
  const status = authStatuses.get(provider);
  if (status === undefined) return '';
  return status.authenticated ? ' (Authenticated)' : ' (Not authenticated)';
}

function buildAuthItems(
  enabledProviders: Set<string>,
  authStatuses: ReadonlyMap<string, AuthStatus>,
): Array<{
  key: string;
  label: string;
  value: string;
}> {
  return [
    {
      key: 'oauth_claudecode',
      label: `Claude Code (Claude.ai OAuth) ${enabledProviders.has('oauth_claudecode') ? '[ON]' : '[OFF]'}${getStatusLabel('claudecode', authStatuses)}`,
      value: 'oauth_claudecode',
    },
    {
      key: 'oauth_codex',
      label: `Codex (ChatGPT OAuth) ${enabledProviders.has('oauth_codex') ? '[ON]' : '[OFF]'}${getStatusLabel('codex', authStatuses)}`,
      value: 'oauth_codex',
    },
    {
      key: 'close',
      label: 'Close',
      value: 'close',
    },
  ];
}

interface AuthDialogContentProps {
  items: Array<{ key: string; label: string; value: string }>;
  errorMessage: string | null;
  handleAuthSelect: (authMethod: string) => void;
}

const AuthDialogContent: React.FC<AuthDialogContentProps> = ({
  items,
  errorMessage,
  handleAuthSelect,
}) => (
  <>
    <AuthDialogHeader />
    <Box marginTop={1}>
      <RadioButtonSelect
        items={items}
        initialIndex={0}
        onSelect={handleAuthSelect}
      />
    </Box>
    {errorMessage && (
      <Box marginTop={1}>
        <Text color={Colors.AccentRed}>{errorMessage}</Text>
      </Box>
    )}
    <AuthDialogFooter />
  </>
);

function useMountedRef(): React.MutableRefObject<boolean> {
  const mountedRef = useRef(true);
  useEffect(() => {
    mountedRef.current = true;
    return () => {
      mountedRef.current = false;
    };
  }, []);
  return mountedRef;
}

function useAuthDialogState(
  settings: LoadedSettings,
  runtime: ReturnType<typeof useRuntimeApi>,
  mountedRef: React.MutableRefObject<boolean>,
): AuthDialogState {
  const [enabledProviders, setEnabledProviders] = useState<Set<string>>(() =>
    getEnabledProviders(settings.merged.oauthEnabledProviders),
  );
  const [authStatuses, setAuthStatuses] = useState<Map<string, AuthStatus>>(
    () => new Map(),
  );

  const reloadAuthStatuses = useCallback(async (): Promise<void> => {
    try {
      const statuses = await runtime.getCliOAuthManager().getAuthStatus();
      if (!mountedRef.current) return;
      setAuthStatuses(
        new Map(statuses.map((status) => [status.provider, status])),
      );
      syncEnabledProvidersFromAuthStatus(setEnabledProviders, statuses);
    } catch {
      if (mountedRef.current) setAuthStatuses(new Map());
    }
  }, [mountedRef, runtime, setEnabledProviders]);

  useEffect(() => {
    setEnabledProviders(
      getEnabledProviders(settings.merged.oauthEnabledProviders),
    );
  }, [settings.merged.oauthEnabledProviders]);

  useEffect(() => {
    void reloadAuthStatuses();
  }, [reloadAuthStatuses]);

  return {
    enabledProviders,
    setEnabledProviders,
    authStatuses,
    reloadAuthStatuses,
  };
}

function syncEnabledProvidersFromAuthStatus(
  setEnabledProviders: React.Dispatch<React.SetStateAction<Set<string>>>,
  statuses: AuthStatus[],
): void {
  setEnabledProviders((prev) => {
    const next = new Set(prev);
    for (const status of statuses) {
      const key = `oauth_${status.provider}`;
      if (status.oauthEnabled === true) {
        next.add(key);
      } else if (status.oauthEnabled === false) {
        next.delete(key);
      }
    }
    return next;
  });
}

function useCloseAuthDialogOnEscape(
  onSelect: AuthDialogProps['onSelect'],
): void {
  useKeypress(
    (key) => {
      if (key.name === 'escape') {
        onSelect(undefined, SettingScope.User);
      }
    },
    { isActive: true },
  );
}

export function AuthDialog({
  onSelect,
  settings,
  initialErrorMessage,
}: AuthDialogProps): React.JSX.Element {
  const runtime = useRuntimeApi();
  const mountedRef = useMountedRef();
  const [errorMessage, setErrorMessage] = useState<string | null>(
    firstNonEmptyString(initialErrorMessage) ?? null,
  );
  const {
    enabledProviders,
    setEnabledProviders,
    authStatuses,
    reloadAuthStatuses,
  } = useAuthDialogState(settings, runtime, mountedRef);
  const items = useMemo(
    () => buildAuthItems(enabledProviders, authStatuses),
    [enabledProviders, authStatuses],
  );

  const handleAuthSelect = useCallback(
    (authMethod: string) => {
      setErrorMessage(null);

      if (authMethod === 'close') {
        onSelect(undefined, SettingScope.User);
        return;
      }

      const providerName = authMethod.replace('oauth_', '');

      void (async () => {
        try {
          const enabled = await runtime
            .getCliOAuthManager()
            .toggleOAuthEnabled(providerName);
          if (!mountedRef.current) return;
          setEnabledProviders((prev) => {
            const next = new Set(prev);
            if (enabled) {
              next.add(authMethod);
            } else {
              next.delete(authMethod);
            }
            return next;
          });
          await reloadAuthStatuses();
        } catch (error) {
          if (mountedRef.current) {
            const errorMessage =
              error instanceof Error ? error.message : String(error);
            setErrorMessage(
              `Failed to toggle OAuth for ${providerName}: ${errorMessage}`,
            );
          }
        }
      })();
    },
    [mountedRef, onSelect, reloadAuthStatuses, runtime, setEnabledProviders],
  );

  useCloseAuthDialogOnEscape(onSelect);

  return (
    <Box
      borderStyle={getBorderStyle('round')}
      borderColor={Colors.Gray}
      flexDirection="column"
      padding={1}
      width="100%"
      backgroundColor={Colors.Background}
    >
      <AuthDialogContent
        items={items}
        errorMessage={errorMessage}
        handleAuthSelect={handleAuthSelect}
      />
    </Box>
  );
}