@parhelia/core 0.1.12554 → 0.1.12555

package/dist/editor/reviews/CreateReviewDialog.js

@@ -3,28 +3,20 @@ import { useState, useEffect, useMemo } from "react";
 import { Dialog, DialogContent } from "../../components/ui/dialog";
 import { StyledDialogTitle } from "../../components/ui/styled-dialog-title";
 import { Button } from "../../components/ui/button";
-import { Loader2, ClipboardCheck, MailCheck, CheckCircle2 } from "lucide-react";
+import { Input } from "../../components/ui/input";
+import { Label } from "../../components/ui/label";
+import { Checkbox } from "../../components/ui/checkbox";
+import { Switch } from "../../components/ui/switch";
+import { Plus, X, Loader2, ChevronRight, ChevronLeft, ChevronDown, Settings2, ClipboardCheck, AlertTriangle, } from "lucide-react";
 import { useEditContext } from "../client/editContext";
+import { Splitter } from "../ui/Splitter";
+import { SimpleIconButton } from "../ui/SimpleIconButton";
+import { LanguageSelector } from "../../components/ui/LanguageSelector";
+import { PreconfiguredReviewerSelector } from "./PreconfiguredReviewerSelector";
+import { TreeListSelector } from "../ui/TreeListSelector";
 import DialogButtons from "../ui/DialogButtons";
