/**
 * useNetworkGraph Hook
 *
 * Manages the network graph state for visualization:
 * - Fetches user's network from the API
 * - Integrates with room presence to mark active participants
 * - Provides real-time updates when connections change
 * - Caches graph for fast loading
 */

import { useState, useEffect, useCallback, useMemo } from 'react';
import { useAuth } from '../../context/AuthContext';
import {
  getMyNetworkGraph,
  getRoomNetworkGraph,
  createConnection,
  removeConnection,
  getCachedGraph,
  setCachedGraph,
  clearGraphCache,
  type NetworkGraph,
  type GraphNode,
  type GraphEdge,
  type TrustLevel,
} from '../../lib/networking';

// =============================================================================
// Types
// =============================================================================

export interface RoomParticipant {
  id: string;
  username: string;
  color: string; // Presence color from tldraw
}

export interface NetworkGraphState {
  nodes: GraphNode[];
  edges: GraphEdge[];
  myConnections: string[];
  isLoading: boolean;
  error: string | null;
}

export interface UseNetworkGraphOptions {
  // Room participants to highlight (from tldraw presence)
  roomParticipants?: RoomParticipant[];
  // Auto-refresh interval (ms), 0 to disable
  refreshInterval?: number;
  // Whether to use cached data initially
  useCache?: boolean;
}

export interface UseNetworkGraphReturn extends NetworkGraphState {
  // Refresh the graph from the server
  refresh: () => Promise<void>;
  // Connect to a user with optional trust level
  connect: (userId: string, trustLevel?: TrustLevel) => Promise<void>;
  // Disconnect from a user
  disconnect: (connectionId: string) => Promise<void>;
  // Check if connected to a user
  isConnectedTo: (userId: string) => boolean;
  // Get node by ID
  getNode: (userId: string) => GraphNode | undefined;
  // Get edges for a node
  getEdgesForNode: (userId: string) => GraphEdge[];
  // Nodes that are in the current room
  roomNodes: GraphNode[];
  // Nodes that are not in the room (shown in grey)
  networkNodes: GraphNode[];
}

// =============================================================================
// Hook Implementation
// =============================================================================

