- Introduced constants for admin hooks: `STATS_FETCH_LIMIT`, `DEFAULT_PAGE_LIMIT`, and `STATS_REFETCH_INTERVAL` to enhance readability and maintainability. - Updated query guards to ensure data fetching is restricted to superusers. - Enhanced accessibility across admin components by adding `aria-hidden` attributes and improving focus-visible styles. - Simplified `useAdminStats`, `useAdminUsers`, and `useAdminOrganizations` with shared constants. - Added 403 Forbidden page with proper structure, styling, and tests. - Implemented new tests for admin hooks, DashboardStats, AdminLayout, and ForbiddenPage for better coverage.
103 lines
2.8 KiB
TypeScript
103 lines
2.8 KiB
TypeScript
/**
|
|
* Tests for Admin Dashboard Page
|
|
* Verifies rendering of admin dashboard with stats and quick actions
|
|
*/
|
|
|
|
import { render, screen } from '@testing-library/react';
|
|
import AdminPage from '@/app/admin/page';
|
|
import { useAdminStats } from '@/lib/api/hooks/useAdmin';
|
|
|
|
// Mock the useAdminStats hook
|
|
jest.mock('@/lib/api/hooks/useAdmin');
|
|
|
|
const mockUseAdminStats = useAdminStats as jest.MockedFunction<typeof useAdminStats>;
|
|
|
|
// Helper function to render with default mocked stats
|
|
function renderWithMockedStats() {
|
|
mockUseAdminStats.mockReturnValue({
|
|
data: {
|
|
totalUsers: 100,
|
|
activeUsers: 80,
|
|
totalOrganizations: 20,
|
|
totalSessions: 30,
|
|
},
|
|
isLoading: false,
|
|
isError: false,
|
|
error: null,
|
|
} as any);
|
|
|
|
return render(<AdminPage />);
|
|
}
|
|
|
|
describe('AdminPage', () => {
|
|
beforeEach(() => {
|
|
jest.clearAllMocks();
|
|
});
|
|
|
|
it('renders admin dashboard title', () => {
|
|
renderWithMockedStats();
|
|
|
|
expect(screen.getByText('Admin Dashboard')).toBeInTheDocument();
|
|
});
|
|
|
|
it('renders description text', () => {
|
|
renderWithMockedStats();
|
|
|
|
expect(
|
|
screen.getByText('Manage users, organizations, and system settings')
|
|
).toBeInTheDocument();
|
|
});
|
|
|
|
it('renders quick actions section', () => {
|
|
renderWithMockedStats();
|
|
|
|
expect(screen.getByText('Quick Actions')).toBeInTheDocument();
|
|
});
|
|
|
|
it('renders user management card', () => {
|
|
renderWithMockedStats();
|
|
|
|
expect(screen.getByText('User Management')).toBeInTheDocument();
|
|
expect(
|
|
screen.getByText('View, create, and manage user accounts')
|
|
).toBeInTheDocument();
|
|
});
|
|
|
|
it('renders organizations card', () => {
|
|
renderWithMockedStats();
|
|
|
|
// Check for the quick actions card (not the stat card)
|
|
expect(
|
|
screen.getByText('Manage organizations and their members')
|
|
).toBeInTheDocument();
|
|
});
|
|
|
|
it('renders system settings card', () => {
|
|
renderWithMockedStats();
|
|
|
|
expect(screen.getByText('System Settings')).toBeInTheDocument();
|
|
expect(
|
|
screen.getByText('Configure system-wide settings')
|
|
).toBeInTheDocument();
|
|
});
|
|
|
|
it('renders quick actions in grid layout', () => {
|
|
renderWithMockedStats();
|
|
|
|
// Check for Quick Actions heading which is above the grid
|
|
expect(screen.getByText('Quick Actions')).toBeInTheDocument();
|
|
|
|
// Verify all three quick action cards are present
|
|
expect(screen.getByText('User Management')).toBeInTheDocument();
|
|
expect(screen.getByText('System Settings')).toBeInTheDocument();
|
|
});
|
|
|
|
it('renders with proper container structure', () => {
|
|
const { container } = renderWithMockedStats();
|
|
|
|
const containerDiv = container.querySelector('.container');
|
|
expect(containerDiv).toBeInTheDocument();
|
|
expect(containerDiv).toHaveClass('mx-auto', 'px-6', 'py-8');
|
|
});
|
|
});
|