diff --git a/.changeset/stale-toys-think.md b/.changeset/stale-toys-think.md new file mode 100644 index 000000000..88be2ada8 --- /dev/null +++ b/.changeset/stale-toys-think.md @@ -0,0 +1,5 @@ +--- +"roo-cline": patch +--- + +Show a warning if checkpoints are taking too long to load diff --git a/webview-ui/src/components/chat/ChatView.tsx b/webview-ui/src/components/chat/ChatView.tsx index 3f1d5fd10..d56594a6f 100644 --- a/webview-ui/src/components/chat/ChatView.tsx +++ b/webview-ui/src/components/chat/ChatView.tsx @@ -1,4 +1,4 @@ -import { VSCodeButton } from "@vscode/webview-ui-toolkit/react" +import { VSCodeButton, VSCodeLink } from "@vscode/webview-ui-toolkit/react" import debounce from "debounce" import { useCallback, useEffect, useMemo, useRef, useState } from "react" import { useDeepCompareEffect, useEvent, useMount } from "react-use" @@ -88,6 +88,7 @@ const ChatView = ({ isHidden, showAnnouncement, hideAnnouncement, showHistoryVie const [isAtBottom, setIsAtBottom] = useState(false) const [wasStreaming, setWasStreaming] = useState(false) + const [showCheckpointWarning, setShowCheckpointWarning] = useState(false) // UI layout depends on the last 2 messages // (since it relies on the content of these messages, we are deep comparing. i.e. the button state after hitting button sets enableButtons to false, and this effect otherwise would have to true again even if messages didn't change @@ -882,6 +883,48 @@ const ChatView = ({ isHidden, showAnnouncement, hideAnnouncement, showHistoryVie }, []) useEvent("wheel", handleWheel, window, { passive: true }) // passive improves scrolling performance + // Effect to handle showing the checkpoint warning after a delay + useEffect(() => { + // Only show the warning when there's a task but no visible messages yet + if (task && modifiedMessages.length === 0 && !isStreaming) { + const timer = setTimeout(() => { + setShowCheckpointWarning(true) + }, 5000) // 5 seconds + + return () => clearTimeout(timer) + } + }, [task, modifiedMessages.length, isStreaming]) + + // Effect to hide the checkpoint warning when messages appear + useEffect(() => { + if (modifiedMessages.length > 0 || isStreaming) { + setShowCheckpointWarning(false) + } + }, [modifiedMessages.length, isStreaming]) + + // Checkpoint warning component + const CheckpointWarningMessage = useCallback( + () => ( +
+ + + Still initializing checkpoint... If this takes too long, you can{" "} + { + e.preventDefault() + window.postMessage({ type: "action", action: "settingsButtonClicked" }, "*") + }} + className="inline px-0.5"> + disable checkpoints in settings + {" "} + and restart your task. + +
+ ), + [], + ) + const placeholderText = useMemo(() => { const baseText = task ? "Type a message..." : "Type your task here..." const contextText = "(@ to add context, / to switch modes" @@ -1014,17 +1057,26 @@ const ChatView = ({ isHidden, showAnnouncement, hideAnnouncement, showHistoryVie overflow: "hidden", }}> {task ? ( - + <> + + + {/* Checkpoint warning message */} + {showCheckpointWarning && ( +
+ +
+ )} + ) : (