impact-chatbot 2.3.51 → 2.3.52

package/dist/index.cjs.js

@@ -1299,12 +1299,70 @@ const ThinkingIndicator = (props) => {
     return (jsxRuntime.jsx("div", { children: jsxRuntime.jsx("div", { children: thinkingContentState ? (jsxRuntime.jsx("div", { children: jsxRuntime.jsx(TextRenderer, { text: thinkingContentState, thinking: true }) })) : (jsxRuntime.jsxs("div", { className: classes.thinkingSpinner, children: [jsxRuntime.jsx("span", { className: classes.thinkingDot }), jsxRuntime.jsx("span", { className: classes.thinkingDot }), jsxRuntime.jsx("span", { className: classes.thinkingDot })] })) }) }));
 };
 
+/**
+ * Formats elapsed seconds into "Xm:Ys" display string.
+ * e.g. 0 -> "0m:00s", 65 -> "1m:05s", 130 -> "2m:10s"
+ */
+const formatElapsedTime = (totalSeconds) => {
+    const minutes = Math.floor(totalSeconds / 60);
+    const seconds = totalSeconds % 60;
+    return `${minutes}m:${String(seconds).padStart(2, '0')}s`;
+};
 const ThinkinHeaderInfo = (props) => {
     const thinkingContext = reactRedux.useSelector((state) => {
         return state.smartBotReducer.thinkingContext;
     });
-    const { thinkingHeaderMessage } = thinkingContext;
-    return (jsxRuntime.jsx("div", { className: "thinkin-header-info", children: thinkingHeaderMessage }));
+    const { streamStartTime, isStreamCompleted, finalElapsedSeconds, thinkingHeaderMessage } = thinkingContext;
+    const [elapsed, setElapsed] = React.useState(0);
+    const intervalRef = React.useRef(null);
+    // Once this instance sees "completed", freeze it permanently so a future
+    // chat's streamStartTime doesn't cause it to start ticking again.
+    const frozenRef = React.useRef(false);
+    const frozenTextRef = React.useRef(null);
+    React.useEffect(() => {
+        // If already frozen, ignore all future Redux changes
+        if (frozenRef.current)
+            return;
+        // Clear any existing interval
+        if (intervalRef.current) {
+            clearInterval(intervalRef.current);
+            intervalRef.current = null;
+        }
+        if (isStreamCompleted && typeof finalElapsedSeconds === 'number') {
+            // Freeze this instance — it will never tick again
+            frozenRef.current = true;
+            frozenTextRef.current = `Completed in ${formatElapsedTime(finalElapsedSeconds)}`;
+            setElapsed(finalElapsedSeconds);
+        }
+        else if (streamStartTime && !isStreamCompleted) {
+            // Live timer — update every second
+            const tick = () => {
+                const now = Date.now();
+                const diffSeconds = Math.floor((now - streamStartTime) / 1000);
+                setElapsed(diffSeconds);
+            };
+            tick(); // immediate first tick
+            intervalRef.current = setInterval(tick, 1000);
+        }
+        return () => {
+            if (intervalRef.current) {
+                clearInterval(intervalRef.current);
+                intervalRef.current = null;
+            }
+        };
+    }, [streamStartTime, isStreamCompleted, finalElapsedSeconds]);
+    // Determine display text
+    let displayText = thinkingHeaderMessage || '';
+    if (frozenRef.current && frozenTextRef.current) {
+        displayText = frozenTextRef.current;
+    }
+    else if (streamStartTime && !isStreamCompleted) {
+        displayText = `Working for ${formatElapsedTime(elapsed)}`;
+    }
+    else if (isStreamCompleted && typeof finalElapsedSeconds === 'number') {
+        displayText = `Completed in ${formatElapsedTime(finalElapsedSeconds)}`;
+    }
+    return (jsxRuntime.jsx("div", { className: "thinkin-header-info", children: displayText }));
 };
 
 // import { exampleGraphData } from "../examples/GraphExample";
