feat: Phase I.2 I-UI — 5 new block types (agent_result, approval_request, task_card, workflow_card, knowledge_card) in BlockRenderer, tsc clean

2026-08-20 23:55:55 +02:00
parent 4ab91284c9
commit b540f4b2ab
7 changed files with 162 additions and 0 deletions
@@ -0,0 +1,28 @@
+import React from 'react';
+import type { MessageBlock } from '@/store/commStore';
+import { CheckSquare, Clock, User } from 'lucide-react';
+
+interface TaskCardBlockProps {
+  block: MessageBlock;
+}
+
+const TaskCardBlock: React.FC<TaskCardBlockProps> = ({ block }) => {
+  const { title, assignee, due_date, priority, status, task_id } = block.block_data;
+  const priorityColor = priority === 'high' ? 'text-danger-600' : priority === 'medium' ? 'text-warning-600' : 'text-secondary-500';
+  return (
+    <div className="border border-secondary-200 rounded-lg p-3 bg-white">
+      <div className="flex items-center gap-2 mb-2">
+        <CheckSquare className="w-4 h-4 text-primary-600" />
+        <span className="text-sm font-medium text-secondary-900">{title || 'Task'}</span>
+        {status && <span className="text-xs px-2 py-0.5 rounded-full bg-secondary-100 text-secondary-600 capitalize">{status}</span>}
+      </div>
+      <div className="flex items-center gap-3 text-xs text-secondary-500">
+        {assignee && <span className="flex items-center gap-1"><User className="w-3 h-3" /> {assignee}</span>}
+        {due_date && <span className="flex items-center gap-1"><Clock className="w-3 h-3" /> {due_date}</span>}
+        {priority && <span className={priorityColor}>● {priority}</span>}
+      </div>
+      {task_id && <p className="text-xs text-secondary-400 mt-1">Task: {task_id.slice(0, 8)}</p>}
+    </div>
+  );
+};
+export default TaskCardBlock;