/**
 * CanvasOverlays Tests
 *
 * Tests the FlowBuilder CanvasOverlays component including:
 * - Load error with retry/back
 * - Empty state overlay
 * - Missing trigger warning
 */
import { describe, it, expect, vi, beforeEach } from 'vitest';
import { render, screen, fireEvent } from '@testing-library/react';
import { CanvasOverlays, CanvasOverlaysProps } from './CanvasOverlays';
import { WorkflowReactFlowNode } from '../../types/reactflow';

describe('CanvasOverlays', () => {
  const mockTriggerNode: WorkflowReactFlowNode = {
    id: 'trigger-1',
    type: 'trigger',
    position: { x: 0, y: 0 },
    data: {
      name: 'User Registration',
      icon: 'UserPlus',
      status: 'valid',
      appName: 'WordPress',
      appService: 'wordpress',
    },
  };

  const mockActionNode: WorkflowReactFlowNode = {
    id: 'action-1',
    type: 'action',
    position: { x: 0, y: 100 },
    data: {
      name: 'Send Email',
      icon: 'Mail',
      status: 'valid',
      appName: 'WordPress',
      appService: 'wordpress',
    },
  };

  const defaultProps: CanvasOverlaysProps = {
    nodes: [],
    loading: false,
    loadError: null,
    onAddTrigger: vi.fn(),
    onRetryLoad: vi.fn(),
    onBack: vi.fn(),
  };

  beforeEach(() => {
    vi.clearAllMocks();
  });

  // ==========================================================================
  // Load Error Tests
  // ==========================================================================

  describe('load error', () => {
    it('displays load error alert when loadError is provided', () => {
      render(<CanvasOverlays {...defaultProps} loadError="Failed to load workflow" />);

      expect(screen.getByText('Failed to load workflow')).toBeInTheDocument();
    });

    it('shows retry button on load error', () => {
      render(<CanvasOverlays {...defaultProps} loadError="Load failed" />);

      expect(screen.getByText('Retry')).toBeInTheDocument();
    });

    it('shows back to list button on load error', () => {
      render(<CanvasOverlays {...defaultProps} loadError="Load failed" />);

      expect(screen.getByText('Back to List')).toBeInTheDocument();
    });

    it('calls onRetryLoad when retry button clicked', () => {
      render(<CanvasOverlays {...defaultProps} loadError="Load failed" />);

      fireEvent.click(screen.getByText('Retry'));

      expect(defaultProps.onRetryLoad).toHaveBeenCalled();
    });

    it('calls onBack when back button clicked', () => {
      render(<CanvasOverlays {...defaultProps} loadError="Load failed" />);

      fireEvent.click(screen.getByText('Back to List'));

      expect(defaultProps.onBack).toHaveBeenCalled();
    });

    it('does not show load error when loadError is null', () => {
      render(<CanvasOverlays {...defaultProps} loadError={null} />);

      expect(screen.queryByText('Retry')).not.toBeInTheDocument();
    });
  });

  // ==========================================================================
  // Empty State Tests
  // ==========================================================================

  describe('empty state', () => {
    it('shows empty state when nodes array is empty and not loading', () => {
      render(<CanvasOverlays {...defaultProps} nodes={[]} loading={false} />);

      expect(screen.getByText('Start building your workflow')).toBeInTheDocument();
      expect(screen.getByText('Add a trigger to begin')).toBeInTheDocument();
    });

    it('shows add trigger button in empty state', () => {
      render(<CanvasOverlays {...defaultProps} nodes={[]} loading={false} />);

      expect(screen.getByText('Add Trigger')).toBeInTheDocument();
    });

    it('calls onAddTrigger when add trigger button clicked in empty state', () => {
      render(<CanvasOverlays {...defaultProps} nodes={[]} loading={false} />);

      fireEvent.click(screen.getByText('Add Trigger'));

      expect(defaultProps.onAddTrigger).toHaveBeenCalled();
    });

    it('does not show empty state when loading', () => {
      render(<CanvasOverlays {...defaultProps} nodes={[]} loading={true} />);

      expect(screen.queryByText('Start building your workflow')).not.toBeInTheDocument();
    });

    it('does not show empty state when nodes exist', () => {
      render(<CanvasOverlays {...defaultProps} nodes={[mockTriggerNode]} loading={false} />);

      expect(screen.queryByText('Start building your workflow')).not.toBeInTheDocument();
    });
  });

  // ==========================================================================
  // Missing Trigger Warning Tests
  // ==========================================================================

  describe('missing trigger warning', () => {
    it('shows warning when nodes exist but no trigger', () => {
      render(<CanvasOverlays {...defaultProps} nodes={[mockActionNode]} />);

      expect(screen.getByText('Your workflow needs a trigger to run')).toBeInTheDocument();
    });

    it('does not show warning when trigger exists', () => {
      render(<CanvasOverlays {...defaultProps} nodes={[mockTriggerNode, mockActionNode]} />);

      expect(screen.queryByText('Your workflow needs a trigger to run')).not.toBeInTheDocument();
    });

    it('does not show warning when nodes array is empty', () => {
      render(<CanvasOverlays {...defaultProps} nodes={[]} />);

      expect(screen.queryByText('Your workflow needs a trigger to run')).not.toBeInTheDocument();
    });

    it('shows add trigger button in warning', () => {
      render(<CanvasOverlays {...defaultProps} nodes={[mockActionNode]} />);

      expect(screen.getByText('Add Trigger')).toBeInTheDocument();
    });

    it('calls onAddTrigger when button clicked in warning', () => {
      render(<CanvasOverlays {...defaultProps} nodes={[mockActionNode]} />);

      fireEvent.click(screen.getByText('Add Trigger'));

      expect(defaultProps.onAddTrigger).toHaveBeenCalled();
    });
  });

  // ==========================================================================
  // Combined States Tests
  // ==========================================================================

  describe('combined states', () => {
    it('shows only trigger-related message when both empty and missing trigger would apply', () => {
      // Empty state should show when no nodes
      render(<CanvasOverlays {...defaultProps} nodes={[]} />);

      expect(screen.getByText('Start building your workflow')).toBeInTheDocument();
      expect(screen.queryByText('Your workflow needs a trigger to run')).not.toBeInTheDocument();
    });
  });
});