/** * Tests for Admin Users Page * Verifies rendering of user management page with proper mocks */ import { render, screen } from '@testing-library/react'; import { QueryClient, QueryClientProvider } from '@tanstack/react-query'; import AdminUsersPage from '@/app/[locale]/admin/users/page'; import { useAuth } from '@/lib/auth/AuthContext'; import { useAdminUsers } from '@/lib/api/hooks/useAdmin'; // Mock Next.js navigation hooks const mockPush = jest.fn(); const mockSearchParams = new URLSearchParams(); jest.mock('next/navigation', () => ({ useRouter: () => ({ push: mockPush, replace: jest.fn(), prefetch: jest.fn(), }), useSearchParams: () => mockSearchParams, })); // Mock dependencies jest.mock('@/lib/auth/AuthContext'); jest.mock('@/lib/api/hooks/useAdmin', () => ({ useAdminUsers: jest.fn(), useCreateUser: jest.fn(), useUpdateUser: jest.fn(), useDeleteUser: jest.fn(), useActivateUser: jest.fn(), useDeactivateUser: jest.fn(), useBulkUserAction: jest.fn(), })); const mockUseAuth = useAuth as jest.MockedFunction; const mockUseAdminUsers = useAdminUsers as jest.MockedFunction; // Import mutation hooks for mocking const { useCreateUser, useUpdateUser, useDeleteUser, useActivateUser, useDeactivateUser, useBulkUserAction, } = require('@/lib/api/hooks/useAdmin'); const mockUseCreateUser = useCreateUser as jest.MockedFunction; const mockUseUpdateUser = useUpdateUser as jest.MockedFunction; const mockUseDeleteUser = useDeleteUser as jest.MockedFunction; const mockUseActivateUser = useActivateUser as jest.MockedFunction; const mockUseDeactivateUser = useDeactivateUser as jest.MockedFunction; const mockUseBulkUserAction = useBulkUserAction as jest.MockedFunction; describe('AdminUsersPage', () => { let queryClient: QueryClient; beforeEach(() => { queryClient = new QueryClient({ defaultOptions: { queries: { retry: false, }, }, }); jest.clearAllMocks(); // Default mock implementations mockUseAuth.mockReturnValue({ user: { id: '1', email: 'admin@example.com', is_superuser: true } as any, isAuthenticated: true, isLoading: false, login: jest.fn(), logout: jest.fn(), }); mockUseAdminUsers.mockReturnValue({ data: { data: [], pagination: { total: 0, page: 1, page_size: 20, total_pages: 0, has_next: false, has_prev: false, }, }, isLoading: false, isError: false, error: null, refetch: jest.fn(), } as any); // Mock mutation hooks mockUseCreateUser.mockReturnValue({ mutate: jest.fn(), mutateAsync: jest.fn(), isError: false, isPending: false, error: null, } as any); mockUseUpdateUser.mockReturnValue({ mutate: jest.fn(), mutateAsync: jest.fn(), isError: false, isPending: false, error: null, } as any); mockUseDeleteUser.mockReturnValue({ mutate: jest.fn(), mutateAsync: jest.fn(), isError: false, isPending: false, error: null, } as any); mockUseActivateUser.mockReturnValue({ mutate: jest.fn(), mutateAsync: jest.fn(), isError: false, isPending: false, error: null, } as any); mockUseDeactivateUser.mockReturnValue({ mutate: jest.fn(), mutateAsync: jest.fn(), isError: false, isPending: false, error: null, } as any); mockUseBulkUserAction.mockReturnValue({ mutate: jest.fn(), mutateAsync: jest.fn(), isError: false, isPending: false, error: null, } as any); }); const renderWithProviders = (ui: React.ReactElement) => { return render({ui}); }; it('renders page title', () => { renderWithProviders(); expect(screen.getByText('User Management')).toBeInTheDocument(); }); it('renders page description', () => { renderWithProviders(); expect(screen.getByText('View, create, and manage user accounts')).toBeInTheDocument(); }); it('renders back button link', () => { renderWithProviders(); const backLink = screen.getByRole('link', { name: '' }); expect(backLink).toHaveAttribute('href', '/admin'); }); it('renders "All Users" heading in content', () => { renderWithProviders(); const allUsersHeadings = screen.getAllByText('All Users'); expect(allUsersHeadings.length).toBeGreaterThan(0); expect(allUsersHeadings[0]).toBeInTheDocument(); }); it('renders "Manage user accounts and permissions" description', () => { renderWithProviders(); expect(screen.getByText('Manage user accounts and permissions')).toBeInTheDocument(); }); it('renders create user button', () => { renderWithProviders(); expect(screen.getByRole('button', { name: /create user/i })).toBeInTheDocument(); }); it('renders with proper container structure', () => { const { container } = renderWithProviders(); const containerDiv = container.querySelector('.container'); expect(containerDiv).toBeInTheDocument(); expect(containerDiv).toHaveClass('mx-auto', 'px-6', 'py-8'); }); it('renders empty state when no users', () => { renderWithProviders(); expect(screen.getByText('No users found. Try adjusting your filters.')).toBeInTheDocument(); }); it('renders user list table with users', () => { mockUseAdminUsers.mockReturnValue({ data: { data: [ { id: '1', email: 'user1@example.com', first_name: 'User', last_name: 'One', is_active: true, is_superuser: false, created_at: '2025-01-01T00:00:00Z', }, { id: '2', email: 'user2@example.com', first_name: 'User', last_name: 'Two', is_active: false, is_superuser: true, created_at: '2025-01-02T00:00:00Z', }, ], pagination: { total: 2, page: 1, page_size: 20, total_pages: 1, has_next: false, has_prev: false, }, }, isLoading: false, isError: false, error: null, refetch: jest.fn(), } as any); renderWithProviders(); expect(screen.getByText('user1@example.com')).toBeInTheDocument(); expect(screen.getByText('user2@example.com')).toBeInTheDocument(); expect(screen.getByText('User One')).toBeInTheDocument(); expect(screen.getByText('User Two')).toBeInTheDocument(); }); });