-import { CreateReviewDetailsStep } from "./CreateReviewDetailsStep";
-import { CreateReviewConfirmStep } from "./CreateReviewConfirmStep";
-import { CreateReviewSuccessStep } from "./CreateReviewSuccessStep";
-import { loadAiProfiles } from "../services/aiService";
-import { awaitAgentResponse, closeAgent, startAgent, } from "../services/agentService";
-const REVIEW_TITLE_SUGGESTION_TIMEOUT_MS = 12000;
-function withTimeout(promise, timeoutMs, timeoutMessage) {
-    let timeoutId = null;
-    const timeoutPromise = new Promise((_, reject) => {
-        timeoutId = setTimeout(() => reject(new Error(timeoutMessage)), timeoutMs);
-    });
-    return Promise.race([promise, timeoutPromise]).finally(() => {
-        if (timeoutId)
-            clearTimeout(timeoutId);
-    });
-}
 export function CreateReviewDialog({ open, onOpenChange, onCreated, initialItems, }) {
     const editContext = useEditContext();
-    const [step, setStep] = useState("details");
     const [title, setTitle] = useState("");
     const [language, setLanguage] = useState(editContext?.currentItemDescriptor?.language || "en");
     const [languageMode, setLanguageMode] = useState("single");
@@ -46,14 +38,9 @@ export function CreateReviewDialog({ open, onOpenChange, onCreated, initialItems
     const [showSecretFields, setShowSecretFields] = useState(false);
     const [requiredApprovals, setRequiredApprovals] = useState("1");
     const [updateWorkflowOnCompletion, setUpdateWorkflowOnCompletion] = useState(false);
-    const [shareCommentsAndSuggestions, setShareCommentsAndSuggestions] = useState(false);
     const [selectedInTree, setSelectedInTree] = useState([]);
     const [selectedFromList, setSelectedFromList] = useState([]);
     const [advancedSettingsOpen, setAdvancedSettingsOpen] = useState(false);
-    const [createdReviewId, setCreatedReviewId] = useState(null);
-    const [sentInvitationCount, setSentInvitationCount] = useState(0);
-    const [sentInvitationEmails, setSentInvitationEmails] = useState([]);
-    const [isGeneratingTitle, setIsGeneratingTitle] = useState(false);
     const CONTENT_ROOT_ID = "0de95ae4-41ab-4d01-9eb0-67441b7c2450"; // /sitecore/content
     // Memoize rootItemIds to prevent unnecessary re-renders of ContentTree
     const rootItemIds = useMemo(() => [CONTENT_ROOT_ID], []);
@@ -103,10 +90,8 @@ export function CreateReviewDialog({ open, onOpenChange, onCreated, initialItems
             // This prevents resetting user changes (like includeSubitems toggles) when context changes
             const initializeItems = async () => {
                 let currentDescriptor = editContext.currentItemDescriptor;
-                // If the descriptor is missing name, display name, or path, fetch it from the server
-                if ((!currentDescriptor.name ||
-                    !currentDescriptor.displayName ||
-                    !currentDescriptor.path) &&
+                // If the descriptor is missing name or path, fetch it from the server
+                if ((!currentDescriptor.name || !currentDescriptor.path) &&
                     editContext.itemsRepository) {
                     try {
                         const stubs = await editContext.itemsRepository.getItemsStubs([
@@ -116,7 +101,6 @@ export function CreateReviewDialog({ open, onOpenChange, onCreated, initialItems
                             currentDescriptor = {
                                 ...currentDescriptor,
                                 name: stubs[0].name || currentDescriptor.name,
-                                displayName: stubs[0].displayName || currentDescriptor.displayName,
                                 path: stubs[0].path || currentDescriptor.path,
                             };
                         }
@@ -127,8 +111,8 @@ export function CreateReviewDialog({ open, onOpenChange, onCreated, initialItems
                 }
                 let itemsToSet;
                 if (initialItems) {
-                    // Fetch missing names/display names/paths for initial items as well
-                    const itemsToFetch = initialItems.filter((i) => !i.name || !i.displayName || !i.path);
+                    // Fetch missing names/paths for initial items as well
+                    const itemsToFetch = initialItems.filter((i) => !i.name || !i.path);
                     if (itemsToFetch.length > 0 && editContext.itemsRepository) {
                         try {
                             const stubs = await editContext.itemsRepository.getItemsStubs(itemsToFetch);
@@ -139,7 +123,6 @@ export function CreateReviewDialog({ open, onOpenChange, onCreated, initialItems
                                     descriptor: {
                                         ...i,
                                         name: stub?.name || i.name,
-                                        displayName: stub?.displayName || i.displayName,
                                         path: stub?.path || i.path,
                                     },
                                     includeSubitems: false,
@@ -184,119 +167,6 @@ export function CreateReviewDialog({ open, onOpenChange, onCreated, initialItems
         const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
         return emailRegex.test(email);
     };
-    const extractReviewTitleFromAgentResponse = (content) => {
-        if (!content)
-            return "";
-        const fencedTitleMatch = content.match(/```(?:suggestion|title)\s*\n([\s\S]*?)```/i);
-        const fencedGenericMatch = content.match(/```\s*\n([\s\S]*?)```/);
-        const raw = (fencedTitleMatch?.[1] || fencedGenericMatch?.[1] || content)
-            .trim()
-            .replace(/^["']|["']$/g, "");
-        if (!raw)
-            return "";
-        return raw.split("\n")[0]?.trim() || "";
-    };
-    const buildReviewTitleSuggestionPrompt = () => {
-        const languageScope = languageMode === "all"
-            ? "all languages"
-            : languageMode === "multiple"
-                ? selectedLanguages.join(", ")
-                : language;
-        const itemNames = items
-            .slice(0, 5)
-            .map((item) => item.descriptor.displayName ||
-            item.descriptor.name ||
-            item.descriptor.path ||
-            item.descriptor.id)
-            .filter(Boolean)
-            .join(", ");
-        const reviewerNames = reviewers
-            .slice(0, 3)
-            .map((reviewer) => reviewer.name || reviewer.email)
-            .filter(Boolean)
-            .join(", ");
-        return `Generate a concise review name for a Sitecore content review.
-
-Context:
-- Language scope: ${languageScope}
-- Items: ${itemNames || "N/A"}
-- Number of reviewers: ${reviewers.length}
-- First reviewers: ${reviewerNames || "N/A"}
-- Includes subitems: ${items.some((x) => x.includeSubitems) ? "yes" : "no"}
-
-Rules:
-- Return a short, clear title (4-10 words).
-- Do not use quotes.
-- Do not include prefixes like "Review:".
-- Output ONLY the title inside a \`\`\`suggestion fenced code block.
-
-Example:
-\`\`\`suggestion
-Homepage and Navigation Content Review
-\`\`\``;
-    };
-    const generateReviewTitleSuggestion = async () => {
-        if (title.trim())
-            return null;
-        if (!editContext?.addSocketMessageListener || !editContext.sessionId) {
-            return null;
-        }
-        const newAgentId = crypto.randomUUID();
-        setIsGeneratingTitle(true);
-        try {
-            const profiles = await withTimeout(loadAiProfiles(editContext.currentItemDescriptor), REVIEW_TITLE_SUGGESTION_TIMEOUT_MS, "Timed out while loading AI profiles");
-            if (!profiles || profiles.length === 0) {
-                return null;
-            }
-            const configuredProfileId = editContext.parheliaSettings?.commentResolveProfileId;
-            const selectedProfile = profiles.find((profile) => configuredProfileId &&
-                profile.id.toLowerCase() === configuredProfileId.toLowerCase()) || profiles[0];
-            if (!selectedProfile)
-                return null;
-            await withTimeout(startAgent({
-                agentId: newAgentId,
-                message: buildReviewTitleSuggestionPrompt(),
-                sessionId: editContext.sessionId,
-                profileId: selectedProfile.id,
-                mode: "autonomous",
-                context: {
-                    items: items.map((item) => ({
-                        id: item.descriptor.id,
-                        language: item.descriptor.language,
-                        version: item.descriptor.version,
-                        name: item.descriptor.name,
-                        path: item.descriptor.path,
-                    })),
-                    additionalData: {
-                        intent: "review-title-suggestion",
-                        reviewerCount: reviewers.length,
-                    },
-                },
-            }), REVIEW_TITLE_SUGGESTION_TIMEOUT_MS, "Timed out while starting title suggestion agent");
-            const result = await awaitAgentResponse({
-                agentId: newAgentId,
-                addSocketMessageListener: editContext.addSocketMessageListener,
-                timeout: REVIEW_TITLE_SUGGESTION_TIMEOUT_MS,
-            });
-            if (!result.success)
-                return null;
-            const extractedTitle = extractReviewTitleFromAgentResponse(result.content);
-            return extractedTitle || null;
-        }
-        catch (err) {
-            console.error("Failed to generate review title suggestion:", err);
-            return null;
-        }
-        finally {
-            setIsGeneratingTitle(false);
-            try {
-                await closeAgent(newAgentId);
-            }
-            catch (err) {
-                console.error("Failed to close review title suggestion agent:", err);
-            }
-        }
-    };
     const emailAlreadyExists = (email) => {
         return reviewers.some((r) => r.email.toLowerCase() === email.toLowerCase());
     };
@@ -328,85 +198,40 @@ Homepage and Navigation Content Review
     const removeItem = (index) => {
         setItems(items.filter((_, i) => i !== index));
     };
-    const resetDialogState = () => {
-        setStep("details");
-        setTitle("");
-        setReviewers([]);
-        setItems([]);
-        setExpirationDays("");
-        setSecret("");
-        setSecretConfirm("");
-        setShowSecretFields(false);
-        setRequiredApprovals("1");
-        setUpdateWorkflowOnCompletion(false);
-        setShareCommentsAndSuggestions(false);
-        setShowErrors(false);
+    const handleCreate = async () => {
+        setShowErrors(true);
         setError(null);
-        setLanguageMode("single");
-        setSelectedLanguages([
-            editContext?.currentItemDescriptor?.language || "en",
-        ]);
-        setLanguage(editContext?.currentItemDescriptor?.language || "en");
-        setAdvancedSettingsOpen(false);
-        setSelectedInTree([]);
-        setSelectedFromList([]);
-        setNewReviewer({ name: "", email: "" });
-        setCreatedReviewId(null);
-        setSentInvitationCount(0);
-        setSentInvitationEmails([]);
-        setIsGeneratingTitle(false);
-    };
-    const validateForm = () => {
         if (items.length === 0) {
-            return "Please select at least one page/item";
+            setError("Please select at least one page/item");
+            return;
         }
         if (reviewers.length === 0) {
-            return "Please add at least one reviewer";
+            setError("Please add at least one reviewer");
+            return;
         }
+        // Validate language selection based on mode
         if (languageMode === "single" && !language) {
-            return "Language is required";
+            setError("Language is required");
+            return;
         }
         if (languageMode === "multiple" && selectedLanguages.length === 0) {
-            return "Please select at least one language";
+            setError("Please select at least one language");
+            return;
         }
         if (showSecretFields && secret !== secretConfirm) {
-            return "Secrets do not match";
+            setError("Secrets do not match");
+            return;
         }
+        // Validate RequiredApprovals
         const requiredApprovalsNum = requiredApprovals
             ? parseInt(requiredApprovals, 10)
             : 1;
         if (isNaN(requiredApprovalsNum) || requiredApprovalsNum < 1) {
-            return "Required Approvals must be at least 1";
-        }
-        if (requiredApprovalsNum > reviewers.length) {
-            return `Required Approvals (${requiredApprovalsNum}) cannot exceed the number of reviewers (${reviewers.length})`;
-        }
-        return null;
-    };
-    const handleProceedToConfirm = async () => {
-        setShowErrors(true);
-        setError(null);
-        const validationError = validateForm();
-        if (validationError) {
-            setError(validationError);
+            setError("Required Approvals must be at least 1");
             return;
         }
-        setStep("confirm");
-        if (!title.trim()) {
-            void (async () => {
-                const suggestedTitle = await generateReviewTitleSuggestion();
-                if (suggestedTitle) {
-                    setTitle((currentTitle) => currentTitle.trim() ? currentTitle : suggestedTitle);
-                }
-            })();
-        }
-    };
-    const handleCreate = async () => {
-        setShowErrors(true);
-        setError(null);
-        const validationError = validateForm();
-        if (validationError) {
-            setError(validationError);
+        if (requiredApprovalsNum > reviewers.length) {
+            setError(`Required Approvals (${requiredApprovalsNum}) cannot exceed the number of reviewers (${reviewers.length})`);
             return;
         }
         setLoading(true);
@@ -429,13 +254,12 @@ Homepage and Navigation Content Review
                 languages = selectedLanguages;
             }
             else {
+                // Single language mode - use legacy language field for backward compatibility
                 languages = [language];
             }
-            const requiredApprovalsNum = requiredApprovals
-                ? parseInt(requiredApprovals, 10)
-                : 1;
             const request = {
                 title: title || undefined,
+                language: languageMode === "single" ? language : undefined, // Keep for backward compatibility
                 languages,
                 reviewers,
                 items,
@@ -443,44 +267,38 @@ Homepage and Navigation Content Review
                 secret: showSecretFields && secret ? secret : undefined,
                 requiredApprovals: requiredApprovalsNum,
                 updateWorkflowOnCompletion: updateWorkflowOnCompletion,
-                shareCommentsAndSuggestions: shareCommentsAndSuggestions,
             };
             const { createReview, getReviewStatus, sendInvitations } = await import("../services/reviewsService");
             const result = await createReview(request);
             if (result.data?.reviewId) {
-                setCreatedReviewId(result.data.reviewId);
                 // Get assignments to send invitations
                 const statusResult = await getReviewStatus(result.data.reviewId);
                 if (statusResult.data?.assignments) {
-                    const assignmentsToInvite = statusResult.data.assignments.filter((a) => !a.invitationSentDate);
-                    const assignmentIds = assignmentsToInvite.map((a) => a.assignmentId);
-                    const reviewerEmails = Array.from(new Set(assignmentsToInvite.map((a) => a.reviewerEmail)));
+                    const assignmentIds = statusResult.data.assignments
+                        .filter((a) => !a.invitationSentDate)
+                        .map((a) => a.assignmentId);
                     if (assignmentIds.length > 0) {
-                        const invitationResult = await sendInvitations(assignmentIds);
-                        if (invitationResult.type !== "success") {
-                            throw new Error(invitationResult.details ||
-                                invitationResult.summary ||
-                                "Failed to send invitation emails");
-                        }
-                        if (invitationResult.data &&
-                            typeof invitationResult.data === "object" &&
-                            "errors" in invitationResult.data &&
-                            Array.isArray(invitationResult.data.errors) &&
-                            invitationResult.data.errors.length > 0) {
-                            const errorMessages = invitationResult.data.errors
-                                .map((err) => err?.message || String(err))
-                                .join("; ");
-                            throw new Error(errorMessages || "Failed to send invitation emails");
-                        }
+                        await sendInvitations(assignmentIds);
                     }
-                    setSentInvitationCount(assignmentIds.length);
-                    setSentInvitationEmails(reviewerEmails);
-                }
-                else {
-                    setSentInvitationCount(0);
-                    setSentInvitationEmails([]);
                 }
-                setStep("success");
+                onCreated(result.data.reviewId);
+                // Reset form
+                setTitle("");
+                setReviewers([]);
+                setItems([]);
+                setExpirationDays("");
+                setSecret("");
+                setSecretConfirm("");
+                setShowSecretFields(false);
+                setRequiredApprovals("1");
+                setUpdateWorkflowOnCompletion(false);
+                setShowErrors(false);
+                setLanguageMode("single");
+                setSelectedLanguages([
+                    editContext?.currentItemDescriptor?.language || "en",
+                ]);
+                setLanguage(editContext?.currentItemDescriptor?.language || "en");
+                onOpenChange(false);
             }
             else {
                 setError("Failed to create review");
@@ -493,12 +311,11 @@ Homepage and Navigation Content Review
             setLoading(false);
         }
     };
-    const addToList = async (itemsToAdd) => {
+    const addToList = async () => {
         const newItems = [...items];
-        const sourceItems = itemsToAdd ?? selectedInTree;
-        const nodesToAdd = sourceItems.filter((node) => !newItems.some((x) => x.descriptor.id === node.id));
-        // Fetch missing paths/names/display names if needed
-        const nodesNeedingFetch = nodesToAdd.filter((node) => !node.path || !node.name || !node.displayName);
+        const nodesToAdd = selectedInTree.filter((node) => !newItems.some((x) => x.descriptor.id === node.id));
+        // Fetch missing paths/names if needed
+        const nodesNeedingFetch = nodesToAdd.filter((node) => !node.path || !node.name);
         if (nodesNeedingFetch.length > 0 && editContext?.itemsRepository) {
             try {
                 const descriptorsToFetch = nodesNeedingFetch.map((node) => ({
@@ -516,7 +333,6 @@ Homepage and Navigation Content Review
                             language: node.language || language,
                             version: node.version || 1,
                             name: stub?.name || node.name || "",
-                            displayName: stub?.displayName || node.displayName || "",
                             path: stub?.path || node.path || node.idPath || "",
                         },
                         includeSubitems: false,
@@ -533,7 +349,6 @@ Homepage and Navigation Content Review
                             language: node.language || language,
                             version: node.version || 1,
                             name: node.name || "",
-                            displayName: node.displayName || "",
                             path: node.path || node.idPath || "",
                         },
                         includeSubitems: false,
@@ -550,7 +365,6 @@ Homepage and Navigation Content Review
                         language: node.language || language,
                         version: node.version || 1,
                         name: node.name || "",
-                        displayName: node.displayName || "",
                         path: node.path || node.idPath || "",
                     },
                     includeSubitems: false,
@@ -573,12 +387,10 @@ Homepage and Navigation Content Review
                 language: item.language || language,
                 version: item.version || 1,
                 name: item.name || "",
-                displayName: item.displayName || "",
                 path: item.path || item.idPath || "",
             };
-            // Fetch missing path/name/display name if needed
-            if ((!item.path || !item.name || !item.displayName) &&
-                editContext?.itemsRepository) {
+            // Fetch missing path/name if needed
+            if ((!item.path || !item.name) && editContext?.itemsRepository) {
                 try {
                     const stubs = await editContext.itemsRepository.getItemsStubs([
                         {
@@ -591,7 +403,6 @@ Homepage and Navigation Content Review
                         itemDescriptor = {
                             ...itemDescriptor,
                             name: stubs[0].name || itemDescriptor.name || "",
-                            displayName: stubs[0].displayName || itemDescriptor.displayName || "",
                             path: stubs[0].path || itemDescriptor.path || "",
                         };
                     }
@@ -609,36 +420,121 @@ Homepage and Navigation Content Review
             ]);
         }
     };
-    const handleDialogCancel = () => {
-        if (loading)
-            return;
-        resetDialogState();
-        onOpenChange(false);
-    };
-    const handleDialogOpenChange = (nextOpen) => {
-        if (!nextOpen) {
-            handleDialogCancel();
-            return;
-        }
-        onOpenChange(nextOpen);
-    };
-    const handleDone = () => {
-        const reviewId = createdReviewId;
-        resetDialogState();
-        onCreated(reviewId);
-    };
-    const languageSummary = languageMode === "all"
-        ? "All languages"
-        : languageMode === "multiple"
-            ? `${selectedLanguages.length} selected (${selectedLanguages.join(", ")})`
-            : language;
-    return (_jsx(Dialog, { open: open, onOpenChange: handleDialogOpenChange, children: _jsxs(DialogContent, { className: "flex max-w-5xl overflow-hidden border-none p-0 shadow-2xl", style: { height: "90vh", maxHeight: "90vh" }, children: [_jsx(StyledDialogTitle, { icon: step === "success" ? (_jsx(CheckCircle2, { strokeWidth: 1 })) : step === "confirm" ? (_jsx(MailCheck, { strokeWidth: 1 })) : (_jsx(ClipboardCheck, { strokeWidth: 1 })), title: step === "success"
-                        ? "Review Created"
-                        : step === "confirm"
-                            ? "Confirm Review"
-                            : "Create Review" }), _jsxs("div", { className: "flex min-h-0 flex-1 flex-col overflow-hidden", children: [_jsxs("div", { className: "flex min-h-0 flex-1 flex-col overflow-y-auto px-6 pb-4", children: [step === "details" && (_jsx(CreateReviewDetailsStep, { items: items, setItems: setItems, showErrors: showErrors, language: language, setLanguage: setLanguage, rootItemIds: rootItemIds, selectedInTree: selectedInTree, setSelectedInTree: setSelectedInTree, selectedFromList: selectedFromList, setSelectedFromList: setSelectedFromList, addToList: addToList, removeFromList: removeFromList, handleAddItem: handleAddItem, removeItem: removeItem, toggleSubitems: toggleSubitems, reviewers: reviewers, setReviewers: setReviewers, newReviewer: newReviewer, setNewReviewer: setNewReviewer, addReviewer: addReviewer, removeReviewer: removeReviewer, isValidEmail: isValidEmail, emailAlreadyExists: emailAlreadyExists, itemIds: itemIds, languageMode: languageMode, setLanguageMode: setLanguageMode, selectedLanguages: selectedLanguages, setSelectedLanguages: setSelectedLanguages, itemLanguages: editContext?.itemLanguages || [], advancedSettingsOpen: advancedSettingsOpen, setAdvancedSettingsOpen: setAdvancedSettingsOpen, requiredApprovals: requiredApprovals, setRequiredApprovals: setRequiredApprovals, updateWorkflowOnCompletion: updateWorkflowOnCompletion, setUpdateWorkflowOnCompletion: setUpdateWorkflowOnCompletion, shareCommentsAndSuggestions: shareCommentsAndSuggestions, setShareCommentsAndSuggestions: setShareCommentsAndSuggestions, expirationDays: expirationDays, setExpirationDays: setExpirationDays, showSecretFields: showSecretFields, setShowSecretFields: setShowSecretFields, secret: secret, setSecret: setSecret, secretConfirm: secretConfirm, setSecretConfirm: setSecretConfirm, error: error })), step === "confirm" && (_jsx(CreateReviewConfirmStep, { title: title, setTitle: setTitle, isGeneratingTitle: isGeneratingTitle, languageSummary: languageSummary, reviewers: reviewers, items: items, requiredApprovals: requiredApprovals, updateWorkflowOnCompletion: updateWorkflowOnCompletion, expirationDays: expirationDays, showSecretFields: showSecretFields, error: error })), step === "success" && (_jsx(CreateReviewSuccessStep, { sentInvitationCount: sentInvitationCount, sentInvitationEmails: sentInvitationEmails }))] }), _jsxs(DialogButtons, { hideBorder: true, className: "bg-gray-50/50", children: [step === "details" && (_jsxs(_Fragment, { children: [_jsx(Button, { variant: "ghost", onClick: handleDialogCancel, children: "Cancel" }), _jsx(Button, { "data-testid": "create-review-submit-button", onClick: handleProceedToConfirm, disabled: loading || !isFormValid, className: "min-w-[140px] shadow-sm", children: "Continue" })] })), step === "confirm" && (_jsxs(_Fragment, { children: [_jsx(Button, { variant: "ghost", onClick: () => {
-                                                setError(null);
-                                                setStep("details");
-                                            }, disabled: loading, children: "Back" }), _jsx(Button, { "data-testid": "create-review-submit-button", onClick: handleCreate, disabled: loading, className: "min-w-[160px] shadow-sm", children: loading ? (_jsxs(_Fragment, { children: [_jsx(Loader2, { className: "mr-2 h-4 w-4 animate-spin" }), "Creating..."] })) : ("Create & Send Emails") })] })), step === "success" && (_jsx(Button, { onClick: handleDone, className: "min-w-[120px] shadow-sm", children: "Done" }))] })] })] }) }));
+    return (_jsx(Dialog, { open: open, onOpenChange: onOpenChange, children: _jsxs(DialogContent, { className: "flex max-w-5xl overflow-hidden border-none p-0 shadow-2xl", style: { height: "90vh", maxHeight: "90vh" }, children: [_jsx(StyledDialogTitle, { icon: _jsx(ClipboardCheck, { strokeWidth: 1 }), title: "Create Review" }), _jsxs("div", { className: "flex min-h-0 flex-1 flex-col overflow-hidden", children: [_jsx("div", { className: "flex min-h-0 flex-1 flex-col overflow-y-auto px-6 pb-4", children: _jsxs("div", { className: "flex flex-col gap-6 pt-6", children: [_jsxs("div", { className: "flex flex-col gap-3", children: [_jsxs("label", { htmlFor: "title", className: "text-sm font-semibold text-gray-900", children: ["Review Name", _jsx("span", { className: "text-muted-foreground ml-1 text-xs 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: "max-w-md bg-white" })] }), _jsx("div", { className: "border-t border-gray-100" }), _jsxs("div", { className: "flex flex-col gap-3", children: [_jsxs("div", { className: "flex items-center justify-between", children: [_jsx("label", { className: "text-sm font-semibold text-gray-900", children: "Pages & Items" }), _jsxs("span", { className: "bg-primary/10 text-primary rounded-full px-2.5 py-0.5 text-xs font-semibold", children: [items.length, " selected"] })] }), _jsx("p", { className: "text-muted-foreground text-xs", children: "Select the content items to include in this review. Double-click to add items quickly." }), _jsx("div", { className: "overflow-hidden rounded-xl border border-gray-200 bg-white shadow-sm", style: { height: "340px" }, children: _jsx(Splitter, { className: "h-full", direction: "horizontal", localStorageKey: "create-review-dialog-splitter", panels: [
+                                                        {
+                                                            name: "treeSelector",
+                                                            defaultSize: 50,
+                                                            content: (_jsx(TreeListSelector, { language: language, rootItemIds: rootItemIds, selectedItemIds: selectedInTree.map((item) => item.id), onSelectionChange: setSelectedInTree, onDoubleClick: handleAddItem, onItemSelected: handleAddItem })),
+                                                        },
+                                                        {
+                                                            name: "selectedItems",
+                                                            defaultSize: 50,
+                                                            content: (_jsxs("div", { className: "flex h-full min-h-0 flex-col overflow-hidden bg-gray-50/30", children: [_jsx("div", { className: "flex h-[37px] flex-shrink-0 items-center border-b border-gray-100 bg-gray-50/50 px-3", children: _jsx("span", { className: "text-xs font-semibold tracking-wider text-gray-600 uppercase", children: "Selected Items" }) }), items.length > 0 ? (_jsx("div", { className: "min-h-0 flex-1 space-y-2 overflow-y-auto p-3", children: items.map((item, index) => (_jsxs("div", { className: `group flex cursor-pointer flex-col gap-2 rounded-lg border p-3 transition-all ${selectedFromList.includes(item)
+                                                                                ? "border-primary/30 bg-primary/5 ring-primary/20 ring-1"
+                                                                                : "hover:border-primary/20 border-gray-200 bg-white hover:shadow-sm"}`, onClick: (e) => {
+                                                                                if (e.ctrlKey || e.metaKey) {
+                                                                                    if (selectedFromList.includes(item)) {
+                                                                                        setSelectedFromList(selectedFromList.filter((i) => i !== item));
+                                                                                    }
+                                                                                    else {
+                                                                                        setSelectedFromList([
+                                                                                            ...selectedFromList,
+                                                                                            item,
+                                                                                        ]);
+                                                                                    }
+                                                                                }
+                                                                                else {
+                                                                                    if (selectedFromList.length === 1 &&
+                                                                                        selectedFromList.includes(item)) {
+                                                                                        setSelectedFromList([]);
+                                                                                    }
+                                                                                    else {
+                                                                                        setSelectedFromList([item]);
+                                                                                    }
+                                                                                }
+                                                                            }, onDoubleClick: () => {
+                                                                                setItems(items.filter((_, i) => i !== index));
+                                                                                setSelectedFromList([]);
+                                                                            }, children: [_jsxs("div", { className: "flex items-start justify-between gap-2", children: [_jsxs("div", { className: "flex min-w-0 flex-1 flex-col", children: [_jsx("span", { className: "truncate text-sm font-semibold text-gray-900", children: item.descriptor.name ||
+                                                                                                        item.descriptor.path ||
+                                                                                                        item.descriptor.id }), item.descriptor.path && (_jsx("span", { className: "text-muted-foreground truncate text-[11px]", title: item.descriptor.path, children: item.descriptor.path })), _jsxs("div", { className: "mt-1 flex items-center gap-1.5", children: [_jsx("span", { className: "rounded bg-gray-100 px-1.5 py-0.5 text-[10px] font-medium text-gray-600 uppercase", children: item.descriptor.language }), _jsxs("span", { className: "text-muted-foreground text-[10px] font-medium", children: ["v", item.descriptor.version] })] })] }), _jsx(Button, { variant: "ghost", size: "sm", className: "text-muted-foreground hover:bg-destructive/10 hover:text-destructive h-7 w-7 shrink-0 p-0 opacity-0 transition-all group-hover:opacity-100", onClick: (e) => {
+                                                                                                e.stopPropagation();
+                                                                                                removeItem(index);
+                                                                                            }, children: _jsx(X, { className: "h-4 w-4" }) })] }), _jsxs("div", { className: "flex items-center gap-2 border-t border-gray-100/50 pt-2", children: [_jsx(Switch, { id: `subpages-${item.descriptor.id}-${index}`, checked: item.includeSubitems, onCheckedChange: () => toggleSubitems(index), onClick: (e) => e.stopPropagation(), className: "scale-75" }), _jsx(Label, { htmlFor: `subpages-${item.descriptor.id}-${index}`, className: "cursor-pointer text-[11px] font-medium text-gray-500", onClick: (e) => e.stopPropagation(), children: "Include subitems" })] })] }, `${item.descriptor.id}-${index}`))) })) : (_jsxs("div", { className: "flex min-h-0 flex-1 flex-col items-center justify-center gap-3 p-8 text-center", children: [_jsx("div", { className: "rounded-full bg-gray-100/50 p-4 ring-8 ring-gray-50", children: _jsx(ClipboardCheck, { className: "h-6 w-6 text-gray-300", strokeWidth: 1 }) }), _jsxs("div", { className: "space-y-1", children: [_jsx("p", { className: "text-sm font-medium text-gray-500", children: "No items selected" }), _jsx("p", { className: "text-muted-foreground text-xs", children: "Browse or search to add items" })] })] }))] })),
+                                                        },
+                                                    ], handleContent: (index) => index === 0 ? (_jsxs("div", { className: "flex flex-col items-center gap-1 rounded bg-gray-100 py-1", children: [_jsx(SimpleIconButton, { label: "Add", icon: _jsx(ChevronRight, { size: 14, strokeWidth: 1 }), onClick: addToList, disabled: selectedInTree.length === 0, showTooltip: false, className: "px-0" }), _jsx(SimpleIconButton, { label: "Remove", icon: _jsx(ChevronLeft, { size: 14, strokeWidth: 1 }), onClick: removeFromList, disabled: selectedFromList.length === 0, showTooltip: false, className: "px-0" })] })) : null }) }), showErrors && items.length === 0 && (_jsx("p", { className: "text-destructive text-xs font-medium", children: "Please select at least one page or item" }))] }), _jsx("div", { className: "border-t border-gray-100" }), _jsxs("div", { className: "flex flex-col gap-3", children: [_jsxs("div", { className: "flex items-center justify-between", children: [_jsx("label", { className: "text-sm font-semibold text-gray-900", children: "Reviewers" }), reviewers.length > 0 && (_jsxs("span", { className: "bg-primary/10 text-primary rounded-full px-2.5 py-0.5 text-xs font-semibold", children: [reviewers.length, " added"] }))] }), _jsx("p", { className: "text-muted-foreground text-xs", children: "Add people who will review and approve the content." }), reviewers.length > 0 && (_jsx("div", { className: "flex flex-wrap gap-2.5", children: reviewers.map((reviewer, index) => (_jsxs("div", { className: "group hover:border-primary/30 flex items-center gap-2.5 rounded-full border border-gray-200 bg-white py-1.5 pr-2 pl-3.5 transition-all hover:shadow-sm", children: [_jsx("div", { className: "bg-primary/10 text-primary ring-primary/5 flex h-6 w-6 items-center justify-center rounded-full text-[10px] font-bold ring-2", children: reviewer.name.charAt(0).toUpperCase() }), _jsxs("div", { className: "flex flex-col", children: [_jsx("span", { className: "text-xs leading-none font-semibold text-gray-900", children: reviewer.name }), _jsx("span", { className: "text-muted-foreground mt-1 text-[10px] leading-none", children: reviewer.email })] }), _jsx(Button, { variant: "ghost", size: "sm", className: "text-muted-foreground hover:bg-destructive/10 hover:text-destructive h-6 w-6 rounded-full p-0 opacity-50 transition-all hover:opacity-100", onClick: () => removeReviewer(index), children: _jsx(X, { className: "h-3.5 w-3.5" }) })] }, index))) })), _jsxs("div", { className: "flex flex-col gap-4 rounded-xl border border-gray-200 bg-gray-50/50 p-5 shadow-inner", children: [items.length > 0 && (_jsx(PreconfiguredReviewerSelector, { itemIds: itemIds, language: language, onReviewerSelected: (reviewer) => {
+                                                            const exists = reviewers.some((r) => r.email.toLowerCase() ===
+                                                                reviewer.email.toLowerCase());
+                                                            if (!exists) {
+                                                                setReviewers([...reviewers, reviewer]);
+                                                            }
+                                                        }, existingReviewers: reviewers })), _jsxs("div", { className: "flex flex-col gap-2.5", children: [_jsx("label", { className: "text-[11px] font-bold tracking-wider text-gray-500 uppercase", children: "Add new reviewer" }), _jsxs("div", { className: "flex items-start gap-3", children: [_jsx("div", { className: "flex flex-1 flex-col gap-1", children: _jsx(Input, { "data-testid": "reviewer-name-input", placeholder: "Full Name", value: newReviewer.name, onChange: (e) => setNewReviewer({
+                                                                                ...newReviewer,
+                                                                                name: e.target.value,
+                                                                            }), onKeyDown: (e) => {
+                                                                                if (e.key === "Enter") {
+                                                                                    e.preventDefault();
+                                                                                    addReviewer();
+                                                                                }
+                                                                            }, className: "bg-white" }) }), _jsxs("div", { className: "flex flex-1 flex-col gap-1", children: [_jsx(Input, { "data-testid": "reviewer-email-input", placeholder: "Email address", value: newReviewer.email, onChange: (e) => setNewReviewer({
+                                                                                    ...newReviewer,
+                                                                                    email: e.target.value,
+                                                                                }), onKeyDown: (e) => {
+                                                                                    if (e.key === "Enter") {
+                                                                                        e.preventDefault();
+                                                                                        addReviewer();
+                                                                                    }
+                                                                                }, className: `bg-white ${newReviewer.email &&
+                                                                                    !isValidEmail(newReviewer.email)
+                                                                                    ? "border-destructive/30 focus:border-destructive"
+                                                                                    : ""}` }), newReviewer.email &&
+                                                                                !isValidEmail(newReviewer.email) && (_jsx("span", { className: "text-destructive text-[10px] font-medium", children: "Invalid email address" })), newReviewer.email &&
+                                                                                emailAlreadyExists(newReviewer.email) && (_jsx("span", { className: "text-destructive text-[10px] font-medium", children: "Reviewer already added" }))] }), _jsxs(Button, { onClick: addReviewer, size: "sm", "aria-label": "Add Reviewer", "data-testid": "add-reviewer-button", className: "h-9 shrink-0 px-3", children: [_jsx(Plus, { className: "mr-1.5 h-3.5 w-3.5" }), "Add"] })] })] })] }), showErrors && reviewers.length === 0 && (_jsx("p", { className: "text-destructive text-xs font-medium", children: "Please add at least one reviewer to create this review" }))] }), _jsx("div", { className: "border-t border-gray-100" }), _jsxs("div", { className: "flex flex-col gap-3", children: [_jsx("label", { className: "text-sm font-semibold text-gray-900", children: "Language" }), _jsx("p", { className: "text-muted-foreground text-xs", children: "Choose which language versions to include in the review." }), _jsxs("div", { className: "flex flex-col gap-4", children: [_jsxs("div", { className: "flex flex-wrap gap-6", children: [_jsxs("label", { className: "flex cursor-pointer items-center gap-2", children: [_jsx("input", { type: "radio", name: "languageMode", "data-testid": "language-mode-single", checked: languageMode === "single", onChange: () => {
+                                                                            setLanguageMode("single");
+                                                                            setLanguage(selectedLanguages[0] || language);
+                                                                        }, className: "accent-primary h-4 w-4 cursor-pointer" }), _jsx("span", { className: "text-xs text-gray-700", children: "Single Language" })] }), _jsxs("label", { className: "flex cursor-pointer items-center gap-2", children: [_jsx("input", { type: "radio", name: "languageMode", "data-testid": "language-mode-multiple", checked: languageMode === "multiple", onChange: () => setLanguageMode("multiple"), className: "accent-primary h-4 w-4 cursor-pointer" }), _jsx("span", { className: "text-xs text-gray-700", children: "Multiple Languages" })] }), _jsxs("label", { className: "flex cursor-pointer items-center gap-2", children: [_jsx("input", { type: "radio", name: "languageMode", "data-testid": "language-mode-all", checked: languageMode === "all", onChange: () => setLanguageMode("all"), className: "accent-primary h-4 w-4 cursor-pointer" }), _jsx("span", { className: "text-xs text-gray-700", children: "All Languages" })] })] }), languageMode === "single" && (_jsx("div", { className: "max-w-xs", children: _jsx(LanguageSelector, { selectedLanguage: language, onLanguageSelected: (lang) => {
+                                                                setLanguage(lang.languageCode);
+                                                                setSelectedLanguages([lang.languageCode]);
+                                                            }, showAllLanguages: true }) })), languageMode === "multiple" && (_jsxs("div", { className: "flex max-h-56 flex-col gap-3 overflow-hidden rounded-xl border border-gray-200 bg-white p-4 shadow-sm", children: [_jsxs("div", { className: "flex items-center justify-between border-b border-gray-100 pb-3", children: [_jsx("span", { className: "text-[11px] font-bold tracking-wider text-gray-500 uppercase", children: "Select Languages" }), _jsxs("div", { className: "flex gap-2", children: [_jsx(Button, { type: "button", variant: "ghost", size: "sm", onClick: () => {
+                                                                                    const allLangs = editContext?.itemLanguages || [];
+                                                                                    setSelectedLanguages(allLangs.map((l) => l.languageCode));
+                                                                                }, className: "text-primary hover:bg-primary/5 h-7 px-2 text-xs", children: "Select All" }), _jsx(Button, { type: "button", variant: "ghost", size: "sm", onClick: () => setSelectedLanguages([]), className: "h-7 px-2 text-xs text-gray-500 hover:bg-gray-100", children: "Clear" })] })] }), _jsx("div", { className: "grid grid-cols-2 gap-2 overflow-y-auto pr-2", children: (editContext?.itemLanguages || []).map((lang) => (_jsxs("label", { className: "flex cursor-pointer items-center gap-3 rounded-md p-2 transition-all hover:bg-gray-50", children: [_jsx(Checkbox, { checked: selectedLanguages.includes(lang.languageCode), onCheckedChange: (checked) => {
+                                                                                if (checked) {
+                                                                                    setSelectedLanguages([
+                                                                                        ...selectedLanguages,
+                                                                                        lang.languageCode,
+                                                                                    ]);
+                                                                                }
+                                                                                else {
+                                                                                    setSelectedLanguages(selectedLanguages.filter((l) => l !== lang.languageCode));
+                                                                                }
+                                                                            } }), _jsx("img", { src: lang.icon, className: "h-4 w-4 rounded-sm", alt: lang.name }), _jsx("span", { className: "text-xs font-medium text-gray-700", children: lang.name })] }, lang.languageCode))) }), showErrors && selectedLanguages.length === 0 && (_jsx("p", { className: "text-destructive mt-1 text-center text-xs font-medium", children: "Please select at least one language" }))] })), languageMode === "all" && (_jsx("div", { className: "rounded-lg border border-blue-100 bg-blue-50 p-4 text-sm leading-relaxed font-medium text-blue-700", children: "All available languages will be included in this review. Reviewers will see versions for every language the item exists in." }))] })] }), _jsx("div", { className: "border-t border-gray-100" }), _jsxs("div", { className: "mb-4 flex flex-col", children: [_jsxs("button", { type: "button", "data-testid": "advanced-settings-button", onClick: () => setAdvancedSettingsOpen(!advancedSettingsOpen), className: "flex w-full items-center justify-between rounded-xl border border-gray-200 bg-gray-50/50 px-5 py-4 text-left transition-all hover:bg-gray-100/80 hover:shadow-sm", children: [_jsxs("div", { className: "flex items-center gap-3", children: [_jsx("div", { className: "rounded-lg border border-gray-100 bg-white p-2 shadow-sm", children: _jsx(Settings2, { className: "text-primary h-4 w-4" }) }), _jsxs("div", { className: "flex flex-col", children: [_jsx("span", { className: "text-sm leading-tight font-semibold text-gray-900", children: "Advanced Settings" }), _jsx("span", { className: "text-muted-foreground mt-0.5 text-[11px]", children: "Expiration, approvals, security" })] })] }), _jsx(ChevronDown, { className: `h-5 w-5 text-gray-400 transition-transform duration-300 ${advancedSettingsOpen ? "rotate-180" : ""}` })] }), advancedSettingsOpen && (_jsxs("div", { className: "mt-4 flex flex-col gap-6 rounded-xl border border-gray-200 bg-white p-6 shadow-sm", children: [_jsxs("div", { className: "flex flex-col gap-3", children: [_jsx("label", { htmlFor: "requiredApprovals", className: "text-sm font-semibold text-gray-900", children: "Required Approvals" }), _jsx("p", { className: "text-muted-foreground text-xs", children: "Number of reviewers that must approve each page or item before it's considered complete." }), _jsxs("div", { className: "flex flex-col gap-2", children: [_jsxs("div", { className: "flex items-center gap-3", children: [_jsx(Input, { id: "requiredApprovals", "data-testid": "required-approvals-input", type: "number", min: "1", value: requiredApprovals, onChange: (e) => setRequiredApprovals(e.target.value), placeholder: "1", className: "w-24 bg-gray-50/50" }), _jsx("span", { className: "text-xs font-medium text-gray-400", children: "approvals needed" })] }), showErrors &&
+                                                                        reviewers.length > 0 &&
+                                                                        requiredApprovals &&
+                                                                        (() => {
+                                                                            const num = parseInt(requiredApprovals, 10);
+                                                                            if (isNaN(num) || num < 1) {
+                                                                                return (_jsx("p", { className: "text-destructive text-xs font-medium", children: "Must be at least 1" }));
+                                                                            }
+                                                                            if (num > reviewers.length) {
+                                                                                return (_jsxs("p", { className: "text-destructive text-xs font-medium", children: ["Cannot exceed number of reviewers (", reviewers.length, ")"] }));
+                                                                            }
+                                                                            return null;
+                                                                        })()] })] }), _jsx("div", { className: "border-t border-gray-100" }), _jsxs("div", { className: "flex items-start gap-4", children: [_jsx(Checkbox, { id: "updateWorkflowOnCompletion", "data-testid": "update-workflow-checkbox", checked: updateWorkflowOnCompletion, onCheckedChange: (checked) => setUpdateWorkflowOnCompletion(!!checked), className: "mt-1" }), _jsxs("div", { className: "flex flex-col gap-1", children: [_jsx(Label, { htmlFor: "updateWorkflowOnCompletion", className: "cursor-pointer text-sm leading-tight font-semibold text-gray-900", children: "Update workflow state on completion" }), _jsx("span", { className: "text-muted-foreground text-xs leading-relaxed", children: "When the review is approved by all required reviewers, automatically execute the \"Approve\" workflow action." })] })] }), _jsx("div", { className: "border-t border-gray-100" }), _jsxs("div", { className: "flex items-start gap-4", children: [_jsx(Checkbox, { id: "hasExpiration", "data-testid": "set-expiration-checkbox", checked: expirationDays !== "", onCheckedChange: (checked) => {
+                                                                    if (!checked) {
+                                                                        setExpirationDays("");
+                                                                    }
+                                                                    else {
+                                                                        setExpirationDays("30");
+                                                                    }
+                                                                }, className: "mt-1" }), _jsxs("div", { className: "flex flex-1 flex-col gap-3", children: [_jsxs("div", { className: "flex flex-col gap-1", children: [_jsx(Label, { htmlFor: "hasExpiration", className: "cursor-pointer text-sm leading-tight font-semibold text-gray-900", children: "Set expiration" }), _jsx("span", { className: "text-muted-foreground text-xs leading-relaxed", children: "Automatically close the review after a specified number of days if not completed." })] }), expirationDays !== "" && (_jsxs("div", { className: "flex items-center gap-3", children: [_jsx(Input, { type: "number", "data-testid": "expiration-days-input", min: "1", value: expirationDays, onChange: (e) => setExpirationDays(e.target.value), placeholder: "30", className: "w-24 bg-gray-50/50" }), _jsx("span", { className: "text-xs font-medium text-gray-400", children: "days remaining" })] }))] })] }), _jsx("div", { className: "border-t border-gray-100" }), _jsxs("div", { className: "flex items-start gap-4", children: [_jsx(Checkbox, { id: "hasSecret", "data-testid": "require-secret-checkbox", checked: showSecretFields, onCheckedChange: (checked) => {
+                                                                    setShowSecretFields(!!checked);
+                                                                    if (!checked) {
+                                                                        setSecret("");
+                                                                        setSecretConfirm("");
+                                                                    }
+                                                                }, className: "mt-1" }), _jsxs("div", { className: "flex flex-1 flex-col gap-3", children: [_jsxs("div", { className: "flex flex-col gap-1", children: [_jsx(Label, { htmlFor: "hasSecret", className: "cursor-pointer text-sm leading-tight font-semibold text-gray-900", children: "Require secret to unlock" }), _jsx("span", { className: "text-muted-foreground text-xs leading-relaxed", children: "Reviewers must enter a shared secret phrase before they can access and review the content." })] }), showSecretFields && (_jsxs("div", { className: "grid max-w-md grid-cols-2 gap-3", children: [_jsx(Input, { "data-testid": "secret-input", type: "password", placeholder: "Create secret phrase", value: secret, onChange: (e) => setSecret(e.target.value), autoComplete: "off", className: "bg-gray-50/50" }), _jsx(Input, { "data-testid": "secret-confirm-input", type: "password", placeholder: "Confirm secret phrase", value: secretConfirm, onChange: (e) => setSecretConfirm(e.target.value), autoComplete: "off", className: "bg-gray-50/50" }), showErrors &&
+                                                                                secret &&
+                                                                                secret !== secretConfirm && (_jsx("p", { className: "text-destructive col-span-2 text-xs font-medium", children: "Secret phrases do not match" }))] }))] })] })] }))] }), 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 })] }) }))] }) }), _jsxs(DialogButtons, { hideBorder: true, className: "bg-gray-50/50", children: [_jsx(Button, { variant: "ghost", onClick: () => onOpenChange(false), children: "Cancel" }), _jsx(Button, { "data-testid": "create-review-submit-button", onClick: handleCreate, disabled: loading || !isFormValid, className: "min-w-[140px] shadow-sm", children: loading ? (_jsxs(_Fragment, { children: [_jsx(Loader2, { className: "mr-2 h-4 w-4 animate-spin" }), "Creating..."] })) : ("Create Review") })] })] })] }) }));
 }
 //# sourceMappingURL=CreateReviewDialog.js.map