import React from 'react';
import { render, fireEvent } from '@testing-library/react-native';
import { Text } from 'react-native';
import { OverlayWidget } from '../components/OverlayWidget';

describe('OverlayWidget rendering', () => {
    it('should render children when visible is true for bottom position', () => {
        const { getByText } = render(
            <OverlayWidget visible={true} width={390} height={300} position="bottom">
                <Text>Bottom Widget</Text>
            </OverlayWidget>
        );

        expect(getByText('Bottom Widget')).toBeTruthy();
    });

    it('should render children when visible is true for top position', () => {
        const { getByText } = render(
            <OverlayWidget visible={true} width={390} height={300} position="top">
                <Text>Top Widget</Text>
            </OverlayWidget>
        );

        expect(getByText('Top Widget')).toBeTruthy();
    });

    it('should render close button when visible is true', () => {
        const { getByText } = render(
            <OverlayWidget visible={true} width={390} height={300} position="bottom">
                <Text>Content</Text>
            </OverlayWidget>
        );

        expect(getByText('✕')).toBeTruthy();
    });

    it('should call onClose when close button is pressed', () => {
        const mockOnClose = jest.fn();
        const { getByText } = render(
            <OverlayWidget visible={true} width={390} height={300} position="bottom" onClose={mockOnClose}>
                <Text>Content</Text>
            </OverlayWidget>
        );

        fireEvent.press(getByText('✕'));

        expect(mockOnClose).toHaveBeenCalledTimes(1);
    });

    it('should call onClose when close button is pressed and component is controlled by parent', () => {
        const mockOnClose = jest.fn();
        const { getByText } = render(
            <OverlayWidget visible={true} width={390} height={300} position="bottom" onClose={mockOnClose}>
                <Text>Dismissible Content</Text>
            </OverlayWidget>
        );

        fireEvent.press(getByText('✕'));

        expect(mockOnClose).toHaveBeenCalledTimes(1);
    });

    it('should not render when visible prop is false', () => {
        const { queryByText } = render(
            <OverlayWidget visible={false} width={390} height={300} position="top" onClose={jest.fn()}>
                <Text>Top Content</Text>
            </OverlayWidget>
        );

        expect(queryByText('Top Content')).toBeNull();
        expect(queryByText('✕')).toBeNull();
    });

    it('should hide content when visible prop changes to false', () => {
        const { queryByText, rerender } = render(
            <OverlayWidget visible={true} width={390} height={300} position="bottom" onClose={jest.fn()}>
                <Text>Content</Text>
            </OverlayWidget>
        );

        rerender(
            <OverlayWidget visible={false} width={390} height={300} position="bottom" onClose={jest.fn()}>
                <Text>Content</Text>
            </OverlayWidget>
        );

        expect(queryByText('Content')).toBeNull();
    });

    it('should not call onClose if onClose prop is not provided', () => {
        const { getByText } = render(
            <OverlayWidget visible={true} width={390} height={300} position="bottom">
                <Text>Content</Text>
            </OverlayWidget>
        );

        expect(() => fireEvent.press(getByText('✕'))).not.toThrow();
    });

    it('should hide close button when visible is false', () => {
        const { queryByText } = render(
            <OverlayWidget visible={false} width={390} height={300} position="bottom">
                <Text>Content</Text>
            </OverlayWidget>
        );

        expect(queryByText('✕')).toBeNull();
    });

    it('should render multiple children', () => {
        const { getByText } = render(
            <OverlayWidget visible={true} width={390} height={300} position="bottom">
                <Text>First</Text>
                <Text>Second</Text>
            </OverlayWidget>
        );

        expect(getByText('First')).toBeTruthy();
        expect(getByText('Second')).toBeTruthy();
    });
});