diff --git a/webview-ui/src/components/settings/ApiOptions.tsx b/webview-ui/src/components/settings/ApiOptions.tsx index 47b4e10e212..5a09487f120 100644 --- a/webview-ui/src/components/settings/ApiOptions.tsx +++ b/webview-ui/src/components/settings/ApiOptions.tsx @@ -48,9 +48,10 @@ import { RequestyModelPicker } from "./RequestyModelPicker" interface ApiOptionsProps { apiErrorMessage?: string modelIdErrorMessage?: string + fromWelcomeView?: boolean } -const ApiOptions = ({ apiErrorMessage, modelIdErrorMessage }: ApiOptionsProps) => { +const ApiOptions = ({ apiErrorMessage, modelIdErrorMessage, fromWelcomeView }: ApiOptionsProps) => { const { apiConfiguration, uriScheme, handleInputChange } = useExtensionState() const [ollamaModels, setOllamaModels] = useState([]) const [lmStudioModels, setLmStudioModels] = useState([]) @@ -1391,17 +1392,19 @@ const ApiOptions = ({ apiErrorMessage, modelIdErrorMessage }: ApiOptionsProps) = )} -
- { - handleInputChange("modelTemperature")({ - target: { value }, - }) - }} - maxValue={2} - /> -
+ {!fromWelcomeView && ( +
+ { + handleInputChange("modelTemperature")({ + target: { value }, + }) + }} + maxValue={2} + /> +
+ )} {modelIdErrorMessage && (

({ + VSCodeTextField: ({ children, value, onBlur }: any) => ( +

+ {children} + +
+ ), + VSCodeLink: ({ children, href }: any) => {children}, + VSCodeRadio: ({ children, value, checked }: any) => , + VSCodeRadioGroup: ({ children }: any) =>
{children}
, +})) + +// Mock other components +jest.mock("vscrui", () => ({ + Dropdown: ({ children, value, onChange }: any) => ( + + ), + Checkbox: ({ children, checked, onChange }: any) => ( + + ), + Pane: ({ children }: any) =>
{children}
, +})) + +jest.mock("../TemperatureControl", () => ({ + TemperatureControl: ({ value, onChange }: any) => ( +
+ onChange(parseFloat(e.target.value))} + min={0} + max={2} + step={0.1} + /> +
+ ), +})) + +describe("ApiOptions", () => { + const renderApiOptions = (props = {}) => { + render( + + + , + ) + } + + it("shows temperature control by default", () => { + renderApiOptions() + expect(screen.getByTestId("temperature-control")).toBeInTheDocument() + }) + + it("hides temperature control when fromWelcomeView is true", () => { + renderApiOptions({ fromWelcomeView: true }) + expect(screen.queryByTestId("temperature-control")).not.toBeInTheDocument() + }) +}) diff --git a/webview-ui/src/components/welcome/WelcomeView.tsx b/webview-ui/src/components/welcome/WelcomeView.tsx index f8e6f3abdcd..92f2d90b969 100644 --- a/webview-ui/src/components/welcome/WelcomeView.tsx +++ b/webview-ui/src/components/welcome/WelcomeView.tsx @@ -1,5 +1,5 @@ import { VSCodeButton } from "@vscode/webview-ui-toolkit/react" -import { useEffect, useState } from "react" +import { useState } from "react" import { useExtensionState } from "../../context/ExtensionStateContext" import { validateApiConfiguration } from "../../utils/validate" import { vscode } from "../../utils/vscode" @@ -8,18 +8,18 @@ import ApiOptions from "../settings/ApiOptions" const WelcomeView = () => { const { apiConfiguration } = useExtensionState() - const [apiErrorMessage, setApiErrorMessage] = useState(undefined) - - const disableLetsGoButton = apiErrorMessage !== null && apiErrorMessage !== undefined + const [errorMessage, setErrorMessage] = useState(undefined) const handleSubmit = () => { + const error = validateApiConfiguration(apiConfiguration) + if (error) { + setErrorMessage(error) + return + } + setErrorMessage(undefined) vscode.postMessage({ type: "apiConfiguration", apiConfiguration }) } - useEffect(() => { - setApiErrorMessage(validateApiConfiguration(apiConfiguration)) - }, [apiConfiguration]) - return (

Hi, I'm Roo!

@@ -33,10 +33,13 @@ const WelcomeView = () => { To get started, this extension needs an API provider.
- - - Let's go! - + +
+ + Let's go! + + {errorMessage && {errorMessage}} +
)