@mvriu5/payload-ai 1.1.1 → 1.2.0

package/dist/components/AIInput.js

@@ -1,5 +1,5 @@
 "use client";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { useConfig } from "@payloadcms/ui";
 import { formatAdminURL } from "payload/shared";
 import { useCallback, useEffect, useMemo, useRef, useState } from "react";
@@ -84,7 +84,7 @@ const parseSSEEvent = (chunk)=>{
     if (!eventName) return null;
     try {
         const data = JSON.parse(dataLines.join("\n"));
-        if (eventName !== "text" && eventName !== "proposals" && eventName !== "error" && eventName !== "done") {
+        if (eventName !== "text" && eventName !== "proposals" && eventName !== "error" && eventName !== "done" && eventName !== "debug") {
             return null;
         }
         return {
@@ -96,6 +96,59 @@ const parseSSEEvent = (chunk)=>{
     }
 };
 const sanitizeResponseText = (value)=>value.replace(/\*\*/g, "");
+const getDebugReasonLabel = (reason)=>{
+    switch(reason){
+        case "model_did_not_call_tool":
+            return "Model did not create a proposal tool call.";
+        case "proposal_created":
+            return "Proposal created.";
+        case "tool_validation_failed":
+            return "Tool validation failed before a proposal could be created.";
+        case "write_intent_without_tool_call":
+            return "The selected model did not produce the required proposal tool call for this content change.";
+        default:
+            return "Unknown";
+    }
+};
+const getApplyDebugReasonLabel = (reason)=>{
+    switch(reason){
+        case "unauthorized":
+            return "Request was not authorized.";
+        case "missing_proposal":
+            return "No proposal was submitted to apply.";
+        case "invalid_signature":
+            return "Proposal signature was invalid or expired.";
+        case "invalid_proposal_shape":
+            return "Proposal shape was invalid.";
+        case "sensitive_data_in_data":
+        case "sensitive_data_in_localized_data":
+            return "Proposal contained sensitive data.";
+        case "unknown_global":
+            return "Target global was not found.";
+        case "unknown_or_disallowed_collection":
+            return "Target collection is unknown or not allowed.";
+        case "invalid_collection_write_shape":
+            return "Proposal data does not match the target collection schema.";
+        case "invalid_global_write_shape":
+            return "Proposal data does not match the target global schema.";
+        case "localized_create_without_locales":
+            return "Localized create proposal had no locale entries.";
+        case "missing_auth_password":
+            return "Auth create proposal was missing a password.";
+        case "missing_auth_email":
+            return "Auth create proposal was missing an email.";
+        case "payload_operation_failed":
+            return "Payload rejected the write operation.";
+        default:
+            return "Unknown";
+    }
+};
+const getChatDebugMessage = (debugInfo)=>{
+    if (debugInfo.toolFailures?.length) {
+        return debugInfo.toolFailures[0]?.message || getDebugReasonLabel(debugInfo.reason);
+    }
+    return getDebugReasonLabel(debugInfo.reason);
+};
 const isMentionBoundary = (character)=>{
     return character === undefined || /\s/.test(character);
 };
@@ -122,6 +175,7 @@ const getActiveMentionRange = (valueBeforeCaret)=>{
 };
 const svgNamespace = "http://www.w3.org/2000/svg";
 const auditLogCollectionSlug = "payload-ai-auditlog";
+const responseOnlyToastCooldownMs = 10000;
 const appendSvgPath = (svg, d)=>{
     const path = document.createElementNS(svgNamespace, "path");
     path.setAttribute("d", d);
@@ -193,6 +247,8 @@ const AIInput = ()=>{
     const [appliedProposalIndexes, setAppliedProposalIndexes] = useState([]);
     const [response, setResponse] = useState("");
     const [tokenUsage, setTokenUsage] = useState(null);
+    const [chatDebugInfo, setChatDebugInfo] = useState(null);
+    const [applyDebugInfo, setApplyDebugInfo] = useState(null);
     const [error, setError] = useState("");
     const [proposals, setProposals] = useState([]);
     const [appliedChanges, setAppliedChanges] = useState([]);
@@ -231,7 +287,7 @@ const AIInput = ()=>{
         const timeout = window.setTimeout(()=>{
             setResponse("");
             clearInput();
-        }, 5000);
+        }, responseOnlyToastCooldownMs);
         return ()=>window.clearTimeout(timeout);
     }, [
         error,
@@ -304,6 +360,9 @@ const AIInput = ()=>{
         ...filteredMentionOptions,
         ...documentSuggestions
     ];
+    const shouldShowChatDebugInfo = Boolean(chatDebugInfo) && (Boolean(error) || chatDebugInfo?.reason !== "proposal_created");
+    const shouldShowApplyDebugInfo = Boolean(applyDebugInfo) && Boolean(error);
+    const actionToastDescription = response;
     const getTextBeforeCaret = (element)=>{
         const selection = window.getSelection();
         if (!selection || selection.rangeCount === 0) return "";
@@ -474,6 +533,8 @@ const AIInput = ()=>{
         setProposals([]);
         setResponse("");
         setTokenUsage(null);
+        setChatDebugInfo(null);
+        setApplyDebugInfo(null);
         try {
             const res = await fetch(formatAdminURL({
                 apiRoute: config.routes.api,
@@ -499,7 +560,10 @@ const AIInput = ()=>{
             const reader = res.body.getReader();
             const decoder = new TextDecoder();
             let buffer = "";
+            let finalDebugInfo = null;
             let receivedProposals = [];
+            let receivedText = "";
+            let receivedVisibleText = "";
             while(true){
                 const { done, value } = await reader.read();
                 if (done) break;
@@ -513,7 +577,10 @@ const AIInput = ()=>{
                     if (!event) continue;
                     if (event.event === "text") {
                         if (event.data.delta) {
-                            setResponse((current)=>current + sanitizeResponseText(event.data.delta || ""));
+                            const nextDelta = sanitizeResponseText(event.data.delta || "");
+                            receivedText += nextDelta;
+                            receivedVisibleText += nextDelta.replace(/\s+/g, "");
+                            setResponse((current)=>current + nextDelta);
                         }
                         continue;
                     }
@@ -523,6 +590,22 @@ const AIInput = ()=>{
                         setTokenUsage(event.data.usage || null);
                         continue;
                     }
+                    if (event.event === "debug") {
+                        finalDebugInfo = event.data;
+                        setChatDebugInfo(event.data);
+                        if ((event.data.proposalCount || 0) === 0 && !receivedVisibleText) {
+                            // Show specific tool validation message if present, otherwise a generic no‑action message
+                            if (event.data.reason === "tool_validation_failed") {
+                                const msg = getChatDebugMessage(event.data);
+                                setResponse(msg);
+                                // Auto‑clear after the standard toast timeout
+                                window.setTimeout(()=>setResponse(""), responseOnlyToastCooldownMs);
+                            } else {
+                                setResponse("No action needed");
+                            }
+                        }
+                        continue;
+                    }
                     if (event.event === "error") {
                         throw new Error(event.data.error || "AI request failed");
                     }
@@ -534,16 +617,42 @@ const AIInput = ()=>{
                 setProposals(receivedProposals);
                 setTokenUsage(finalEvent.data.usage || null);
             }
+            if (finalEvent?.event === "debug") {
+                finalDebugInfo = finalEvent.data;
+                setChatDebugInfo(finalEvent.data);
+                if ((finalEvent.data.proposalCount || 0) === 0 && !receivedVisibleText) {
+                    // Same logic as above for the final event
+                    if (finalEvent.data.reason === "tool_validation_failed") {
+                        setResponse(getChatDebugMessage(finalEvent.data));
+                    } else {
+                        setResponse("No action needed");
+                    }
+                }
+            }
             if (finalEvent?.event === "error") {
                 throw new Error(finalEvent.data.error || "AI request failed");
             }
             if (receivedProposals.length === 0) {
+                if (finalDebugInfo) {
+                    const debugMessage = getChatDebugMessage(finalDebugInfo);
+                    const isMeaningfulVisibleText = receivedVisibleText.length >= 12;
+                    const trimmedReceivedText = receivedText.trim();
+                    if (!isMeaningfulVisibleText || trimmedReceivedText.length < 12) {
+                        setResponse(debugMessage);
+                    } else {
+                        setResponse((current)=>current.trim() || debugMessage);
+                    }
+                } else {
+                    // Fallback when no debug info is provided (e.g., tool validation failures without a debug event)
+                    setResponse("No action needed");
+                }
                 clearInput();
             }
         } catch (err) {
             setProposals([]);
             setResponse("");
             setTokenUsage(null);
+            setApplyDebugInfo(null);
             setError(err instanceof Error ? err.message : "AI request failed");
         } finally{
             setIsLoading(false);
@@ -572,6 +681,7 @@ const AIInput = ()=>{
             if (!res.ok) {
                 setProposals([]);
                 setResponse("");
+                setApplyDebugInfo(result.debug || null);
                 throw new Error(result.error || "Could not apply proposal");
             }
             setAppliedProposalIndexes([]);
@@ -579,6 +689,8 @@ const AIInput = ()=>{
             setProposals([]);
             setResponse("");
             setTokenUsage(null);
+            setChatDebugInfo(null);
+            setApplyDebugInfo(null);
             if (result.change) {
                 setAppliedChanges((current)=>[
                         result.change,
@@ -700,7 +812,7 @@ const AIInput = ()=>{
                             }),
                             /*#__PURE__*/ _jsxs("button", {
                                 className: styles.chatButton,
-                                disabled: !prompt.trim() || !settingsProvider || !selectedModel || isLoading,
+                                disabled: !prompt.trim() || !settingsProvider || !selectedModel || isLoading || Boolean(error) || Boolean(actionToastDescription) || proposals.length > 0,
                                 onClick: ()=>void handleSubmit(),
                                 type: "button",
                                 children: [
@@ -716,7 +828,7 @@ const AIInput = ()=>{
                     /*#__PURE__*/ _jsx(ActionToast, {
                         apiRoute: config.routes.api,
                         appliedProposalIndexes: appliedProposalIndexes,
-                        description: response,
+                        description: actionToastDescription,
                         error: error,
                         getViewURL: getProposalViewURL,
                         isApplying: isApplying,
@@ -726,6 +838,8 @@ const AIInput = ()=>{
                             setProposals([]);
                             setResponse("");
                             setTokenUsage(null);
+                            setChatDebugInfo(null);
+                            setApplyDebugInfo(null);
                             clearInput();
                         },
                         onDismissError: ()=>{
@@ -733,7 +847,42 @@ const AIInput = ()=>{
                         },
                         onApply: (proposal, _index)=>void handleApplyProposal(proposal),
                         proposals: proposals,
+                        prompt: prompt,
                         tokenUsage: tokenUsage
+                    }),
+                    shouldShowApplyDebugInfo && applyDebugInfo && /*#__PURE__*/ _jsxs("div", {
+                        className: styles.debugInfo,
+                        children: [
+                            /*#__PURE__*/ _jsx("strong", {
+                                children: "Apply debug"
+                            }),
+                            /*#__PURE__*/ _jsx("br", {}),
+                            "Reason: ",
+                            getApplyDebugReasonLabel(applyDebugInfo.reason),
+                            /*#__PURE__*/ _jsx("br", {}),
+                            "Phase: ",
+                            applyDebugInfo.phase,
+                            /*#__PURE__*/ _jsx("br", {}),
+                            "Target: ",
+                            applyDebugInfo.collection || applyDebugInfo.slug || "unknown",
+                            applyDebugInfo.id ? /*#__PURE__*/ _jsxs(_Fragment, {
+                                children: [
+                                    /*#__PURE__*/ _jsx("br", {}),
+                                    "ID: ",
+                                    applyDebugInfo.id
+                                ]
+                            }) : null,
+                            applyDebugInfo.details ? /*#__PURE__*/ _jsxs(_Fragment, {
+                                children: [
+                                    /*#__PURE__*/ _jsx("br", {}),
+                                    "Details:",
+                                    /*#__PURE__*/ _jsx("pre", {
+                                        className: styles.debugDetails,
+                                        children: JSON.stringify(applyDebugInfo.details, null, 2)
+                                    })
+                                ]
+                            }) : null
+                        ]
                     })
                 ]
             }),

package/dist/components/AIInput.module.css

@@ -101,8 +101,10 @@
     background: transparent;
     border: 0;
     color: var(--theme-text);
+    display: block;
     font: inherit;
-    min-height: 84px;
+    height: 84px;
+    overflow-y: auto;
     padding: 0;
     white-space: pre-wrap;
     width: 100%;
@@ -120,7 +122,10 @@
 .chatInputSurface {
     background: var(--theme-input-bg);
     border: 1px solid var(--theme-elevation-150);
+    box-sizing: border-box;
     border-radius: 4px;
+    height: 108px;
+    overflow: hidden;
     padding: 12px;
     width: 100%;
 }
@@ -239,6 +244,11 @@
     white-space: pre-wrap;
 }
 
+.debugDetails {
+    margin: 8px 0 0;
+    white-space: pre-wrap;
+}
+
 .chatResponse {
     background: var(--theme-elevation-50);
     border: 1px solid var(--theme-elevation-100);
@@ -285,5 +295,4 @@
     .chatButton {
         align-self: stretch;
     }
-
 }

package/dist/components/ActionToast.d.ts

@@ -19,6 +19,7 @@ type ActionToastProps = {
     onDismiss?: () => void;
     onDismissError?: () => void;
     onApply: (proposal: ActionProposal, index: number) => void;
+    prompt?: string;
     proposals: ActionProposal[];
     tokenUsage?: {
         inputTokens?: number;
@@ -26,5 +27,5 @@ type ActionToastProps = {
         totalTokens?: number;
     } | null;
 };
-export declare const ActionToast: ({ apiRoute, appliedProposalIndexes, description, error, getViewURL, isApplying, onDismiss, onDismissError, onApply, proposals, tokenUsage, }: ActionToastProps) => import("react").JSX.Element | null;
+export declare const ActionToast: ({ apiRoute, appliedProposalIndexes, description, error, getViewURL, isApplying, onDismiss, onDismissError, onApply, prompt, proposals, tokenUsage, }: ActionToastProps) => import("react").JSX.Element | null;
 export {};

package/dist/components/ActionToast.js

@@ -20,7 +20,7 @@ const getSafeProposalDetails = (proposal)=>{
     }
     return redactedProposal;
 };
-export const ActionToast = ({ apiRoute, appliedProposalIndexes, description, error, getViewURL, isApplying, onDismiss, onDismissError, onApply, proposals, tokenUsage })=>{
+export const ActionToast = ({ apiRoute, appliedProposalIndexes, description, error, getViewURL, isApplying, onDismiss, onDismissError, onApply, prompt, proposals, tokenUsage })=>{
     const [activeDiff, setActiveDiff] = useState(null);
     const [diffError, setDiffError] = useState("");
     const [loadingDiffIndex, setLoadingDiffIndex] = useState(null);
@@ -36,7 +36,8 @@ export const ActionToast = ({ apiRoute, appliedProposalIndexes, description, err
                 path: "/ai-proposal-diff"
             }), {
                 body: JSON.stringify({
-                    proposal
+                    proposal,
+                    prompt
                 }),
                 headers: {
                     "Content-Type": "application/json"