diff --git a/webview-ui/src/components/ChatView.tsx b/webview-ui/src/components/ChatView.tsx index 6ecd6d3..345f557 100644 --- a/webview-ui/src/components/ChatView.tsx +++ b/webview-ui/src/components/ChatView.tsx @@ -30,6 +30,7 @@ const ChatView = ({ messages, isHidden }: ChatViewProps) => { // we need to hold on to the ask because useEffect > lastMessage will always let us know when an ask comes in and handle it, but by the time handleMessage is called, the last message might not be the ask anymore (it could be a say that followed) const [claudeAsk, setClaudeAsk] = useState(undefined) + const [enableButtons, setEnableButtons] = useState(false) const [primaryButtonText, setPrimaryButtonText] = useState(undefined) const [secondaryButtonText, setSecondaryButtonText] = useState(undefined) @@ -73,24 +74,28 @@ const ChatView = ({ messages, isHidden }: ChatViewProps) => { case "request_limit_reached": setTextAreaDisabled(true) setClaudeAsk("request_limit_reached") + setEnableButtons(true) setPrimaryButtonText("Proceed") setSecondaryButtonText("Start New Task") break case "followup": setTextAreaDisabled(false) setClaudeAsk("followup") - setPrimaryButtonText(undefined) - setSecondaryButtonText(undefined) + setEnableButtons(false) + // setPrimaryButtonText(undefined) + // setSecondaryButtonText(undefined) break case "tool": setTextAreaDisabled(true) setClaudeAsk("tool") + setEnableButtons(true) setPrimaryButtonText("Approve") setSecondaryButtonText("Cancel") break case "command": setTextAreaDisabled(true) setClaudeAsk("command") + setEnableButtons(true) setPrimaryButtonText("Run Command") setSecondaryButtonText("Cancel") break @@ -98,6 +103,7 @@ const ChatView = ({ messages, isHidden }: ChatViewProps) => { // extension waiting for feedback. but we can just present a new task button setTextAreaDisabled(false) setClaudeAsk("completion_result") + setEnableButtons(true) setPrimaryButtonText("Start New Task") setSecondaryButtonText(undefined) break @@ -137,6 +143,7 @@ const ChatView = ({ messages, isHidden }: ChatViewProps) => { if (messages.length === 0) { setTextAreaDisabled(false) setClaudeAsk(undefined) + setEnableButtons(false) setPrimaryButtonText(undefined) setSecondaryButtonText(undefined) } @@ -159,8 +166,9 @@ const ChatView = ({ messages, isHidden }: ChatViewProps) => { setInputValue("") setTextAreaDisabled(true) setClaudeAsk(undefined) - setPrimaryButtonText(undefined) - setSecondaryButtonText(undefined) + setEnableButtons(false) + // setPrimaryButtonText(undefined) + // setSecondaryButtonText(undefined) } } @@ -181,8 +189,9 @@ const ChatView = ({ messages, isHidden }: ChatViewProps) => { } setTextAreaDisabled(true) setClaudeAsk(undefined) - setPrimaryButtonText(undefined) - setSecondaryButtonText(undefined) + setEnableButtons(false) + // setPrimaryButtonText(undefined) + // setSecondaryButtonText(undefined) } const handleSecondaryButtonClick = () => { @@ -197,8 +206,9 @@ const ChatView = ({ messages, isHidden }: ChatViewProps) => { } setTextAreaDisabled(true) setClaudeAsk(undefined) - setPrimaryButtonText(undefined) - setSecondaryButtonText(undefined) + setEnableButtons(false) + // setPrimaryButtonText(undefined) + // setSecondaryButtonText(undefined) } const handleKeyDown = (event: KeyboardEvent) => { @@ -313,30 +323,35 @@ const ChatView = ({ messages, isHidden }: ChatViewProps) => { ))} - {(primaryButtonText || secondaryButtonText) && ( -
- {primaryButtonText && ( - - {primaryButtonText} - - )} - {secondaryButtonText && ( - - {secondaryButtonText} - - )} -
- )} -
+
+ {primaryButtonText && ( + + {primaryButtonText} + + )} + {secondaryButtonText && ( + + {secondaryButtonText} + + )} +
+
{ resize: "none", overflow: "hidden", padding: "8px 36px 8px 8px", + cursor: textAreaDisabled ? "not-allowed" : undefined, }} />