Merge pull request #518 from samhvw8/revert-onChange-onInput

Revert onChange back to onInput
This commit is contained in:
Matt Rubens
2025-01-23 09:48:01 -08:00
committed by GitHub
4 changed files with 22 additions and 49 deletions

View File

@@ -156,7 +156,7 @@ const ApiOptions = ({ apiErrorMessage, modelIdErrorMessage }: ApiOptionsProps) =
value={apiConfiguration?.apiKey || ""} value={apiConfiguration?.apiKey || ""}
style={{ width: "100%" }} style={{ width: "100%" }}
type="password" type="password"
onChange={handleInputChange("apiKey")} onInput={handleInputChange("apiKey")}
placeholder="Enter API Key..."> placeholder="Enter API Key...">
<span style={{ fontWeight: 500 }}>Anthropic API Key</span> <span style={{ fontWeight: 500 }}>Anthropic API Key</span>
</VSCodeTextField> </VSCodeTextField>
@@ -181,7 +181,7 @@ const ApiOptions = ({ apiErrorMessage, modelIdErrorMessage }: ApiOptionsProps) =
value={apiConfiguration?.anthropicBaseUrl || ""} value={apiConfiguration?.anthropicBaseUrl || ""}
style={{ width: "100%", marginTop: 3 }} style={{ width: "100%", marginTop: 3 }}
type="url" type="url"
onChange={handleInputChange("anthropicBaseUrl")} onInput={handleInputChange("anthropicBaseUrl")}
placeholder="Default: https://api.anthropic.com" placeholder="Default: https://api.anthropic.com"
/> />
)} )}
@@ -210,7 +210,7 @@ const ApiOptions = ({ apiErrorMessage, modelIdErrorMessage }: ApiOptionsProps) =
value={apiConfiguration?.glamaApiKey || ""} value={apiConfiguration?.glamaApiKey || ""}
style={{ width: "100%" }} style={{ width: "100%" }}
type="password" type="password"
onChange={handleInputChange("glamaApiKey")} onInput={handleInputChange("glamaApiKey")}
placeholder="Enter API Key..."> placeholder="Enter API Key...">
<span style={{ fontWeight: 500 }}>Glama API Key</span> <span style={{ fontWeight: 500 }}>Glama API Key</span>
</VSCodeTextField> </VSCodeTextField>
@@ -239,7 +239,7 @@ const ApiOptions = ({ apiErrorMessage, modelIdErrorMessage }: ApiOptionsProps) =
value={apiConfiguration?.openAiNativeApiKey || ""} value={apiConfiguration?.openAiNativeApiKey || ""}
style={{ width: "100%" }} style={{ width: "100%" }}
type="password" type="password"
onChange={handleInputChange("openAiNativeApiKey")} onInput={handleInputChange("openAiNativeApiKey")}
placeholder="Enter API Key..."> placeholder="Enter API Key...">
<span style={{ fontWeight: 500 }}>OpenAI API Key</span> <span style={{ fontWeight: 500 }}>OpenAI API Key</span>
</VSCodeTextField> </VSCodeTextField>
@@ -267,7 +267,7 @@ const ApiOptions = ({ apiErrorMessage, modelIdErrorMessage }: ApiOptionsProps) =
value={apiConfiguration?.mistralApiKey || ""} value={apiConfiguration?.mistralApiKey || ""}
style={{ width: "100%" }} style={{ width: "100%" }}
type="password" type="password"
onChange={handleInputChange("mistralApiKey")} onInput={handleInputChange("mistralApiKey")}
placeholder="Enter API Key..."> placeholder="Enter API Key...">
<span style={{ fontWeight: 500 }}>Mistral API Key</span> <span style={{ fontWeight: 500 }}>Mistral API Key</span>
</VSCodeTextField> </VSCodeTextField>
@@ -298,7 +298,7 @@ const ApiOptions = ({ apiErrorMessage, modelIdErrorMessage }: ApiOptionsProps) =
value={apiConfiguration?.openRouterApiKey || ""} value={apiConfiguration?.openRouterApiKey || ""}
style={{ width: "100%" }} style={{ width: "100%" }}
type="password" type="password"
onChange={handleInputChange("openRouterApiKey")} onInput={handleInputChange("openRouterApiKey")}
placeholder="Enter API Key..."> placeholder="Enter API Key...">
<span style={{ fontWeight: 500 }}>OpenRouter API Key</span> <span style={{ fontWeight: 500 }}>OpenRouter API Key</span>
</VSCodeTextField> </VSCodeTextField>
@@ -344,7 +344,7 @@ const ApiOptions = ({ apiErrorMessage, modelIdErrorMessage }: ApiOptionsProps) =
value={apiConfiguration?.awsAccessKey || ""} value={apiConfiguration?.awsAccessKey || ""}
style={{ width: "100%" }} style={{ width: "100%" }}
type="password" type="password"
onChange={handleInputChange("awsAccessKey")} onInput={handleInputChange("awsAccessKey")}
placeholder="Enter Access Key..."> placeholder="Enter Access Key...">
<span style={{ fontWeight: 500 }}>AWS Access Key</span> <span style={{ fontWeight: 500 }}>AWS Access Key</span>
</VSCodeTextField> </VSCodeTextField>
@@ -352,7 +352,7 @@ const ApiOptions = ({ apiErrorMessage, modelIdErrorMessage }: ApiOptionsProps) =
value={apiConfiguration?.awsSecretKey || ""} value={apiConfiguration?.awsSecretKey || ""}
style={{ width: "100%" }} style={{ width: "100%" }}
type="password" type="password"
onChange={handleInputChange("awsSecretKey")} onInput={handleInputChange("awsSecretKey")}
placeholder="Enter Secret Key..."> placeholder="Enter Secret Key...">
<span style={{ fontWeight: 500 }}>AWS Secret Key</span> <span style={{ fontWeight: 500 }}>AWS Secret Key</span>
</VSCodeTextField> </VSCodeTextField>
@@ -360,7 +360,7 @@ const ApiOptions = ({ apiErrorMessage, modelIdErrorMessage }: ApiOptionsProps) =
value={apiConfiguration?.awsSessionToken || ""} value={apiConfiguration?.awsSessionToken || ""}
style={{ width: "100%" }} style={{ width: "100%" }}
type="password" type="password"
onChange={handleInputChange("awsSessionToken")} onInput={handleInputChange("awsSessionToken")}
placeholder="Enter Session Token..."> placeholder="Enter Session Token...">
<span style={{ fontWeight: 500 }}>AWS Session Token</span> <span style={{ fontWeight: 500 }}>AWS Session Token</span>
</VSCodeTextField> </VSCodeTextField>
@@ -426,7 +426,7 @@ const ApiOptions = ({ apiErrorMessage, modelIdErrorMessage }: ApiOptionsProps) =
<VSCodeTextField <VSCodeTextField
value={apiConfiguration?.vertexProjectId || ""} value={apiConfiguration?.vertexProjectId || ""}
style={{ width: "100%" }} style={{ width: "100%" }}
onChange={handleInputChange("vertexProjectId")} onInput={handleInputChange("vertexProjectId")}
placeholder="Enter Project ID..."> placeholder="Enter Project ID...">
<span style={{ fontWeight: 500 }}>Google Cloud Project ID</span> <span style={{ fontWeight: 500 }}>Google Cloud Project ID</span>
</VSCodeTextField> </VSCodeTextField>
@@ -484,7 +484,7 @@ const ApiOptions = ({ apiErrorMessage, modelIdErrorMessage }: ApiOptionsProps) =
value={apiConfiguration?.geminiApiKey || ""} value={apiConfiguration?.geminiApiKey || ""}
style={{ width: "100%" }} style={{ width: "100%" }}
type="password" type="password"
onChange={handleInputChange("geminiApiKey")} onInput={handleInputChange("geminiApiKey")}
placeholder="Enter API Key..."> placeholder="Enter API Key...">
<span style={{ fontWeight: 500 }}>Gemini API Key</span> <span style={{ fontWeight: 500 }}>Gemini API Key</span>
</VSCodeTextField> </VSCodeTextField>
@@ -512,7 +512,7 @@ const ApiOptions = ({ apiErrorMessage, modelIdErrorMessage }: ApiOptionsProps) =
value={apiConfiguration?.openAiBaseUrl || ""} value={apiConfiguration?.openAiBaseUrl || ""}
style={{ width: "100%" }} style={{ width: "100%" }}
type="url" type="url"
onChange={handleInputChange("openAiBaseUrl")} onInput={handleInputChange("openAiBaseUrl")}
placeholder={"Enter base URL..."}> placeholder={"Enter base URL..."}>
<span style={{ fontWeight: 500 }}>Base URL</span> <span style={{ fontWeight: 500 }}>Base URL</span>
</VSCodeTextField> </VSCodeTextField>
@@ -520,7 +520,7 @@ const ApiOptions = ({ apiErrorMessage, modelIdErrorMessage }: ApiOptionsProps) =
value={apiConfiguration?.openAiApiKey || ""} value={apiConfiguration?.openAiApiKey || ""}
style={{ width: "100%" }} style={{ width: "100%" }}
type="password" type="password"
onChange={handleInputChange("openAiApiKey")} onInput={handleInputChange("openAiApiKey")}
placeholder="Enter API Key..."> placeholder="Enter API Key...">
<span style={{ fontWeight: 500 }}>API Key</span> <span style={{ fontWeight: 500 }}>API Key</span>
</VSCodeTextField> </VSCodeTextField>
@@ -563,7 +563,7 @@ const ApiOptions = ({ apiErrorMessage, modelIdErrorMessage }: ApiOptionsProps) =
<VSCodeTextField <VSCodeTextField
value={apiConfiguration?.azureApiVersion || ""} value={apiConfiguration?.azureApiVersion || ""}
style={{ width: "100%", marginTop: 3 }} style={{ width: "100%", marginTop: 3 }}
onChange={handleInputChange("azureApiVersion")} onInput={handleInputChange("azureApiVersion")}
placeholder={`Default: ${azureOpenAiDefaultApiVersion}`} placeholder={`Default: ${azureOpenAiDefaultApiVersion}`}
/> />
)} )}
@@ -1013,14 +1013,14 @@ const ApiOptions = ({ apiErrorMessage, modelIdErrorMessage }: ApiOptionsProps) =
value={apiConfiguration?.lmStudioBaseUrl || ""} value={apiConfiguration?.lmStudioBaseUrl || ""}
style={{ width: "100%" }} style={{ width: "100%" }}
type="url" type="url"
onChange={handleInputChange("lmStudioBaseUrl")} onInput={handleInputChange("lmStudioBaseUrl")}
placeholder={"Default: http://localhost:1234"}> placeholder={"Default: http://localhost:1234"}>
<span style={{ fontWeight: 500 }}>Base URL (optional)</span> <span style={{ fontWeight: 500 }}>Base URL (optional)</span>
</VSCodeTextField> </VSCodeTextField>
<VSCodeTextField <VSCodeTextField
value={apiConfiguration?.lmStudioModelId || ""} value={apiConfiguration?.lmStudioModelId || ""}
style={{ width: "100%" }} style={{ width: "100%" }}
onChange={handleInputChange("lmStudioModelId")} onInput={handleInputChange("lmStudioModelId")}
placeholder={"e.g. meta-llama-3.1-8b-instruct"}> placeholder={"e.g. meta-llama-3.1-8b-instruct"}>
<span style={{ fontWeight: 500 }}>Model ID</span> <span style={{ fontWeight: 500 }}>Model ID</span>
</VSCodeTextField> </VSCodeTextField>
@@ -1082,7 +1082,7 @@ const ApiOptions = ({ apiErrorMessage, modelIdErrorMessage }: ApiOptionsProps) =
value={apiConfiguration?.deepSeekApiKey || ""} value={apiConfiguration?.deepSeekApiKey || ""}
style={{ width: "100%" }} style={{ width: "100%" }}
type="password" type="password"
onChange={handleInputChange("deepSeekApiKey")} onInput={handleInputChange("deepSeekApiKey")}
placeholder="Enter API Key..."> placeholder="Enter API Key...">
<span style={{ fontWeight: 500 }}>DeepSeek API Key</span> <span style={{ fontWeight: 500 }}>DeepSeek API Key</span>
</VSCodeTextField> </VSCodeTextField>
@@ -1172,14 +1172,14 @@ const ApiOptions = ({ apiErrorMessage, modelIdErrorMessage }: ApiOptionsProps) =
value={apiConfiguration?.ollamaBaseUrl || ""} value={apiConfiguration?.ollamaBaseUrl || ""}
style={{ width: "100%" }} style={{ width: "100%" }}
type="url" type="url"
onChange={handleInputChange("ollamaBaseUrl")} onInput={handleInputChange("ollamaBaseUrl")}
placeholder={"Default: http://localhost:11434"}> placeholder={"Default: http://localhost:11434"}>
<span style={{ fontWeight: 500 }}>Base URL (optional)</span> <span style={{ fontWeight: 500 }}>Base URL (optional)</span>
</VSCodeTextField> </VSCodeTextField>
<VSCodeTextField <VSCodeTextField
value={apiConfiguration?.ollamaModelId || ""} value={apiConfiguration?.ollamaModelId || ""}
style={{ width: "100%" }} style={{ width: "100%" }}
onChange={handleInputChange("ollamaModelId")} onInput={handleInputChange("ollamaModelId")}
placeholder={"e.g. llama3.1"}> placeholder={"e.g. llama3.1"}>
<span style={{ fontWeight: 500 }}>Model ID</span> <span style={{ fontWeight: 500 }}>Model ID</span>
</VSCodeTextField> </VSCodeTextField>

