From 764356a4befe88d2e95c8afb1f3978a51b4cc456 Mon Sep 17 00:00:00 2001 From: Dallin Romney Date: Mon, 12 May 2025 19:12:59 -0700 Subject: [PATCH] fix apply state actions --- .../StepContainerPreToolbar/ApplyActions.tsx | 8 --- .../GeneratingCodeLoader.tsx | 26 --------- .../StepContainerPreToolbar/index.tsx | 58 ++++++++++++++----- .../StyledMarkdownPreview/index.tsx | 12 ++-- .../components/mainInput/Lump/LumpToolbar.tsx | 4 +- gui/src/pages/gui/ToolCallDiv/EditFile.tsx | 2 +- .../FunctionSpecificToolCallDiv.tsx | 4 +- gui/src/redux/thunks/streamNormalInput.ts | 1 - 8 files changed, 52 insertions(+), 63 deletions(-) delete mode 100644 gui/src/components/StyledMarkdownPreview/StepContainerPreToolbar/GeneratingCodeLoader.tsx diff --git a/gui/src/components/StyledMarkdownPreview/StepContainerPreToolbar/ApplyActions.tsx b/gui/src/components/StyledMarkdownPreview/StepContainerPreToolbar/ApplyActions.tsx index cd86c4c60..b08fd5a1f 100644 --- a/gui/src/components/StyledMarkdownPreview/StepContainerPreToolbar/ApplyActions.tsx +++ b/gui/src/components/StyledMarkdownPreview/StepContainerPreToolbar/ApplyActions.tsx @@ -58,14 +58,6 @@ export function ApplyActions(props: ApplyActionsProps) { ); switch (props.applyState ? props.applyState.status : null) { - case "not-started": - return ( -
- - Pending - -
- ); case "streaming": return (
diff --git a/gui/src/components/StyledMarkdownPreview/StepContainerPreToolbar/GeneratingCodeLoader.tsx b/gui/src/components/StyledMarkdownPreview/StepContainerPreToolbar/GeneratingCodeLoader.tsx deleted file mode 100644 index 28e13e5b3..000000000 --- a/gui/src/components/StyledMarkdownPreview/StepContainerPreToolbar/GeneratingCodeLoader.tsx +++ /dev/null @@ -1,26 +0,0 @@ -import Spinner from "../../gui/Spinner"; - -export interface GeneratingCodeLoaderProps { - showLineCount: boolean; - codeBlockContent: string; - isPending: boolean; -} - -export function GeneratingCodeLoader({ - showLineCount, - codeBlockContent, - isPending, -}: GeneratingCodeLoaderProps) { - const numLinesCodeBlock = codeBlockContent.split("\n").length; - const linesGeneratedText = - numLinesCodeBlock === 1 - ? `1 line generated` - : `${numLinesCodeBlock} lines ${isPending ? "pending" : "generated"}`; - - return ( - - {showLineCount ? linesGeneratedText : "Generating"} - {!isPending && } - - ); -} diff --git a/gui/src/components/StyledMarkdownPreview/StepContainerPreToolbar/index.tsx b/gui/src/components/StyledMarkdownPreview/StepContainerPreToolbar/index.tsx index 44977514f..57962a2d2 100644 --- a/gui/src/components/StyledMarkdownPreview/StepContainerPreToolbar/index.tsx +++ b/gui/src/components/StyledMarkdownPreview/StepContainerPreToolbar/index.tsx @@ -11,14 +11,15 @@ import { IdeMessengerContext } from "../../../context/IdeMessenger"; import { useIdeMessengerRequest } from "../../../hooks"; import { useWebviewListener } from "../../../hooks/useWebviewListener"; import { useAppSelector } from "../../../redux/hooks"; +import { selectCurrentToolCallApplyState } from "../../../redux/selectors/selectCurrentToolCall"; import { selectApplyStateByStreamId } from "../../../redux/slices/sessionSlice"; import { getFontSize } from "../../../util"; +import Spinner from "../../gui/Spinner"; import { isTerminalCodeBlock } from "../utils"; import { ApplyActions } from "./ApplyActions"; import { CopyButton } from "./CopyButton"; import { CreateFileButton } from "./CreateFileButton"; import { FileInfo } from "./FileInfo"; -import { GeneratingCodeLoader } from "./GeneratingCodeLoader"; import { InsertButton } from "./InsertButton"; import { RunInTerminalButton } from "./RunInTerminalButton"; @@ -49,8 +50,9 @@ export interface StepContainerPreToolbarProps { codeBlockContent: string; language: string | null; relativeFilepath?: string; - isFinalCodeblock: boolean; + itemIndex?: number; codeBlockIndex: number; // To track which codeblock we are applying + isLastCodeblock: boolean; codeBlockStreamId: string; range?: string; children: any; @@ -62,8 +64,9 @@ export function StepContainerPreToolbar({ codeBlockContent, language, relativeFilepath, - isFinalCodeblock, + itemIndex, codeBlockIndex, + isLastCodeblock, codeBlockStreamId, range, children, @@ -71,6 +74,7 @@ export function StepContainerPreToolbar({ disableManualApply, }: StepContainerPreToolbarProps) { const ideMessenger = useContext(IdeMessengerContext); + const history = useAppSelector((state) => state.session.history); const [isExpanded, setIsExpanded] = useState(expanded ?? true); const [relativeFilepathUri, setRelativeFilepathUri] = useState( @@ -95,6 +99,9 @@ export function StepContainerPreToolbar({ const applyState = useAppSelector((state) => selectApplyStateByStreamId(state, codeBlockStreamId), ); + const currentToolCallApplyState = useAppSelector( + selectCurrentToolCallApplyState, + ); /** * In the case where `relativeFilepath` is defined, this will just be `relativeFilepathUri`. @@ -110,7 +117,12 @@ export function StepContainerPreToolbar({ relativeFilepath && /\.[0-9a-z]+$/i.test(relativeFilepath); const isStreaming = useAppSelector((store) => store.session.isStreaming); - const isGeneratingCodeBlock = isFinalCodeblock && isStreaming; + + const isLastItem = useMemo(() => { + return itemIndex === history.length - 1; + }, [history.length, itemIndex]); + + const isGeneratingCodeBlock = isLastItem && isLastCodeblock && isStreaming; // If we are creating a file, we already render that in the button // so we don't want to dispaly it twice here @@ -221,6 +233,32 @@ export function StepContainerPreToolbar({ } const renderActionButtons = () => { + const isPendingToolCall = + currentToolCallApplyState && + currentToolCallApplyState.streamId === applyState?.streamId && + currentToolCallApplyState.status === "not-started"; + + if (isGeneratingCodeBlock || isPendingToolCall) { + const numLines = codeBlockContent.split("\n").length; + const plural = numLines === 1 ? "" : "s"; + if (isGeneratingCodeBlock) { + return ( + + {!isExpanded ? `${numLines} line${plural} generated` : "Generating"}{" "} +
+ +
+
+ ); + } else { + return ( + + {`${numLines} line${plural} pending`} + + ); + } + } + if (isTerminalCodeBlock(language, codeBlockContent)) { return ; } @@ -281,17 +319,7 @@ export function StepContainerPreToolbar({
)} - {isGeneratingCodeBlock || applyState?.status === "not-started" ? ( - - ) : ( - renderActionButtons() - )} + {renderActionButtons()} diff --git a/gui/src/components/StyledMarkdownPreview/index.tsx b/gui/src/components/StyledMarkdownPreview/index.tsx index 082fea740..1d31852c7 100644 --- a/gui/src/components/StyledMarkdownPreview/index.tsx +++ b/gui/src/components/StyledMarkdownPreview/index.tsx @@ -193,11 +193,7 @@ const StyledMarkdownPreview = memo(function StyledMarkdownPreview( }; }, [props.itemIndex, history, allSymbols]); const pastFileInfoRef = useUpdatingRef(pastFileInfo); - - const isLastItem = useMemo(() => { - return props.itemIndex === history.length - 1; - }, [history.length, props.itemIndex]); - const isLastItemRef = useUpdatingRef(isLastItem); + const itemIndexRef = useUpdatingRef(props.itemIndex); const codeblockStreamIds = useRef([]); useEffect(() => { @@ -296,8 +292,7 @@ const StyledMarkdownPreview = memo(function StyledMarkdownPreview( const language = getLanguageFromClassName(className); - const isFinalCodeblock = - preChildProps["data-islastcodeblock"] && isLastItemRef.current; + const isLastCodeblock = preChildProps["data-islastcodeblock"]; if (codeblockStreamIds.current[codeBlockIndex] === undefined) { codeblockStreamIds.current[codeBlockIndex] = @@ -307,10 +302,11 @@ const StyledMarkdownPreview = memo(function StyledMarkdownPreview( return ( state.session.isStreaming); + const applyState = useAppSelector((state) => selectApplyStateByToolCallId(state, props.toolCallId), ); diff --git a/gui/src/pages/gui/ToolCallDiv/FunctionSpecificToolCallDiv.tsx b/gui/src/pages/gui/ToolCallDiv/FunctionSpecificToolCallDiv.tsx index 516282d74..781e55c7e 100644 --- a/gui/src/pages/gui/ToolCallDiv/FunctionSpecificToolCallDiv.tsx +++ b/gui/src/pages/gui/ToolCallDiv/FunctionSpecificToolCallDiv.tsx @@ -27,8 +27,8 @@ function FunctionSpecificToolCallDiv({ case BuiltInToolNames.EditExistingFile: return ( diff --git a/gui/src/redux/thunks/streamNormalInput.ts b/gui/src/redux/thunks/streamNormalInput.ts index 43e431271..ac729fd3a 100644 --- a/gui/src/redux/thunks/streamNormalInput.ts +++ b/gui/src/redux/thunks/streamNormalInput.ts @@ -63,7 +63,6 @@ export const streamNormalInput = createAsyncThunk< dispatch(abortStream()); break; } - dispatch(streamUpdate(next.value)); next = await gen.next(); }