I mean, it's at a good place rn...

panel/src/components/kanban/shared/assignee-avatar.tsx

@@ -0,0 +1,24 @@
+"use client";
+
+import { Avatar, AvatarFallback } from "@/components/ui/avatar";
+import { getAgentInitials } from "@/lib/agent-utils";
+
+interface AssigneeAvatarProps {
+  agentId: string | null;
+  size?: "sm" | "md";
+}
+
+export function AssigneeAvatar({ agentId, size = "sm" }: AssigneeAvatarProps) {
+  if (!agentId) return null;
+
+  const initials = getAgentInitials(agentId);
+  const sizeClasses = size === "sm" ? "h-6 w-6 text-xs" : "h-8 w-8 text-sm";
+
+  return (
+    <Avatar className={sizeClasses}>
+      <AvatarFallback className="bg-primary/10 text-primary">
+        {initials}
+      </AvatarFallback>
+    </Avatar>
+  );
+}

panel/src/components/kanban/shared/blocked-badge.tsx

@@ -0,0 +1,13 @@
+"use client";
+
+import { Badge } from "@/components/ui/badge";
+import { AlertTriangle } from "lucide-react";
+
+export function BlockedBadge() {
+  return (
+    <Badge variant="destructive" className="text-xs gap-1">
+      <AlertTriangle className="h-3 w-3" />
+      Blocked
+    </Badge>
+  );
+}

panel/src/components/kanban/shared/priority-indicator.tsx

@@ -0,0 +1,29 @@
+"use client";
+
+import { Badge } from "@/components/ui/badge";
+
+interface PriorityIndicatorProps {
+  priority: number;
+}
+
+const priorityColors: Record<number, string> = {
+  0: "bg-red-200 text-red-700",
+  1: "bg-orange-200 text-orange-700",
+  2: "bg-blue-200 text-blue-700",
+  3: "bg-gray-200 text-gray-700",
+};
+
+const priorityLabels: Record<number, string> = {
+  0: "P0",
+  1: "P1",
+  2: "P2",
+  3: "P3",
+};
+
+export function PriorityIndicator({ priority }: PriorityIndicatorProps) {
+  return (
+    <Badge className={priorityColors[priority] ?? priorityColors[2] + " text-xs"}>
+      {priorityLabels[priority] ?? "P2"}
+    </Badge>
+  );
+}