export function useNetworkGraph(options: UseNetworkGraphOptions = {}): UseNetworkGraphReturn {
  const {
    roomParticipants = [],
    refreshInterval = 0,
    useCache = true,
  } = options;

  const { session } = useAuth();
  const [state, setState] = useState<NetworkGraphState>({
    nodes: [],
    edges: [],
    myConnections: [],
    isLoading: true,
    error: null,
  });

  // Create a map of room participant IDs to their colors
  const participantColorMap = useMemo(() => {
    const map = new Map<string, string>();
    roomParticipants.forEach(p => map.set(p.id, p.color));
    return map;
  }, [roomParticipants]);

  const participantIds = useMemo(() =>
    roomParticipants.map(p => p.id),
    [roomParticipants]
  );

  // Fetch the network graph
  const fetchGraph = useCallback(async (skipCache = false) => {
    // For unauthenticated users, just show room participants without network connections
    if (!session.authed || !session.username) {
      // Create nodes from room participants for anonymous users
      const anonymousNodes: GraphNode[] = roomParticipants.map(participant => ({
        id: participant.id,
        username: participant.username,
        displayName: participant.username,
        avatarColor: participant.color,
        isInRoom: true,
        roomPresenceColor: participant.color,
        isCurrentUser: participant.id === roomParticipants[0]?.id, // First participant is current user
        isAnonymous: true,
        trustLevelTo: undefined,
        trustLevelFrom: undefined,
      }));

      setState({
        nodes: anonymousNodes,
        edges: [],
        myConnections: [],
        isLoading: false,
        error: null,
      });
      return;
    }

    // Try cache first
    if (useCache && !skipCache) {
      const cached = getCachedGraph();
      if (cached) {
        setState(prev => ({
          ...prev,
          nodes: cached.nodes.map(n => ({
            ...n,
            isInRoom: participantIds.includes(n.id),
            roomPresenceColor: participantColorMap.get(n.id),
            isCurrentUser: n.username === session.username,
            isAnonymous: false,
          })),
          edges: cached.edges,
          myConnections: (cached as any).myConnections || [],
          isLoading: false,
          error: null,
        }));
        // Still fetch in background to update
      }
    }

    try {
      setState(prev => ({ ...prev, isLoading: !prev.nodes.length }));

      // Double-check authentication before making API calls
      // This handles race conditions where session state might not be updated yet
      const currentUserId = (() => {
        try {
          // Session is stored as 'canvas_auth_session' by sessionPersistence.ts
          const sessionStr = localStorage.getItem('canvas_auth_session');
          if (sessionStr) {
            const s = JSON.parse(sessionStr);
            if (s.authed && s.username) return s.username;
          }
        } catch { /* ignore */ }
        return null;
      })();

      if (!currentUserId) {
        // Not authenticated - use room participants only
        const anonymousNodes: GraphNode[] = roomParticipants.map(participant => ({
          id: participant.id,
          username: participant.username,
          displayName: participant.username,
          avatarColor: participant.color,
          isInRoom: true,
          roomPresenceColor: participant.color,
          isCurrentUser: participant.id === roomParticipants[0]?.id,
          isAnonymous: true,
          trustLevelTo: undefined,
          trustLevelFrom: undefined,
        }));

        setState({
          nodes: anonymousNodes,
          edges: [],
          myConnections: [],
          isLoading: false,
          error: null,
        });
        return;
      }

      // Fetch graph, optionally scoped to room
      let graph: NetworkGraph;
      try {
        if (participantIds.length > 0) {
          graph = await getRoomNetworkGraph(participantIds);
        } else {
          graph = await getMyNetworkGraph();
        }
      } catch (apiError: any) {
        // If API call fails (e.g., 401 Unauthorized), fall back to showing room participants
        // Only log if it's not a 401 (which is expected for auth issues)
        if (!apiError.message?.includes('401')) {
          console.warn('Network graph API failed, falling back to room participants:', apiError.message);
        }
        const fallbackNodes: GraphNode[] = roomParticipants.map(participant => ({
          id: participant.id,
          username: participant.username,
          displayName: participant.username,
          avatarColor: participant.color,
          isInRoom: true,
          roomPresenceColor: participant.color,
          isCurrentUser: participant.id === session.username || participant.id === roomParticipants[0]?.id,
          isAnonymous: false,
          trustLevelTo: undefined,
          trustLevelFrom: undefined,
        }));

        setState({
          nodes: fallbackNodes,
          edges: [],
          myConnections: [],
          isLoading: false,
          error: null, // Don't show error to user - graceful degradation
        });
        return;
      }

      // Enrich nodes with room status, current user flag, and anonymous status
      const graphNodeIds = new Set(graph.nodes.map(n => n.id));

      const enrichedNodes = graph.nodes.map(node => ({
        ...node,
        isInRoom: participantIds.includes(node.id),
        roomPresenceColor: participantColorMap.get(node.id),
        isCurrentUser: node.username === session.username,
        isAnonymous: false, // Nodes from the graph are authenticated
      }));

      // Always ensure the current user is in the graph, even if they have no connections
      const currentUserInGraph = enrichedNodes.some(n => n.isCurrentUser);
      if (!currentUserInGraph) {
        // Find current user in room participants
        const currentUserParticipant = roomParticipants.find(p => p.id === session.username);
        if (currentUserParticipant) {
          enrichedNodes.push({
            id: currentUserParticipant.id,
            username: currentUserParticipant.username,
            displayName: currentUserParticipant.username,
            avatarColor: currentUserParticipant.color,
            isInRoom: true,
            roomPresenceColor: currentUserParticipant.color,
            isCurrentUser: true,
            isAnonymous: false,
            trustLevelTo: undefined,
            trustLevelFrom: undefined,
          });
        }
      }

      // Add room participants who are not in the network graph as anonymous nodes
      roomParticipants.forEach(participant => {
        if (!graphNodeIds.has(participant.id) && participant.id !== session.username) {
          // Check if this looks like an anonymous/guest ID
          const isAnonymous = participant.username.startsWith('Guest') ||
                             participant.username === 'Anonymous' ||
                             !participant.id.match(/^[a-zA-Z0-9_-]+$/); // CryptID usernames are alphanumeric

          enrichedNodes.push({
            id: participant.id,
            username: participant.username,
            displayName: participant.username,
            avatarColor: participant.color,
            isInRoom: true,
            roomPresenceColor: participant.color,
            isCurrentUser: false,
            isAnonymous,
            trustLevelTo: undefined,
            trustLevelFrom: undefined,
          });
        }
      });

      setState({
        nodes: enrichedNodes,
        edges: graph.edges,
        myConnections: graph.myConnections,
        isLoading: false,
        error: null,
      });

      // Cache the result
      setCachedGraph(graph);
    } catch (error) {
      setState(prev => ({
        ...prev,
        isLoading: false,
        error: (error as Error).message,
      }));
    }
  }, [session.authed, session.username, participantIds, participantColorMap, useCache, roomParticipants]);

  // Initial fetch
  useEffect(() => {
    fetchGraph();
  }, [fetchGraph]);

  // Listen for session-cleared event to immediately clear graph state
  useEffect(() => {
    const handleSessionCleared = () => {
      clearGraphCache();
      setState({
        nodes: [],
        edges: [],
        myConnections: [],
        isLoading: false,
        error: null,
      });
    };

    window.addEventListener('session-cleared', handleSessionCleared);
    return () => window.removeEventListener('session-cleared', handleSessionCleared);
  }, []);

  // Refresh interval
  useEffect(() => {
    if (refreshInterval > 0) {
      const interval = setInterval(() => fetchGraph(true), refreshInterval);
      return () => clearInterval(interval);
    }
  }, [refreshInterval, fetchGraph]);

  // Update room status when participants change AND add new participants immediately
  useEffect(() => {
    setState(prev => {
      const existingNodeIds = new Set(prev.nodes.map(n => n.id));

      // Update existing nodes with room status
      const updatedNodes = prev.nodes.map(node => ({
        ...node,
        isInRoom: participantIds.includes(node.id),
        roomPresenceColor: participantColorMap.get(node.id),
      }));

      // Add any new room participants that aren't in the graph yet
      roomParticipants.forEach(participant => {
        if (!existingNodeIds.has(participant.id)) {
          // Check if this is the current user
          const isCurrentUser = participant.id === session.username;

          // Check if this looks like an anonymous/guest ID
          const isAnonymous = !isCurrentUser && (
            participant.username.startsWith('Guest') ||
            participant.username === 'Anonymous' ||
            !participant.id.match(/^[a-zA-Z0-9_-]+$/)
          );

          updatedNodes.push({
            id: participant.id,
            username: participant.username,
            displayName: participant.username,
            avatarColor: participant.color,
            isInRoom: true,
            roomPresenceColor: participant.color,
            isCurrentUser,
            isAnonymous,
            trustLevelTo: undefined,
            trustLevelFrom: undefined,
          });
        }
      });

      return {
        ...prev,
        nodes: updatedNodes,
      };
    });
  }, [participantIds, participantColorMap, roomParticipants, session.username]);

  // Connect to a user
  const connect = useCallback(async (userId: string, trustLevel: TrustLevel = 'connected') => {
    try {
      await createConnection(userId, trustLevel);
      // Refresh the graph to get updated state
      await fetchGraph(true);
      clearGraphCache();
    } catch (error) {
      setState(prev => ({
        ...prev,
        error: (error as Error).message,
      }));
      throw error;
    }
  }, [fetchGraph]);

  // Disconnect from a user
  const disconnect = useCallback(async (connectionId: string) => {
    try {
      await removeConnection(connectionId);
      // Refresh the graph to get updated state
      await fetchGraph(true);
      clearGraphCache();
    } catch (error) {
      setState(prev => ({
        ...prev,
        error: (error as Error).message,
      }));
      throw error;
    }
  }, [fetchGraph]);

  // Check if connected to a user
  const isConnectedTo = useCallback((userId: string) => {
    return state.myConnections.includes(userId);
  }, [state.myConnections]);

  // Get node by ID
  const getNode = useCallback((userId: string) => {
    return state.nodes.find(n => n.id === userId);
  }, [state.nodes]);

  // Get edges for a node
  const getEdgesForNode = useCallback((userId: string) => {
    return state.edges.filter(e => e.source === userId || e.target === userId);
  }, [state.edges]);

  // Split nodes into room vs network
  const roomNodes = useMemo(() =>
    state.nodes.filter(n => n.isInRoom),
    [state.nodes]
  );

  const networkNodes = useMemo(() =>
    state.nodes.filter(n => !n.isInRoom),
    [state.nodes]
  );

  return {
    ...state,
    refresh: () => fetchGraph(true),
    connect,
    disconnect,
    isConnectedTo,
    getNode,
    getEdgesForNode,
    roomNodes,
    networkNodes,
  };
}

// =============================================================================
// Helper Hook: Extract room participants from tldraw editor
// =============================================================================

/**
 * Extract room participants from tldraw collaborators
 * Use this to get the roomParticipants for useNetworkGraph
 */
export function useRoomParticipantsFromEditor(editor: any): RoomParticipant[] {
  const [participants, setParticipants] = useState<RoomParticipant[]>([]);

  useEffect(() => {
    if (!editor) return;

    const updateParticipants = () => {
      try {
        const collaborators = editor.getCollaborators();
        const currentUser = editor.user;

        const ps: RoomParticipant[] = [
          // Add current user
          {
            id: currentUser.getId(),
            username: currentUser.getName(),
            color: currentUser.getColor(),
          },
          // Add collaborators
          ...collaborators.map((c: any) => ({
            id: c.id || c.instanceId,
            username: c.userName || 'Anonymous',
            color: c.color,
          })),
        ];

        setParticipants(ps);
      } catch (e) {
        console.warn('Failed to get collaborators:', e);
      }
    };

    // Initial update
    updateParticipants();

    // Listen for changes
    // Note: tldraw doesn't have a great event for this, so we poll
    const interval = setInterval(updateParticipants, 2000);

    return () => clearInterval(interval);
  }, [editor]);

  return participants;
}