/**
* DashboardQuickStats Component Tests
*/
import { render, screen } from '@testing-library/react';
import { DashboardQuickStats } from '@/components/dashboard/DashboardQuickStats';
import type { DashboardStats } from '@/lib/api/hooks/useDashboard';
describe('DashboardQuickStats', () => {
const mockStats: DashboardStats = {
activeProjects: 5,
runningAgents: 12,
openIssues: 34,
pendingApprovals: 3,
};
it('renders all four stat cards', () => {
render();
expect(screen.getByText('Active Projects')).toBeInTheDocument();
expect(screen.getByText('Running Agents')).toBeInTheDocument();
expect(screen.getByText('Open Issues')).toBeInTheDocument();
expect(screen.getByText('Pending Approvals')).toBeInTheDocument();
});
it('displays correct stat values', () => {
render();
expect(screen.getByText('5')).toBeInTheDocument();
expect(screen.getByText('12')).toBeInTheDocument();
expect(screen.getByText('34')).toBeInTheDocument();
expect(screen.getByText('3')).toBeInTheDocument();
});
it('displays descriptions for each stat', () => {
render();
expect(screen.getByText('Currently in progress')).toBeInTheDocument();
expect(screen.getByText('Working on tasks')).toBeInTheDocument();
expect(screen.getByText('Across all projects')).toBeInTheDocument();
expect(screen.getByText('Awaiting your review')).toBeInTheDocument();
});
it('shows zero values when stats are undefined', () => {
render();
// Should show 0 for all stats
const zeros = screen.getAllByText('0');
expect(zeros).toHaveLength(4);
});
it('shows loading state when isLoading is true', () => {
render();
// StatCard shows loading animation
const statCards = screen.getAllByTestId('stat-card');
statCards.forEach((card) => {
expect(card).toHaveClass('animate-pulse');
});
});
it('applies custom className', () => {
const { container } = render();
expect(container.firstChild).toHaveClass('custom-class');
});
});