([]);
+ const [loading, setLoading] = useState(true);
+ const [isAdding, setIsAdding] = useState(false);
+ const [newDescription, setNewDescription] = useState("");
+ const [newAssignee, setNewAssignee] = useState("");
+ const [newPriority, setNewPriority] = useState<"low" | "medium" | "high">("medium");
+
+ // Load action items
+ useEffect(() => {
+ async function loadActions() {
+ try {
+ const response = await fetch(`/api/retrospective/${sessionId}/actions`);
+ if (response.ok) {
+ const data = await response.json();
+ setActions(data);
+ }
+ } catch (error) {
+ console.error("Failed to load action items:", error);
+ } finally {
+ setLoading(false);
+ }
+ }
+ loadActions();
+ }, [sessionId]);
+
+ const handleAddAction = async () => {
+ if (!newDescription.trim()) return;
+
+ try {
+ const response = await fetch(`/api/retrospective/${sessionId}/actions`, {
+ method: "POST",
+ headers: { "Content-Type": "application/json" },
+ body: JSON.stringify({
+ description: newDescription,
+ assigneeName: newAssignee || userName,
+ assigneeId: userId,
+ priority: newPriority,
+ }),
+ });
+
+ if (response.ok) {
+ const action = await response.json();
+ setActions((prev) => [...prev, action]);
+ setNewDescription("");
+ setNewAssignee("");
+ setNewPriority("medium");
+ setIsAdding(false);
+ }
+ } catch (error) {
+ console.error("Failed to add action item:", error);
+ }
+ };
+
+ const handleUpdateStatus = async (actionId: string, status: "open" | "in_progress" | "done") => {
+ try {
+ const response = await fetch(`/api/retrospective/${sessionId}/actions/${actionId}`, {
+ method: "PATCH",
+ headers: { "Content-Type": "application/json" },
+ body: JSON.stringify({ status }),
+ });
+
+ if (response.ok) {
+ const updated = await response.json();
+ setActions((prev) => prev.map((a) => (a.id === actionId ? updated : a)));
+ }
+ } catch (error) {
+ console.error("Failed to update action item:", error);
+ }
+ };
+
+ const handleDeleteAction = async (actionId: string) => {
+ try {
+ const response = await fetch(`/api/retrospective/${sessionId}/actions/${actionId}`, {
+ method: "DELETE",
+ });
+
+ if (response.ok) {
+ setActions((prev) => prev.filter((a) => a.id !== actionId));
+ }
+ } catch (error) {
+ console.error("Failed to delete action item:", error);
+ }
+ };
+
+ if (loading) {
+ return (
+
+ Loading action items...
+
+ );
+ }
+
+ const groupedByStatus = {
+ open: actions.filter((a) => a.status === "open"),
+ in_progress: actions.filter((a) => a.status === "in_progress"),
+ done: actions.filter((a) => a.status === "done"),
+ };
+
+ return (
+
+ {/* Add New Action */}
+ {isAdding ? (
+
+
+