import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { AlertTriangle, Loader2 } from "lucide-react";
import { Input } from "../../components/ui/input";
export function CreateReviewConfirmStep({ title, setTitle, isGeneratingTitle, languageSummary, reviewers, items, requiredApprovals, updateWorkflowOnCompletion, expirationDays, showSecretFields, error, }) {
    const reviewTitle = title || "Untitled Review";
    const reviewerName = reviewers[0]?.name || reviewers[0]?.email || "Reviewer";
    const itemNamesPreview = items
        .slice(0, 3)
        .map((item) => item.descriptor.displayName ||
        item.descriptor.name ||
        item.descriptor.path ||
        item.descriptor.id)
        .join(", ");
    const additionalItemsCount = Math.max(items.length - 3, 0);
    const itemSummary = items.length === 0
        ? "No items selected."
        : additionalItemsCount > 0
            ? `${itemNamesPreview}, and ${additionalItemsCount} more.`
            : itemNamesPreview;
    const emailSubject = `Review Invitation: ${reviewTitle}`;
    const emailBody = `Hi ${reviewerName},

You have been invited to review: ${reviewTitle}

Languages: ${languageSummary}
Items: ${itemSummary}

Please open your invitation link to start reviewing:
[Invitation Link]

Thank you.`;
    return (_jsxs("div", { className: "flex flex-col gap-6 pt-6", children: [_jsx("div", { className: "rounded-xl border border-blue-100 bg-blue-50 p-4 text-sm text-blue-800", children: "Please confirm these details before sending invitation emails." }), _jsxs("div", { className: "grid gap-4 md:grid-cols-2", children: [_jsxs("div", { className: "rounded-xl border border-gray-200 bg-white p-4", children: [_jsx("p", { className: "text-xs font-semibold tracking-wider text-gray-500 uppercase", children: "Review" }), _jsxs("div", { className: "mt-2 flex flex-col gap-2", children: [_jsxs("label", { htmlFor: "title", className: "text-xs font-medium text-gray-700", children: ["Review Name", _jsx("span", { className: "text-muted-foreground ml-1 text-[11px] font-normal", children: "(optional)" })] }), _jsx(Input, { id: "title", "data-testid": "review-title-input", value: title, onChange: (e) => setTitle(e.target.value), placeholder: "e.g., Homepage Q4 Review", className: "bg-white" }), isGeneratingTitle && (_jsxs("div", { className: "text-muted-foreground flex items-center gap-2 text-xs", children: [_jsx(Loader2, { className: "h-3 w-3 animate-spin" }), "Generating suggested name..."] }))] })] }), _jsxs("div", { className: "rounded-xl border border-gray-200 bg-white p-4", children: [_jsx("p", { className: "text-xs font-semibold tracking-wider text-gray-500 uppercase", children: "Languages" }), _jsx("p", { className: "mt-2 text-sm font-semibold text-gray-900", children: languageSummary })] })] }), _jsxs("div", { className: "rounded-xl border border-gray-200 bg-white p-4", children: [_jsxs("p", { className: "text-xs font-semibold tracking-wider text-gray-500 uppercase", children: ["Reviewers (", reviewers.length, ")"] }), _jsx("div", { className: "mt-3 flex flex-wrap gap-2", children: reviewers.map((reviewer) => (_jsxs("span", { className: "rounded-full border border-gray-200 bg-gray-50 px-3 py-1 text-xs text-gray-700", children: [reviewer.name || reviewer.email, " (", reviewer.email, ")"] }, reviewer.email))) })] }), _jsxs("div", { className: "rounded-xl border border-gray-200 bg-white p-4", children: [_jsxs("p", { className: "text-xs font-semibold tracking-wider text-gray-500 uppercase", children: ["Pages & Items (", items.length, ")"] }), _jsx("div", { className: "mt-3 max-h-40 space-y-2 overflow-y-auto", children: items.map((item, index) => (_jsxs("div", { className: "rounded-lg border border-gray-100 bg-gray-50 px-3 py-2 text-xs text-gray-700", children: [_jsx("p", { className: "font-medium text-gray-900", children: item.descriptor.displayName ||
                                        item.descriptor.name ||
                                        item.descriptor.path ||
                                        item.descriptor.id }), item.descriptor.path && (_jsx("p", { className: "text-muted-foreground truncate", children: item.descriptor.path })), item.includeSubitems && (_jsx("p", { className: "text-primary mt-1 font-medium", children: "Includes subitems" }))] }, `${item.descriptor.id}-${index}`))) })] }), _jsxs("div", { className: "rounded-xl border border-gray-200 bg-white p-4", children: [_jsx("p", { className: "text-xs font-semibold tracking-wider text-gray-500 uppercase", children: "Advanced Settings" }), _jsxs("div", { className: "mt-3 grid gap-2 text-xs text-gray-700 sm:grid-cols-2", children: [_jsxs("p", { children: ["Required approvals:", " ", _jsx("span", { className: "font-semibold text-gray-900", children: requiredApprovals || "1" })] }), _jsxs("p", { children: ["Update workflow:", " ", _jsx("span", { className: "font-semibold text-gray-900", children: updateWorkflowOnCompletion ? "Yes" : "No" })] }), _jsxs("p", { children: ["Expiration:", " ", _jsx("span", { className: "font-semibold text-gray-900", children: expirationDays ? `${expirationDays} day(s)` : "None" })] }), _jsxs("p", { children: ["Secret required:", " ", _jsx("span", { className: "font-semibold text-gray-900", children: showSecretFields ? "Yes" : "No" })] })] })] }), _jsxs("div", { className: "rounded-xl border border-gray-200 bg-white p-4", children: [_jsx("p", { className: "text-xs font-semibold tracking-wider text-gray-500 uppercase", children: "Email Preview" }), _jsxs("div", { className: "mt-3 space-y-3 rounded-lg border border-gray-100 bg-gray-50 p-3", children: [_jsxs("p", { className: "text-xs text-gray-700", children: [_jsx("span", { className: "font-semibold", children: "Subject:" }), " ", emailSubject] }), _jsx("pre", { className: "text-xs leading-relaxed whitespace-pre-wrap text-gray-700", children: emailBody }), _jsx("p", { className: "text-muted-foreground text-[11px]", children: "Each reviewer receives a personalized invitation link." })] })] }), error && (_jsx("div", { className: "border-destructive/20 bg-destructive/10 text-destructive rounded-xl border p-4 text-sm font-medium shadow-sm", children: _jsxs("div", { className: "flex gap-3", children: [_jsx(AlertTriangle, { className: "h-5 w-5 shrink-0" }), _jsx("p", { children: error })] }) }))] }));
}
//# sourceMappingURL=CreateReviewConfirmStep.js.map