75 lines
2.2 KiB
TypeScript
75 lines
2.2 KiB
TypeScript
|
|
/**
|
||
|
|
* Dashboard tests — Task 5.25.
|
||
|
|
*/
|
||
|
|
|
||
|
|
import { describe, it, expect, vi } from 'vitest';
|
||
|
|
import { render, screen } from '@testing-library/react';
|
||
|
|
import { DashboardGrid } from '@/components/dashboard/DashboardGrid';
|
||
|
|
import type { DashboardWidgetDef } from '@/api/dashboard';
|
||
|
|
|
||
|
|
// Mock i18n
|
||
|
|
vi.mock('react-i18next', () => ({
|
||
|
|
useTranslation: () => ({ t: (key: string) => key }),
|
||
|
|
}));
|
||
|
|
|
||
|
|
// Mock DashboardWidgetLoader to avoid lazy loading in tests
|
||
|
|
vi.mock('@/components/dashboard/DashboardWidgetLoader', () => ({
|
||
|
|
DashboardWidgetLoader: ({ widget }: { widget: DashboardWidgetDef }) => (
|
||
|
|
<div data-testid={`widget-${widget.id}`}>Widget: {widget.label}</div>
|
||
|
|
),
|
||
|
|
}));
|
||
|
|
|
||
|
|
// Mock Skeleton
|
||
|
|
vi.mock('@/components/ui/Skeleton', () => ({
|
||
|
|
Skeleton: ({ className }: { className?: string }) => (
|
||
|
|
<div className={className} data-testid="skeleton">Loading...</div>
|
||
|
|
),
|
||
|
|
}));
|
||
|
|
|
||
|
|
const mockWidgets: DashboardWidgetDef[] = [
|
||
|
|
{
|
||
|
|
id: 'recent_contacts',
|
||
|
|
label_key: 'dashboard.recentContacts',
|
||
|
|
label: 'Recent Contacts',
|
||
|
|
component: '@/components/dashboard/RecentContactsWidget',
|
||
|
|
icon: 'Users',
|
||
|
|
order: 10,
|
||
|
|
col_span: 2,
|
||
|
|
row_span: 1,
|
||
|
|
permission: '',
|
||
|
|
plugin_name: 'contacts',
|
||
|
|
},
|
||
|
|
{
|
||
|
|
id: 'tasks_summary',
|
||
|
|
label_key: 'dashboard.tasksSummary',
|
||
|
|
label: 'Tasks Summary',
|
||
|
|
component: '@/components/dashboard/TasksSummaryWidget',
|
||
|
|
icon: 'CheckSquare',
|
||
|
|
order: 20,
|
||
|
|
col_span: 1,
|
||
|
|
row_span: 1,
|
||
|
|
permission: '',
|
||
|
|
plugin_name: 'tasks',
|
||
|
|
},
|
||
|
|
];
|
||
|
|
|
||
|
|
describe('DashboardGrid', () => {
|
||
|
|
it('renders widgets in a grid', () => {
|
||
|
|
render(<DashboardGrid widgets={mockWidgets} />);
|
||
|
|
expect(screen.getByTestId('dashboard-grid')).toBeInTheDocument();
|
||
|
|
expect(screen.getByTestId('dashboard-grid-item-recent_contacts')).toBeInTheDocument();
|
||
|
|
expect(screen.getByTestId('dashboard-grid-item-tasks_summary')).toBeInTheDocument();
|
||
|
|
});
|
||
|
|
|
||
|
|
it('shows empty message when no widgets', () => {
|
||
|
|
render(<DashboardGrid widgets={[]} />);
|
||
|
|
expect(screen.getByTestId('dashboard-grid-empty')).toBeInTheDocument();
|
||
|
|
});
|
||
|
|
|
||
|
|
it('renders widget labels', () => {
|
||
|
|
render(<DashboardGrid widgets={mockWidgets} />);
|
||
|
|
expect(screen.getByText('Recent Contacts')).toBeInTheDocument();
|
||
|
|
expect(screen.getByText('Tasks Summary')).toBeInTheDocument();
|
||
|
|
});
|
||
|
|
});
|