import { describe, it, expect, vi, beforeEach } from 'vitest';
import { render, screen } from '@testing-library/react';

// Mock next/navigation
vi.mock('next/navigation', () => ({
  usePathname: () => '/overview',
  useRouter: () => ({ push: vi.fn() }),
}));

// Mock next/link
vi.mock('next/link', () => ({
  default: ({ children, href, ...props }: { children: React.ReactNode; href: string; [key: string]: unknown }) => (
    <a href={href} {...props}>{children}</a>
  ),
}));

// Mock auth store — return a user with name and role
vi.mock('@/lib/stores/auth-store', () => ({
  useAuthStore: (selector: (s: Record<string, unknown>) => unknown) =>
    selector({
      user: { name: 'John Doe', role: 'Super_Admin' },
      role: 'Super_Admin',
      isAuthenticated: true,
      logout: vi.fn(),
    }),
}));

// Mock right panel store
vi.mock('@/lib/stores/right-panel-store', () => ({
  useRightPanelStore: (selector: (s: Record<string, unknown>) => unknown) =>
    selector({ toggle: vi.fn(), isOpen: false }),
}));

import TopNav from '@/components/layout/TopNav';

describe('TopNav', () => {
  beforeEach(() => {
    vi.clearAllMocks();
  });

  it('renders breadcrumb text', () => {
    render(<TopNav />);
    // BreadcrumbBar should render "Dashboards" and "Overview"
    expect(screen.getByText('Dashboards')).toBeInTheDocument();
    expect(screen.getByText('Overview')).toBeInTheDocument();
  });

  it('renders search input with "Search" placeholder', () => {
    render(<TopNav />);
    expect(screen.getByPlaceholderText('Search')).toBeInTheDocument();
  });

  it('renders Settings action icon button', () => {
    render(<TopNav />);
    expect(screen.getByLabelText('Settings')).toBeInTheDocument();
  });

  it('renders Notifications action icon button', () => {
    render(<TopNav />);
    expect(screen.getByLabelText('Notifications')).toBeInTheDocument();
  });

  it('renders Toggle right panel action icon button', () => {
    render(<TopNav />);
    expect(screen.getByLabelText('Toggle right panel')).toBeInTheDocument();
  });

  it('displays user name', () => {
    render(<TopNav />);
    expect(screen.getByText('John Doe')).toBeInTheDocument();
  });

  it('displays role badge', () => {
    render(<TopNav />);
    expect(screen.getByText('Super Admin')).toBeInTheDocument();
  });

  it('renders logout button', () => {
    render(<TopNav />);
    expect(screen.getByLabelText('Log out')).toBeInTheDocument();
  });
});