/** * Epic 1: Authentication & User Management * Component Test: Navigation * * Tests the navigation component for proper display based on session state */ import { describe, it, expect, vi, beforeEach, afterEach } from 'vitest' import { render, screen, waitFor } from '@testing-library/react' import Navigation from '@/components/Navigation' // Mock the SessionProvider vi.mock('@/components/SessionProvider', () => ({ useSession: vi.fn(), })) // Mock the auth-client vi.mock('@/lib/auth-client', () => ({ authClient: { signOut: vi.fn(), }, })) // Mock fetch for role API call global.fetch = vi.fn() import { useSession } from '@/components/SessionProvider' describe('Epic 1: Navigation Component', () => { beforeEach(() => { vi.clearAllMocks() vi.mocked(global.fetch).mockResolvedValue({ json: () => Promise.resolve({ role: 'player' }), } as Response) }) afterEach(() => { vi.restoreAllMocks() }) it('renders the logo and basic links when not logged in', () => { vi.mocked(useSession).mockReturnValue({ session: null, loading: false, refreshSession: vi.fn(), }) render() expect(screen.getByText('EuchreCamp')).toBeInTheDocument() expect(screen.getByText('Rankings')).toBeInTheDocument() expect(screen.getByText('Sign in')).toBeInTheDocument() expect(screen.getByText('Sign up')).toBeInTheDocument() }) it('shows user menu when logged in', async () => { vi.mocked(useSession).mockReturnValue({ session: { user: { id: 'user-123', email: 'test@example.com', name: 'Test User', role: 'player' }, session: { token: 'abc123' }, }, loading: false, refreshSession: vi.fn(), }) render() await waitFor(() => { expect(screen.getByText('Test User')).toBeInTheDocument() }) expect(screen.getByText('Sign out')).toBeInTheDocument() expect(screen.getByText('Tournaments')).toBeInTheDocument() }) it('shows Tournaments link when logged in', async () => { vi.mocked(useSession).mockReturnValue({ session: { user: { id: 'user-123', email: 'test@example.com', name: 'Test User', role: 'player' }, session: { token: 'abc123' }, }, loading: false, refreshSession: vi.fn(), }) render() await waitFor(() => { expect(screen.getByText('Tournaments')).toBeInTheDocument() }) }) it('shows admin link for club_admin role', async () => { vi.mocked(useSession).mockReturnValue({ session: { user: { id: 'admin-123', email: 'admin@example.com', name: 'Admin User', role: 'club_admin', }, session: { token: 'abc123' }, }, loading: false, refreshSession: vi.fn(), }) // Mock fetch to return club_admin role vi.mocked(global.fetch).mockResolvedValue({ json: () => Promise.resolve({ role: 'club_admin' }), } as Response) render() await waitFor(() => { expect(screen.getByText('Admin')).toBeInTheDocument() }) expect(screen.getByText('Tournaments')).toBeInTheDocument() }) it('hides admin link for non-admin users', async () => { vi.mocked(useSession).mockReturnValue({ session: { user: { id: 'player-123', email: 'player@example.com', name: 'Player User', role: 'player', }, session: { token: 'abc123' }, }, loading: false, refreshSession: vi.fn(), }) // Mock fetch to return player role vi.mocked(global.fetch).mockResolvedValue({ json: () => Promise.resolve({ role: 'player' }), } as Response) render() await waitFor(() => { expect(screen.getByText('Tournaments')).toBeInTheDocument() }) expect(screen.queryByText('Admin')).not.toBeInTheDocument() }) it('shows loading state', () => { vi.mocked(useSession).mockReturnValue({ session: null, loading: true, refreshSession: vi.fn(), }) render() expect(screen.getByText('Loading...')).toBeInTheDocument() }) })