Enable model select when api fails (#2217)

* Enable model switching on API failure

Bug: Cannot change model selection after API error due to UI state #1657
UI Bug: OpenRouter ran out of credits prevents user from switching models #1206

* Remove irrelevant code

Author: kyle-apex

webview-ui/src/components/chat/ChatTextArea.tsx

@@ -32,6 +32,7 @@ interface ChatTextAreaProps {
 	inputValue: string
 	setInputValue: (value: string) => void
 	textAreaDisabled: boolean
+	selectApiConfigDisabled: boolean
 	placeholderText: string
 	selectedImages: string[]
 	setSelectedImages: React.Dispatch<React.SetStateAction<string[]>>
@@ -50,6 +51,7 @@ const ChatTextArea = forwardRef<HTMLTextAreaElement, ChatTextAreaProps>(
 			inputValue,
 			setInputValue,
 			textAreaDisabled,
+			selectApiConfigDisabled,
 			placeholderText,
 			selectedImages,
 			setSelectedImages,
@@ -975,7 +977,7 @@ const ChatTextArea = forwardRef<HTMLTextAreaElement, ChatTextAreaProps>(
 						<div className={cn("flex-1", "min-w-0", "overflow-hidden")}>
 							<SelectDropdown
 								value={currentConfigId}
-								disabled={textAreaDisabled}
+								disabled={selectApiConfigDisabled}
 								title={t("chat:selectApiConfig")}
 								placeholder={displayName} // Always show the current name
 								options={[

webview-ui/src/components/chat/ChatView.tsx

@@ -1346,6 +1346,7 @@ const ChatView = ({ isHidden, showAnnouncement, hideAnnouncement, showHistoryVie
 				inputValue={inputValue}
 				setInputValue={setInputValue}
 				textAreaDisabled={textAreaDisabled}
+				selectApiConfigDisabled={textAreaDisabled && clineAsk !== "api_req_failed"}
 				placeholderText={placeholderText}
 				selectedImages={selectedImages}
 				setSelectedImages={setSelectedImages}

webview-ui/src/components/chat/__tests__/ChatTextArea.test.tsx

@@ -47,6 +47,7 @@ describe("ChatTextArea", () => {
 		setInputValue: jest.fn(),
 		onSend: jest.fn(),
 		textAreaDisabled: false,
+		selectApiConfigDisabled: false,
 		onSelectImages: jest.fn(),
 		shouldDisableImages: false,
 		placeholderText: "Type a message...",
@@ -408,4 +409,21 @@ describe("ChatTextArea", () => {
 			expect(setInputValue).not.toHaveBeenCalled()
 		})
 	})
+
+	describe("selectApiConfig", () => {
+		// Helper function to get the API config dropdown
+		const getApiConfigDropdown = () => {
+			return screen.getByTitle("chat:selectApiConfig")
+		}
+		it("should be enabled independently of textAreaDisabled", () => {
+			render(<ChatTextArea {...defaultProps} textAreaDisabled={true} selectApiConfigDisabled={false} />)
+			const apiConfigDropdown = getApiConfigDropdown()
+			expect(apiConfigDropdown).not.toHaveAttribute("disabled")
+		})
+		it("should be disabled when selectApiConfigDisabled is true", () => {
+			render(<ChatTextArea {...defaultProps} textAreaDisabled={true} selectApiConfigDisabled={true} />)
+			const apiConfigDropdown = getApiConfigDropdown()
+			expect(apiConfigDropdown).toHaveAttribute("disabled")
+		})
+	})
 })