All checks were successful
ci/woodpecker/push/woodpecker Pipeline was successful
Fixes all 542 ESLint problems in the web package to achieve 0 errors and 0 warnings. Changes: - Fixed 144 issues: nullish coalescing, return types, unused variables - Fixed 118 issues: unnecessary conditions, type safety, template literals - Fixed 79 issues: non-null assertions, unsafe assignments, empty functions - Fixed 67 issues: explicit return types, promise handling, enum comparisons - Fixed 45 final warnings: missing return types, optional chains - Fixed 25 typecheck-related issues: async/await, type assertions, formatting - Fixed JSX.Element namespace errors across 90+ files All Quality Rails violations resolved. Lint and typecheck both pass with 0 problems. Files modified: 118 components, tests, hooks, and utilities Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
66 lines
2.0 KiB
TypeScript
66 lines
2.0 KiB
TypeScript
import type { Task } from "@mosaic/shared";
|
|
import { TaskStatus, TaskPriority } from "@mosaic/shared";
|
|
|
|
interface DomainOverviewWidgetProps {
|
|
tasks: Task[];
|
|
isLoading: boolean;
|
|
}
|
|
|
|
export function DomainOverviewWidget({
|
|
tasks,
|
|
isLoading,
|
|
}: DomainOverviewWidgetProps): React.JSX.Element {
|
|
if (isLoading) {
|
|
return (
|
|
<div className="bg-white rounded-lg shadow-sm border border-gray-200 p-6">
|
|
<div className="flex justify-center items-center">
|
|
<div className="animate-spin rounded-full h-6 w-6 border-b-2 border-gray-900"></div>
|
|
<span className="ml-3 text-gray-600">Loading overview...</span>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
const stats = {
|
|
total: tasks.length,
|
|
inProgress: tasks.filter((t) => t.status === TaskStatus.IN_PROGRESS).length,
|
|
completed: tasks.filter((t) => t.status === TaskStatus.COMPLETED).length,
|
|
highPriority: tasks.filter((t) => t.priority === TaskPriority.HIGH).length,
|
|
};
|
|
|
|
const StatCard = ({
|
|
label,
|
|
value,
|
|
color,
|
|
}: {
|
|
label: string;
|
|
value: number;
|
|
color: string;
|
|
}): React.JSX.Element => (
|
|
<div className={`p-4 rounded-lg bg-gradient-to-br ${color}`}>
|
|
<div className="text-3xl font-bold text-white mb-1">{value}</div>
|
|
<div className="text-sm text-white/90">{label}</div>
|
|
</div>
|
|
);
|
|
|
|
return (
|
|
<div className="bg-white rounded-lg shadow-sm border border-gray-200 p-6">
|
|
<h2 className="text-lg font-semibold text-gray-900 mb-4">Domain Overview</h2>
|
|
<div className="grid grid-cols-2 gap-4">
|
|
<StatCard label="Total Tasks" value={stats.total} color="from-blue-500 to-blue-600" />
|
|
<StatCard
|
|
label="In Progress"
|
|
value={stats.inProgress}
|
|
color="from-green-500 to-green-600"
|
|
/>
|
|
<StatCard label="Completed" value={stats.completed} color="from-purple-500 to-purple-600" />
|
|
<StatCard
|
|
label="High Priority"
|
|
value={stats.highPriority}
|
|
color="from-red-500 to-red-600"
|
|
/>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|