@@ -4074,7 +4132,7 @@ const useChatState = () => {
     const [chatId, setChatId] = React.useState("");
     const [isStop, setIsStop] = React.useState(false);
     const [functionsState, setFunctionsState] = React.useState({});
-    const [thinkingHeaderMessage, setThinkingHeaderMessage] = React.useState("Planning next moves...");
+    const [thinkingHeaderMessage, setThinkingHeaderMessage] = React.useState("Working… 0m:00s");
     const [legacyAgentScreen, setLegacyAgentScreen] = React.useState(false);
     const [uniqueChatId, setUniqueChatId] = React.useState("");
     const [fieldNumber, setFieldNumber] = React.useState(0);
@@ -5408,6 +5466,7 @@ const ButtonContent = ({ bodyText, isFormDisabled = false, isStepFormSubmit = fa
         status: "",
     });
     const chatbotContext = reactRedux.useSelector((state) => state.smartBotReducer.chatbotContext);
+    const thinkingContext = reactRedux.useSelector((state) => state.smartBotReducer.thinkingContext);
     const handleButtonClick = (button) => {
         if (isStepFormSubmit) {
             // Build the user_input from chatbotContext
@@ -5422,7 +5481,6 @@ const ButtonContent = ({ bodyText, isFormDisabled = false, isStepFormSubmit = fa
                         : typeof value === 'number' ? value : String(value);
                 }
             }
-            console.log("[ButtonContent] step form submit, calling init API with userInput:", userInput);
             dispatch(smartBotActions.setChatbotContext({}));
             // Call the init API via SSE directly
             callInitApiStream(userInput);
@@ -5481,6 +5539,9 @@ const ButtonContent = ({ bodyText, isFormDisabled = false, isStepFormSubmit = fa
         dispatch(smartBotActions.setStepFormStreamData({ status: "streaming_start", chunks: [], sessionId }));
         // Fire DOM event so SmartBot can show stop icon (Redux gets cleared by TabularContent before parent effects run)
         window.dispatchEvent(new CustomEvent("stepFormStreamStart"));
+        // Capture start time for computing elapsed on completion.
+        // Timer keeps running from the original streamStartTime (set when first API was hit).
+        const stepFormStreamStartTime = Date.now();
         sourceRef.current = AxiosSource(endPoint, {
             method: "POST",
             headers: {
@@ -5495,7 +5556,6 @@ const ButtonContent = ({ bodyText, isFormDisabled = false, isStepFormSubmit = fa
         sourceRef.current.addEventListener("message", (event) => {
             try {
                 const data = JSON.parse(event.data);
-                console.log("[ButtonContent] SSE chunk:", data);
                 // Always keep stepFormStreamControl.sessionId in sync with the latest chunk's session_id
                 if (data?.session_id) {
                     stepFormStreamControl.sessionId = data.session_id;
@@ -5536,6 +5596,22 @@ const ButtonContent = ({ bodyText, isFormDisabled = false, isStepFormSubmit = fa
                     stepFormStreamControl.isStreaming = false;
                     stepFormStreamControl.abort = null;
                     window.dispatchEvent(new CustomEvent("stepFormStreamEnd"));
+                    // Stop the timer only when status:"completed" is received
+                    if (data?.status === "completed") {
+                        // Use the original streamStartTime from Redux (set when first API was hit)
+                        const originalStartTime = thinkingContext?.streamStartTime || stepFormStreamStartTime;
+                        const totalElapsed = Math.floor((Date.now() - originalStartTime) / 1000);
+                        const sfMin = Math.floor(totalElapsed / 60);
+                        const sfSec = totalElapsed % 60;
+                        const sfWorkedLabel = `Completed in ${sfMin}m:${String(sfSec).padStart(2, '0')}s`;
+                        dispatch(smartBotActions.setThinkingContext({
+                            streamStartTime: originalStartTime,
+                            isStreamCompleted: true,
+                            finalElapsedSeconds: totalElapsed,
+                            thinkingHeaderMessage: sfWorkedLabel,
+                            thinkingContent: "",
+                        }));
+                    }
                     // Signal tab switch to agent_response when status is "completed",
                     // but only if the response doesn't contain a new step_form that needs user interaction
                     const hasStepForm = chunksRef.some((c) => c.status === "step_form");
@@ -6994,24 +7070,6 @@ function clearTabNotification() {
  * This survives the cloneDeep replacement of botData in SmartBot's useEffect.
  */
 const streamStateMap = new Map();
-/**
- * Formats thinking time to display minutes when appropriate
- * @param {number} seconds - Time in seconds
- * @returns {string} Formatted time string
- */
-const formatThinkingTime = (seconds) => {
-    if (seconds < 60) {
-        return `${seconds} second${seconds !== 1 ? 's' : ''}`;
-    }
-    const minutes = Math.floor(seconds / 60);
-    const remainingSeconds = seconds % 60;
-    if (remainingSeconds === 0) {
-        return `${minutes} minute${minutes !== 1 ? 's' : ''}`;
-    }
-    else {
-        return `${minutes} min ${remainingSeconds} sec`;
-    }
-};
 /**
  * StreamedContent Component
  * Handles real-time streaming of chat messages with a typing-like effect
@@ -7075,7 +7133,8 @@ const StreamedContent = ({ botData }) => {
     React.useRef(""); // Tracks the last received message
     const thinkingStartTimeRef = React.useRef(null);
     const thinkingTimeFinalRef = React.useRef(0);
-    const thinkingHeaderMessageRef = React.useRef("Planning next moves.....");
+    const thinkingHeaderMessageRef = React.useRef("Working for 0m:00s");
+    const streamStartTimeRef = React.useRef(null);
     const thinkingDoneRef = React.useRef(false);
     const setThinkingContentRef = React.useRef(setThinkingContent); // Store current setThinkingContent function
     const streamTimeoutRef = React.useRef(null); // Ref for stream timeout
@@ -7141,6 +7200,17 @@ const StreamedContent = ({ botData }) => {
                 ? botData?.utilityObject?.method
                 : "PUT";
             delete botData.inputBody.chat_input;
+            // Start the timer immediately when the API is called
+            if (!streamStartTimeRef.current) {
+                streamStartTimeRef.current = Date.now();
+                dispatch(smartBotActions.setThinkingContext({
+                    streamStartTime: streamStartTimeRef.current,
+                    isStreamCompleted: false,
+                    finalElapsedSeconds: null,
+                    thinkingHeaderMessage: "Working for 0m:00s",
+                    thinkingContent: "",
+                }));
+            }
             // Initialize SSE connection with API endpoint
             sourceRef.current = AxiosSource(endPoint, {
                 method: method,
@@ -7229,7 +7299,7 @@ const StreamedContent = ({ botData }) => {
                         setQuestionsStepsMap(lodash.cloneDeep(initialMap));
                     }
                     else if (data.status === "thinking") {
-                        messageToStoreRef.current.chatData.thinkingResponse.thinkingHeading = "Planning next moves";
+                        messageToStoreRef.current.chatData.thinkingResponse.thinkingHeading = (jsxRuntime.jsx(ThinkinHeaderInfo, { thinkingHeaderMessage: "Working for 0m:00s" }));
                         // Start thinking if not already started
                         if (!isThinking) {
                             setIsThinking(true);
@@ -7240,6 +7310,9 @@ const StreamedContent = ({ botData }) => {
                         thinkingContentRef.current = thinkingContentRef.current + data.message;
                         messageToStoreRef.current.chatData.thinkingResponse.thinkingStream = newValue;
                         dispatch(smartBotActions.setThinkingContext({
+                            streamStartTime: streamStartTimeRef.current,
+                            isStreamCompleted: false,
+                            finalElapsedSeconds: null,
                             thinkingHeaderMessage: thinkingHeaderMessageRef.current,
                             thinkingContent: thinkingContentRef.current,
                         }));
@@ -7372,7 +7445,8 @@ const StreamedContent = ({ botData }) => {
                         stepFormStreamControl.baseUrl = _burl;
                         // If this is the [DONE] chunk, mark streaming as complete
                         if (data.message === "[DONE]") {
-                            setStepsDone(true);
+                            // Do NOT set stepsDone here — step_form [DONE] is not status:"completed".
+                            // stepsDone should only be true when status:"completed" arrives.
                             setIsStreamingDone(true);
                             const doneState = streamStateMap.get(streamKey);
                             if (doneState)
@@ -7401,10 +7475,13 @@ const StreamedContent = ({ botData }) => {
                             // Store thinking time in messageToStoreRef for persistence
                             messageToStoreRef.current.chatData.thinkingResponse.thinkingTime = finalThinkingTime;
                             thinkingTimeFinalRef.current = finalThinkingTime;
-                            setThinkingHeaderMessage(`Thought for ${formatThinkingTime(finalThinkingTime)}`);
-                            thinkingHeaderMessageRef.current = `Thought for ${formatThinkingTime(finalThinkingTime)}`;
+                            // Keep timer running — do NOT set "Worked for" here.
+                            // Timer continues showing "Working for Xm:Ys" until status:"completed" arrives.
                             dispatch(smartBotActions.setThinkingContext({
-                                thinkingHeaderMessage: `Thinking Completed`,
+                                streamStartTime: streamStartTimeRef.current,
+                                isStreamCompleted: false,
+                                finalElapsedSeconds: null,
+                                thinkingHeaderMessage: thinkingHeaderMessageRef.current,
                                 thinkingContent: thinkingContentRef.current,
                             }));
                         }
@@ -7518,11 +7595,31 @@ const StreamedContent = ({ botData }) => {
             if (currentMode === "agent") {
                 setIsStop(false);
                 // Use thinkingTime state instead of thinkingTimeFinalRef.current to ensure we have the correct value
-                thinkingTime || thinkingTimeFinalRef.current || 1;
-                messageToStoreRef.current.chatData.thinkingResponse.thinkingHeading = `Thinking Completed`;
-                // messageToStoreRef.current.chatData.thinkingResponse.thinkingHeading = `Thought for ${formatThinkingTime(
-                //   finalThinkingTime
-                // )}`;
+                const finalThinkingTime = thinkingTime || thinkingTimeFinalRef.current || 1;
+                const completedElapsed = streamStartTimeRef.current
+                    ? Math.floor((Date.now() - streamStartTimeRef.current) / 1000)
+                    : finalThinkingTime;
+                const compMin = Math.floor(completedElapsed / 60);
+                const compSec = completedElapsed % 60;
+                const workedForLabel = `Completed in ${compMin}m:${String(compSec).padStart(2, '0')}s`;
+                // Only stop the timer if we got status:"completed" (stepsDone=true).
+                // If stream ended with step_form [DONE], keep timer running for the next restream.
+                if (stepsDone) {
+                    // Completed — use a static string so this chat's heading won't
+                    // re-animate when a future chat dispatches a new streamStartTime.
+                    messageToStoreRef.current.chatData.thinkingResponse.thinkingHeading = workedForLabel;
+                    dispatch(smartBotActions.setThinkingContext({
+                        streamStartTime: streamStartTimeRef.current,
+                        isStreamCompleted: true,
+                        finalElapsedSeconds: completedElapsed,
+                        thinkingHeaderMessage: workedForLabel,
+                        thinkingContent: thinkingContentRef.current,
+                    }));
+                }
+                else {
+                    // step_form case: keep heading as the live ThinkinHeaderInfo component so the timer keeps ticking
+                    messageToStoreRef.current.chatData.thinkingResponse.thinkingHeading = (jsxRuntime.jsx(ThinkinHeaderInfo, { thinkingHeaderMessage: "Working for 0m:00s" }));
+                }
                 let actualResponse = lodash.cloneDeep(messageToStoreRef.current.chatData.thinkingResponse.thinkingStream);
                 messageToStoreRef.current.chatData.thinkingResponse.thinkingContent = actualResponse;
                 parseResponse(messageToStoreRef.current.chatData, "text");
@@ -7763,6 +7860,20 @@ const StreamedContent = ({ botData }) => {
                 setShowThoughtDropdown(true);
                 messageToStoreRef.current.chatData.thinkingResponse.thinkingTime = finalThinkingTime;
             }
+            // Stop the timer on abort
+            const abortElapsed = streamStartTimeRef.current
+                ? Math.floor((Date.now() - streamStartTimeRef.current) / 1000)
+                : 0;
+            const abortMin = Math.floor(abortElapsed / 60);
+            const abortSec = abortElapsed % 60;
+            const abortLabel = `Completed in ${abortMin}m:${String(abortSec).padStart(2, '0')}s`;
+            dispatch(smartBotActions.setThinkingContext({
+                streamStartTime: streamStartTimeRef.current,
+                isStreamCompleted: true,
+                finalElapsedSeconds: abortElapsed,
+                thinkingHeaderMessage: abortLabel,
+                thinkingContent: thinkingContentRef.current,
+            }));
             // If no content yet, show aborted message
             // if (isEmpty(messageToStoreRef.current.chatData?.response)) {
             messageToStoreRef.current.chatData.response =
@@ -11650,7 +11761,7 @@ const useConversationManagement = (chatDataRef, currentMode, activeConversationI
                         thinkingStream: item.data,
                         thinkingContent: item.data,
                         thinkingTime: 1,
-                        thinkingHeading: "Thinking Completed",
+                        thinkingHeading: "Completed in 0m:00s",
                     };
                 }
                 else if (item.chatType === "steps") {
@@ -11845,7 +11956,9 @@ const useConversationManagement = (chatDataRef, currentMode, activeConversationI
                         thinkingResponse: msg.thinkingResponse ? {
                             thinkingStream: msg.thinkingResponse.thinkingStream,
                             thinkingTime: msg.thinkingResponse.thinkingTime,
-                            thinkingHeading: msg.thinkingResponse.thinkingHeading,
+                            thinkingHeading: typeof msg.thinkingResponse.thinkingHeading === 'string'
+                                ? msg.thinkingResponse.thinkingHeading
+                                : "Completed in 0m:00s",
                         } : undefined,
                     }
                 }))
@@ -12621,7 +12734,10 @@ const SmartBot = (props) => {
                 // if(!isEmpty(userInput)) {
                 dispatch(smartBotActions.setThinkingContext({
                     thinkingContent: "",
-                    thinkingHeaderMessage: "Planning next moves.....",
+                    thinkingHeaderMessage: "Working for 0m:00s",
+                    streamStartTime: Date.now(),
+                    isStreamCompleted: false,
+                    finalElapsedSeconds: null,
                 }));
                 // }
                 prepareDataAndSendToAgent(data, true, {
@@ -12836,7 +12952,10 @@ const SmartBot = (props) => {
                         setShowChatPlaceholder(true);
                         dispatch(smartBotActions.setThinkingContext({
                             thinkingContent: "",
-                            thinkingHeaderMessage: "Planning next moves.....",
+                            thinkingHeaderMessage: "Working for 0m:00s",
+                            streamStartTime: null,
+                            isStreamCompleted: false,
+                            finalElapsedSeconds: null,
                         }));
                         setInitValue(true);
                         setSessionId("");