/* eslint-disable @typescript-eslint/no-explicit-any */
import { render, screen } from '@testing-library/react';
import { describe, expect, it, vi } from 'vitest';
import Support from '../Support';

vi.mock('@inertiajs/react', () => ({
    Head: ({ title }: { title: string }) => <title>{title}</title>,
    Link: ({ href, children, ...rest }: any) => (
        <a href={href} {...rest}>
            {children}
        </a>
    ),
    router: {
        get: vi.fn(),
        post: vi.fn(),
        put: vi.fn(),
        patch: vi.fn(),
        delete: vi.fn(),
        visit: vi.fn(),
    },
    usePage: vi.fn(() => ({
        props: {
            auth: { user: null },
            flash: {},
            errors: {},
            ziggy: {
                url: 'http://localhost',
                port: null,
                defaults: [],
                routes: {},
            },
        },
    })),
    useForm: vi.fn(() => ({
        data: {},
        setData: vi.fn(),
        post: vi.fn(),
        processing: false,
        errors: {},
        reset: vi.fn(),
    })),
}));

vi.mock('@/Layouts/PlatformLayout', () => ({
    default: ({ children }: any) => (
        <div data-testid="platform-layout">{children}</div>
    ),
}));

vi.mock('@/components/ui/accordion', () => ({
    Accordion: ({ children }: any) => (
        <div data-testid="accordion">{children}</div>
    ),
    AccordionItem: ({ children }: any) => <div>{children}</div>,
    AccordionTrigger: ({ children }: any) => (
        <button type="button">{children}</button>
    ),
    AccordionContent: ({ children }: any) => <div>{children}</div>,
}));

vi.mock('framer-motion', () => ({
    motion: {
        div: ({ children, ...rest }: any) => <div {...rest}>{children}</div>,
    },
    useInView: () => true,
    AnimatePresence: ({ children }: any) => <>{children}</>,
}));

vi.stubGlobal('route', (name: string) => `/${name}`);

describe('Support page', () => {
    it('renders inside PlatformLayout', () => {
        render(<Support />);
        expect(screen.getByTestId('platform-layout')).toBeInTheDocument();
    });

    it('renders the hero heading "We\'re here to help you"', () => {
        render(<Support />);
        expect(screen.getByText(/we're here to/i)).toBeInTheDocument();
        expect(screen.getByText(/help you/i)).toBeInTheDocument();
    });

    it('renders the system status strip', () => {
        render(<Support />);
        expect(screen.getByText('All Systems Operational')).toBeInTheDocument();
    });

    it('renders the three support channel cards', () => {
        render(<Support />);
        expect(screen.getByText('Help Centre')).toBeInTheDocument();
        expect(screen.getByText('Email Support')).toBeInTheDocument();
        expect(screen.getByText('Live Chat')).toBeInTheDocument();
    });

    it('renders onboarding timeline with three steps', () => {
        render(<Support />);
        expect(screen.getByText('Instant provisioning')).toBeInTheDocument();
        expect(screen.getByText('Guided onboarding')).toBeInTheDocument();
        expect(screen.getByText('Migration support')).toBeInTheDocument();
    });

    it('renders FAQ accordion', () => {
        render(<Support />);
        expect(screen.getByTestId('accordion')).toBeInTheDocument();
        expect(
            screen.getByText('How do I get started after signing up?'),
        ).toBeInTheDocument();
    });

    it('renders Contact Support link in CTA', () => {
        render(<Support />);
        expect(screen.getByText('Contact Support')).toBeInTheDocument();
    });

    it('renders the search bar placeholder text', () => {
        render(<Support />);
        expect(
            screen.getByText(/search articles, tutorials, faqs/i),
        ).toBeInTheDocument();
    });
});