View File

@@ -167,17 +167,8 @@ const GlamaModelPicker: React.FC = () => {
placeholder="Search and select a model..." placeholder="Search and select a model..."
value={searchTerm} value={searchTerm}
onInput={(e) => { onInput={(e) => {
const newModelId = (e.target as HTMLInputElement)?.value?.toLowerCase()
const apiConfig = {
...apiConfiguration,
openAiModelId: newModelId,
}
setApiConfiguration(apiConfig)
setSearchTerm(newModelId)
setIsDropdownVisible(true)
}}
onChange={(e) => {
handleModelChange((e.target as HTMLInputElement)?.value?.toLowerCase()) handleModelChange((e.target as HTMLInputElement)?.value?.toLowerCase())
setIsDropdownVisible(true)
}} }}
onFocus={() => setIsDropdownVisible(true)} onFocus={() => setIsDropdownVisible(true)}
onKeyDown={handleKeyDown} onKeyDown={handleKeyDown}

View File

@@ -159,17 +159,8 @@ const OpenAiModelPicker: React.FC = () => {
placeholder="Search and select a model..." placeholder="Search and select a model..."
value={searchTerm} value={searchTerm}
onInput={(e) => { onInput={(e) => {
const newModelId = (e.target as HTMLInputElement)?.value?.toLowerCase()
const apiConfig = {
...apiConfiguration,
openAiModelId: newModelId,
}
setApiConfiguration(apiConfig)
setSearchTerm(newModelId)
setIsDropdownVisible(true)
}}
onChange={(e) => {
handleModelChange((e.target as HTMLInputElement)?.value?.toLowerCase()) handleModelChange((e.target as HTMLInputElement)?.value?.toLowerCase())
setIsDropdownVisible(true)
}} }}
onFocus={() => setIsDropdownVisible(true)} onFocus={() => setIsDropdownVisible(true)}
onKeyDown={handleKeyDown} onKeyDown={handleKeyDown}

View File

@@ -167,17 +167,8 @@ const OpenRouterModelPicker: React.FC = () => {
placeholder="Search and select a model..." placeholder="Search and select a model..."
value={searchTerm} value={searchTerm}
onInput={(e) => { onInput={(e) => {
const newModelId = (e.target as HTMLInputElement)?.value?.toLowerCase()
const apiConfig = {
...apiConfiguration,
openAiModelId: newModelId,
}
setApiConfiguration(apiConfig)
setSearchTerm(newModelId)
setIsDropdownVisible(true)
}}
onChange={(e) => {
handleModelChange((e.target as HTMLInputElement)?.value?.toLowerCase()) handleModelChange((e.target as HTMLInputElement)?.value?.toLowerCase())
setIsDropdownVisible(true)
}} }}
onFocus={() => setIsDropdownVisible(true)} onFocus={() => setIsDropdownVisible(true)}
onKeyDown={handleKeyDown} onKeyDown={handleKeyDown}