+ {widgets.map((widget, index) => {
+ const colSpan = Math.min(widget.col_span || 1, 4);
+ const colSpanClass = {
+ 1: 'lg:col-span-1',
+ 2: 'lg:col-span-2',
+ 3: 'lg:col-span-3',
+ 4: 'lg:col-span-4',
+ }[colSpan] || 'lg:col-span-1';
+
+ return (
+
handleDragStart(index)}
+ onDragOver={(e) => handleDragOver(e, index)}
+ onDrop={() => handleDrop(index)}
+ onDragEnd={handleDragEnd}
+ data-testid={`dashboard-grid-item-${widget.id}`}
+ >
+
+
+
+ {widget.label || t(widget.label_key)}
+
+ ⋮⋮
+
+
+
+
+ );
+ })}
+
+
+ {t('dashboard.widgetNotAvailable', { name: widget.label || widget.id })}
+
+
+ }>
+
+
+
+ );
+}
diff --git a/frontend/src/components/dashboard/RecentContactsWidget.tsx b/frontend/src/components/dashboard/RecentContactsWidget.tsx
new file mode 100644
index 0000000..8576ad3
--- /dev/null
+++ b/frontend/src/components/dashboard/RecentContactsWidget.tsx
@@ -0,0 +1,40 @@
+/**
+ * RecentContactsWidget — shows last 5 contacts (Task 5.25).
+ */
+
+import React from 'react';
+import { useTranslation } from 'react-i18next';
+import { useUnifiedContacts } from '@/api/hooks';
+import { formatDateTime } from '@/utils/date';
+import { Users } from 'lucide-react';
+
+export function RecentContactsWidget() {
+ const { t } = useTranslation();
+ const { data, isLoading, isError } = useUnifiedContacts(1, 5, undefined, undefined);
+
+ if (isLoading) {
+ return {[...Array(3)].map((_, i) =>
)}
{t('dashboard.widgetError')}
;
+ }
+
+ const contacts = data?.items ?? [];
+
+ if (contacts.length === 0) {
+ return {t('dashboard.noContacts')}
;
+ }
+
+ return (
+
+ {contacts.map((contact) => (
+
+
+ {contact.displayname}
+ {contact.email_1 && {contact.email_1}}
+
+ ))}
+
{t('dashboard.widgetError')}
;
+ }
+
+ const tasks = data?.items ?? [];
+ const openTasks = tasks.filter((task) => task.status !== 'done');
+ const overdueTasks = tasks.filter((task) => {
+ if (!task.due_date || task.status === 'done') return false;
+ return new Date(task.due_date) < new Date();
+ });
+ const highPriority = openTasks.filter((task) => task.priority === 'high' || task.priority === 'urgent');
+
+ return (
+
+
+
+ {openTasks.length}
+ {t('dashboard.openTasks')}
+
+ {overdueTasks.length > 0 && (
+
+
+
{overdueTasks.length} {t('dashboard.overdueTasks')}
+
+ )}
+ {highPriority.length > 0 && (
+
+
+ {highPriority.length} {t('dashboard.highPriorityTasks')}
+
+ )}
+ {openTasks.length === 0 && (
+
{t('dashboard.noOpenTasks')}
+ )}
+
{t('dashboard.title')}
@@ -68,6 +73,18 @@ export function DashboardPage() {
/>
+ {/* Dynamic Plugin Widgets */}
+ {widgetsError ? (
+
+ {t('dashboard.widgetsUnavailable')}
+
+ ) : widgets.length > 0 ? (
+
+
{t('dashboard.widgets')}
+
+
+ ) : null}
+
{auditError ? (
{t('dashboard.activityUnavailable')}
diff --git a/tests/test_dashboard.py b/tests/test_dashboard.py
new file mode 100644
index 0000000..d6393e8
--- /dev/null
+++ b/tests/test_dashboard.py
@@ -0,0 +1,46 @@
+"""Dashboard widget API tests — Task 5.25."""
+
+from __future__ import annotations
+
+import pytest
+from httpx import AsyncClient
+
+from tests.conftest import ORIGIN_HEADER, login_client, seed_tenant_and_users
+
+
+@pytest.mark.asyncio
+class TestDashboardWidgets:
+ """GET /api/v1/dashboard/widgets — list available widgets."""
+
+ async def test_list_widgets_returns_200(self, client: AsyncClient, db_session):
+ """Dashboard widgets endpoint returns 200 with items list."""
+ await seed_tenant_and_users(db_session)
+ await login_client(client, "admin@tenanta.com")
+
+ resp = await client.get("/api/v1/dashboard/widgets", headers=ORIGIN_HEADER)
+ assert resp.status_code == 200
+ data = resp.json()
+ assert "items" in data
+ assert "total" in data
+ assert isinstance(data["items"], list)
+
+ async def test_list_widgets_requires_auth(self, client: AsyncClient, db_session):
+ """Dashboard widgets endpoint requires authentication."""
+ await seed_tenant_and_users(db_session)
+
+ resp = await client.get("/api/v1/dashboard/widgets", headers=ORIGIN_HEADER)
+ assert resp.status_code == 401
+
+ async def test_list_widgets_has_plugin_name(self, client: AsyncClient, db_session):
+ """Each widget should include the contributing plugin name."""
+ await seed_tenant_and_users(db_session)
+ await login_client(client, "admin@tenanta.com")
+
+ resp = await client.get("/api/v1/dashboard/widgets", headers=ORIGIN_HEADER)
+ assert resp.status_code == 200
+ data = resp.json()
+ for widget in data["items"]:
+ assert "plugin_name" in widget
+ assert "id" in widget
+ assert "component" in widget
+ assert "label_key" in widget