import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { useEffect, useState } from "react";
import { toast } from "sonner";
import { Button } from "../../components/ui/button";
import { useEditContext } from "../../editor/client/editContext";
import { get } from "../../editor/services/serviceHelper";
import { deleteComment } from "../services/taskService";
import { Clock3, MessageSquare, RefreshCw, Trash2, User } from "lucide-react";
function normalizeUserName(value) {
    return (value || "").trim().toLowerCase();
}
export function CommentsList(props) {
    const { taskId, refreshKey = 0, currentUsername } = props;
    const editContext = useEditContext();
    const [comments, setComments] = useState([]);
    const [loading, setLoading] = useState(false);
    const [deletingCommentId, setDeletingCommentId] = useState(null);
    const refresh = async () => {
        setLoading(true);
        try {
            const result = await get(`/parhelia/tasks/comments?taskId=${encodeURIComponent(taskId)}`);
            if (result.type === "success") {
                setComments(result.data || []);
            }
            else if (result.type !== "unauthorized") {
                if (result.summary)
                    toast.error(result.summary);
            }
        }
        finally {
            setLoading(false);
        }
    };
    const handleDeleteComment = async (comment) => {
        const confirmed = await new Promise((resolve) => {
            if (!editContext) {
                resolve(window.confirm("Delete this comment? This action cannot be undone."));
                return;
            }
            editContext.confirm({
                header: "Delete comment",
                message: "Delete this comment? This action cannot be undone.",
                acceptLabel: "Delete",
                showCancel: true,
                accept: () => resolve(true),
                reject: () => resolve(false),
            });
        });
        if (!confirmed)
            return;
        setDeletingCommentId(comment.commentId);
        try {
            const result = await deleteComment({ commentId: comment.commentId });
            if (result.type !== "success") {
                toast.error(result.summary || "Failed to delete comment");
                return;
            }
            setComments((prev) => prev.filter((c) => c.commentId !== comment.commentId));
            toast.success("Comment deleted");
        }
        finally {
            setDeletingCommentId(null);
        }
    };
    const normalizedCurrentUser = normalizeUserName(currentUsername);
    useEffect(() => {
        void refresh();
        // eslint-disable-next-line react-hooks/exhaustive-deps
    }, [taskId, refreshKey]);
    return (_jsxs("div", { className: "flex flex-col gap-3", children: [_jsxs("div", { className: "flex items-center justify-between", children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx(MessageSquare, { className: "h-4 w-4 text-slate-400" }), _jsx("span", { className: "text-xs font-bold tracking-wider text-slate-500 uppercase", children: "Comments" }), _jsx("span", { className: "rounded-full border border-slate-200 bg-white px-2 py-0.5 text-[10px] font-semibold text-slate-500", children: comments.length })] }), _jsxs(Button, { size: "sm", variant: "ghost", onClick: refresh, disabled: loading, className: "h-7 px-2 text-xs text-slate-400 hover:text-slate-600", children: [_jsx(RefreshCw, { className: `mr-1.5 h-3 w-3 ${loading ? "animate-spin" : ""}` }), "Refresh"] })] }), _jsx("div", { className: "space-y-4", children: comments.length === 0 ? (_jsxs("div", { className: "flex flex-col items-center justify-center rounded-xl border border-dashed border-slate-200 bg-white/70 py-8 text-center", children: [_jsx("div", { className: "mb-2 rounded-full bg-slate-100 p-3 shadow-inner", children: _jsx(MessageSquare, { className: "h-5 w-5 text-slate-300" }) }), _jsx("p", { className: "text-xs text-slate-400 italic", children: loading ? "Loading comments..." : "No comments yet." })] })) : (_jsx("div", { className: "relative space-y-3 before:absolute before:top-4 before:bottom-4 before:left-[17px] before:w-[2px] before:bg-gradient-to-b before:from-slate-200 before:via-slate-100 before:to-transparent before:content-['']", children: comments.map((c) => (_jsxs("article", { className: "group relative pl-11", children: [_jsx("div", { className: "absolute left-0 top-0.5 flex h-9 w-9 items-center justify-center rounded-full border border-slate-200 bg-gradient-to-b from-white to-slate-50 shadow-sm", children: _jsx(User, { className: "h-4 w-4 text-slate-500" }) }), _jsxs("div", { className: "rounded-2xl border border-slate-200 bg-white p-3 shadow-sm transition-all group-hover:border-slate-300 group-hover:shadow-md", children: [_jsxs("div", { className: "mb-2 flex items-start justify-between gap-3", children: [_jsxs("div", { className: "min-w-0 flex-1", children: [_jsx("span", { className: "truncate text-[13px] font-semibold text-slate-900", children: normalizedCurrentUser &&
                                                            normalizeUserName(c.author) === normalizedCurrentUser
                                                            ? "You"
                                                            : (c.authorDisplayName || c.author) ?? "Unknown" }), _jsxs("div", { className: "mt-0.5 flex items-center gap-1 text-[11px] text-slate-400", children: [_jsx(Clock3, { className: "h-3 w-3" }), _jsx("span", { children: new Date(c.createdAt).toLocaleString(undefined, {
                                                                    dateStyle: "medium",
                                                                    timeStyle: "short",
                                                                }) })] })] }), normalizedCurrentUser &&
                                                normalizeUserName(c.author) === normalizedCurrentUser && (_jsxs(Button, { size: "sm", variant: "ghost", onClick: () => void handleDeleteComment(c), disabled: deletingCommentId === c.commentId, className: "h-7 px-2 text-[11px] text-slate-400 hover:bg-red-50 hover:text-red-600", "data-testid": `taskboard-comment-delete-${c.commentId}`, title: "Delete comment", children: [_jsx(Trash2, { className: "mr-1 h-3 w-3" }), "Delete"] }))] }), _jsx("div", { className: "rounded-xl border border-slate-100 bg-slate-50/80 p-2.5", children: _jsx("div", { className: "whitespace-pre-wrap text-[13px] leading-relaxed text-slate-700", children: c.text }) })] })] }, c.commentId))) })) })] }));
}
//# sourceMappingURL=CommentsList.js.map