mirror of
https://github.com/pacnpal/Roo-Code.git
synced 2025-12-20 04:11:10 -05:00
fix ui and some error my has
This commit is contained in:
sam hoang
@@ -166,7 +166,11 @@ const ApiOptions = ({ apiErrorMessage, modelIdErrorMessage }: ApiOptionsProps) =
|
|||||||
onChange={(checked: boolean) => {
|
onChange={(checked: boolean) => {
|
||||||
setAnthropicBaseUrlSelected(checked)
|
setAnthropicBaseUrlSelected(checked)
|
||||||
if (!checked) {
|
if (!checked) {
|
||||||
setApiConfiguration({ ...apiConfiguration, anthropicBaseUrl: "" })
|
handleInputChange("anthropicBaseUrl")({
|
||||||
|
target: {
|
||||||
|
value: "",
|
||||||
|
},
|
||||||
|
})
|
||||||
}
|
}
|
||||||
}}>
|
}}>
|
||||||
Use custom base URL
|
Use custom base URL
|
||||||
@@ -537,7 +541,11 @@ const ApiOptions = ({ apiErrorMessage, modelIdErrorMessage }: ApiOptionsProps) =
|
|||||||
onChange={(checked: boolean) => {
|
onChange={(checked: boolean) => {
|
||||||
setAzureApiVersionSelected(checked)
|
setAzureApiVersionSelected(checked)
|
||||||
if (!checked) {
|
if (!checked) {
|
||||||
setApiConfiguration({ ...apiConfiguration, azureApiVersion: "" })
|
handleInputChange("azureApiVersion")({
|
||||||
|
target: {
|
||||||
|
value: "",
|
||||||
|
},
|
||||||
|
})
|
||||||
}
|
}
|
||||||
}}>
|
}}>
|
||||||
Set Azure API version
|
Set Azure API version
|
||||||
@@ -552,31 +560,47 @@ const ApiOptions = ({ apiErrorMessage, modelIdErrorMessage }: ApiOptionsProps) =
|
|||||||
)}
|
)}
|
||||||
|
|
||||||
{/* Model Info Configuration */}
|
{/* Model Info Configuration */}
|
||||||
<div style={{ marginTop: 15, padding: 10, border: '1px solid var(--vscode-input-border)', borderRadius: 4 }}>
|
<div
|
||||||
|
style={{
|
||||||
|
marginTop: 15,
|
||||||
|
padding: 10,
|
||||||
|
border: "1px solid var(--vscode-input-border)",
|
||||||
|
borderRadius: 4,
|
||||||
|
}}>
|
||||||
<div style={{ marginBottom: 10 }}>
|
<div style={{ marginBottom: 10 }}>
|
||||||
<span style={{ fontWeight: 500, fontSize: '14px' }}>Model Configuration</span>
|
<span style={{ fontWeight: 500, fontSize: "14px" }}>Model Configuration</span>
|
||||||
<p style={{ fontSize: '12px', color: 'var(--vscode-descriptionForeground)', margin: '5px 0' }}>
|
<p
|
||||||
|
style={{
|
||||||
|
fontSize: "12px",
|
||||||
|
color: "var(--vscode-descriptionForeground)",
|
||||||
|
margin: "5px 0",
|
||||||
|
}}>
|
||||||
Configure the capabilities and pricing for your custom OpenAI-compatible model
|
Configure the capabilities and pricing for your custom OpenAI-compatible model
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* Capabilities Section */}
|
{/* Capabilities Section */}
|
||||||
<div style={{ marginBottom: 15 }}>
|
<div style={{ marginBottom: 15 }}>
|
||||||
<span style={{ fontWeight: 500, fontSize: '12px', color: 'var(--vscode-descriptionForeground)' }}>Capabilities</span>
|
|
||||||
<div style={{ display: "flex", flexDirection: "column", gap: 8, marginTop: 5 }}>
|
<div style={{ display: "flex", flexDirection: "column", gap: 8, marginTop: 5 }}>
|
||||||
<VSCodeTextField
|
<VSCodeTextField
|
||||||
value={apiConfiguration?.openAiCusModelInfo?.maxTokens?.toString() || openAiModelInfoSaneDefaults.maxTokens?.toString() || ""}
|
value={
|
||||||
|
apiConfiguration?.openAiCusModelInfo?.maxTokens?.toString() ||
|
||||||
|
openAiModelInfoSaneDefaults.maxTokens?.toString() ||
|
||||||
|
""
|
||||||
|
}
|
||||||
type="text"
|
type="text"
|
||||||
style={{ width: "100%" }}
|
style={{ width: "100%" }}
|
||||||
title="Maximum number of tokens the model can generate in a single response"
|
title="Maximum number of tokens the model can generate in a single response"
|
||||||
onInput={(e: any) => {
|
onInput={(e: any) => {
|
||||||
const value = parseInt(e.target.value)
|
const value = parseInt(e.target.value)
|
||||||
setApiConfiguration({
|
handleInputChange("openAiCusModelInfo")({
|
||||||
...apiConfiguration,
|
target: {
|
||||||
openAiCusModelInfo: {
|
value: {
|
||||||
...(apiConfiguration?.openAiCusModelInfo || openAiModelInfoSaneDefaults),
|
...(apiConfiguration?.openAiCusModelInfo ||
|
||||||
maxTokens: isNaN(value) ? undefined : value
|
openAiModelInfoSaneDefaults),
|
||||||
}
|
maxTokens: isNaN(value) ? undefined : value,
|
||||||
|
},
|
||||||
|
},
|
||||||
})
|
})
|
||||||
}}
|
}}
|
||||||
placeholder="e.g. 4096">
|
placeholder="e.g. 4096">
|
||||||
@@ -584,18 +608,29 @@ const ApiOptions = ({ apiErrorMessage, modelIdErrorMessage }: ApiOptionsProps) =
|
|||||||
</VSCodeTextField>
|
</VSCodeTextField>
|
||||||
|
|
||||||
<VSCodeTextField
|
<VSCodeTextField
|
||||||
value={apiConfiguration?.openAiCusModelInfo?.contextWindow?.toString() || openAiModelInfoSaneDefaults.contextWindow?.toString() || ""}
|
value={
|
||||||
|
apiConfiguration?.openAiCusModelInfo?.contextWindow?.toString() ||
|
||||||
|
openAiModelInfoSaneDefaults.contextWindow?.toString() ||
|
||||||
|
""
|
||||||
|
}
|
||||||
type="text"
|
type="text"
|
||||||
style={{ width: "100%" }}
|
style={{ width: "100%" }}
|
||||||
title="Total number of tokens (input + output) the model can process in a single request"
|
title="Total number of tokens (input + output) the model can process in a single request"
|
||||||
onInput={(e: any) => {
|
onInput={(e: any) => {
|
||||||
const parsed = parseInt(e.target.value)
|
const parsed = parseInt(e.target.value)
|
||||||
setApiConfiguration({
|
handleInputChange("openAiCusModelInfo")({
|
||||||
...apiConfiguration,
|
target: {
|
||||||
openAiCusModelInfo: {
|
value: {
|
||||||
...(apiConfiguration?.openAiCusModelInfo || openAiModelInfoSaneDefaults),
|
...(apiConfiguration?.openAiCusModelInfo ||
|
||||||
contextWindow: e.target.value === "" ? undefined : (isNaN(parsed) ? openAiModelInfoSaneDefaults.contextWindow : parsed)
|
openAiModelInfoSaneDefaults),
|
||||||
}
|
contextWindow:
|
||||||
|
e.target.value === ""
|
||||||
|
? undefined
|
||||||
|
: isNaN(parsed)
|
||||||
|
? openAiModelInfoSaneDefaults.contextWindow
|
||||||
|
: parsed,
|
||||||
|
},
|
||||||
|
},
|
||||||
})
|
})
|
||||||
}}
|
}}
|
||||||
placeholder="e.g. 128000">
|
placeholder="e.g. 128000">
|
||||||
@@ -603,58 +638,83 @@ const ApiOptions = ({ apiErrorMessage, modelIdErrorMessage }: ApiOptionsProps) =
|
|||||||
</VSCodeTextField>
|
</VSCodeTextField>
|
||||||
|
|
||||||
<div style={{ display: "flex", gap: 20, marginTop: 5 }}>
|
<div style={{ display: "flex", gap: 20, marginTop: 5 }}>
|
||||||
<VSCodeCheckbox
|
<Checkbox
|
||||||
checked={apiConfiguration?.openAiCusModelInfo?.supportsImages ?? openAiModelInfoSaneDefaults.supportsImages}
|
checked={
|
||||||
|
apiConfiguration?.openAiCusModelInfo?.supportsImages ??
|
||||||
|
openAiModelInfoSaneDefaults.supportsImages
|
||||||
|
}
|
||||||
title="Enable if the model can process and understand images in the input"
|
title="Enable if the model can process and understand images in the input"
|
||||||
onChange={(e: any) => {
|
onChange={(checked: boolean) => {
|
||||||
setApiConfiguration({
|
handleInputChange("openAiCusModelInfo")({
|
||||||
...apiConfiguration,
|
target: {
|
||||||
openAiCusModelInfo: {
|
value: {
|
||||||
...(apiConfiguration?.openAiCusModelInfo || openAiModelInfoSaneDefaults),
|
...(apiConfiguration?.openAiCusModelInfo ||
|
||||||
supportsImages: e.target.checked
|
openAiModelInfoSaneDefaults),
|
||||||
}
|
supportsImages: checked,
|
||||||
|
},
|
||||||
|
},
|
||||||
})
|
})
|
||||||
}}>
|
}}>
|
||||||
Supports Images
|
Supports Images
|
||||||
</VSCodeCheckbox>
|
</Checkbox>
|
||||||
|
|
||||||
<VSCodeCheckbox
|
<Checkbox
|
||||||
checked={apiConfiguration?.openAiCusModelInfo?.supportsComputerUse ?? false}
|
checked={apiConfiguration?.openAiCusModelInfo?.supportsComputerUse ?? false}
|
||||||
title="Enable if the model can interact with the computer (execute commands, modify files, etc.)"
|
title="Enable if the model can interact with the computer (execute commands, modify files, etc.)"
|
||||||
onChange={(e: any) => {
|
onChange={(checked: boolean) => {
|
||||||
setApiConfiguration({
|
handleInputChange("openAiCusModelInfo")({
|
||||||
...apiConfiguration,
|
target: {
|
||||||
openAiCusModelInfo: {
|
value: {
|
||||||
...(apiConfiguration?.openAiCusModelInfo || openAiModelInfoSaneDefaults),
|
...(apiConfiguration?.openAiCusModelInfo ||
|
||||||
supportsComputerUse: e.target.checked
|
openAiModelInfoSaneDefaults),
|
||||||
}
|
supportsComputerUse: checked,
|
||||||
|
},
|
||||||
|
},
|
||||||
})
|
})
|
||||||
}}>
|
}}>
|
||||||
Supports Computer Use
|
Supports Computer Use
|
||||||
</VSCodeCheckbox>
|
</Checkbox>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* Pricing Section */}
|
{/* Pricing Section */}
|
||||||
<div>
|
<div>
|
||||||
<span style={{ fontWeight: 500, fontSize: '12px', color: 'var(--vscode-descriptionForeground)' }}>Pricing (USD per million tokens)</span>
|
<span
|
||||||
|
style={{
|
||||||
|
fontWeight: 500,
|
||||||
|
fontSize: "12px",
|
||||||
|
color: "var(--vscode-descriptionForeground)",
|
||||||
|
}}>
|
||||||
|
Pricing (USD per million tokens)
|
||||||
|
</span>
|
||||||
<div style={{ display: "flex", flexDirection: "column", gap: 8, marginTop: 5 }}>
|
<div style={{ display: "flex", flexDirection: "column", gap: 8, marginTop: 5 }}>
|
||||||
{/* Input/Output Prices */}
|
{/* Input/Output Prices */}
|
||||||
<div style={{ display: "flex", gap: 10 }}>
|
<div style={{ display: "flex", gap: 10 }}>
|
||||||
<VSCodeTextField
|
<VSCodeTextField
|
||||||
value={apiConfiguration?.openAiCusModelInfo?.inputPrice?.toString() || openAiModelInfoSaneDefaults.inputPrice?.toString() || ""}
|
value={
|
||||||
|
apiConfiguration?.openAiCusModelInfo?.inputPrice?.toString() ??
|
||||||
|
openAiModelInfoSaneDefaults.inputPrice?.toString() ??
|
||||||
|
""
|
||||||
|
}
|
||||||
type="text"
|
type="text"
|
||||||
style={{ width: "100%" }}
|
style={{ width: "100%" }}
|
||||||
title="Cost per million tokens in the input/prompt"
|
title="Cost per million tokens in the input/prompt"
|
||||||
onChange={(e: any) => {
|
onChange={(e: any) => {
|
||||||
const parsed = parseFloat(e.target.value)
|
const parsed = parseFloat(e.target.value)
|
||||||
setApiConfiguration({
|
handleInputChange("openAiCusModelInfo")({
|
||||||
...apiConfiguration,
|
target: {
|
||||||
openAiCusModelInfo: {
|
value: {
|
||||||
...(apiConfiguration?.openAiCusModelInfo || openAiModelInfoSaneDefaults),
|
...(apiConfiguration?.openAiCusModelInfo ??
|
||||||
inputPrice: e.target.value === "" ? undefined : (isNaN(parsed) ? openAiModelInfoSaneDefaults.inputPrice : parsed)
|
openAiModelInfoSaneDefaults),
|
||||||
}
|
inputPrice:
|
||||||
|
e.target.value === ""
|
||||||
|
? undefined
|
||||||
|
: isNaN(parsed)
|
||||||
|
? openAiModelInfoSaneDefaults.inputPrice
|
||||||
|
: parsed,
|
||||||
|
},
|
||||||
|
},
|
||||||
})
|
})
|
||||||
}}
|
}}
|
||||||
placeholder="e.g. 0.0001">
|
placeholder="e.g. 0.0001">
|
||||||
@@ -662,71 +722,40 @@ const ApiOptions = ({ apiErrorMessage, modelIdErrorMessage }: ApiOptionsProps) =
|
|||||||
</VSCodeTextField>
|
</VSCodeTextField>
|
||||||
|
|
||||||
<VSCodeTextField
|
<VSCodeTextField
|
||||||
value={apiConfiguration?.openAiCusModelInfo?.outputPrice?.toString() || openAiModelInfoSaneDefaults.outputPrice?.toString() || ""}
|
value={
|
||||||
|
apiConfiguration?.openAiCusModelInfo?.outputPrice?.toString() ||
|
||||||
|
openAiModelInfoSaneDefaults.outputPrice?.toString() ||
|
||||||
|
""
|
||||||
|
}
|
||||||
type="text"
|
type="text"
|
||||||
style={{ width: "100%" }}
|
style={{ width: "100%" }}
|
||||||
title="Cost per million tokens in the model's response"
|
title="Cost per million tokens in the model's response"
|
||||||
onChange={(e: any) => {
|
onChange={(e: any) => {
|
||||||
const parsed = parseFloat(e.target.value)
|
const parsed = parseFloat(e.target.value)
|
||||||
setApiConfiguration({
|
handleInputChange("openAiCusModelInfo")({
|
||||||
...apiConfiguration,
|
target: {
|
||||||
openAiCusModelInfo: {
|
value: {
|
||||||
...(apiConfiguration?.openAiCusModelInfo || openAiModelInfoSaneDefaults),
|
...(apiConfiguration?.openAiCusModelInfo ||
|
||||||
outputPrice: e.target.value === "" ? undefined : (isNaN(parsed) ? openAiModelInfoSaneDefaults.outputPrice : parsed)
|
openAiModelInfoSaneDefaults),
|
||||||
}
|
outputPrice:
|
||||||
|
e.target.value === ""
|
||||||
|
? undefined
|
||||||
|
: isNaN(parsed)
|
||||||
|
? openAiModelInfoSaneDefaults.outputPrice
|
||||||
|
: parsed,
|
||||||
|
},
|
||||||
|
},
|
||||||
})
|
})
|
||||||
}}
|
}}
|
||||||
placeholder="e.g. 0.0002">
|
placeholder="e.g. 0.0002">
|
||||||
<span style={{ fontWeight: 500 }}>Output Price</span>
|
<span style={{ fontWeight: 500 }}>Output Price</span>
|
||||||
</VSCodeTextField>
|
</VSCodeTextField>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* Cache Prices */}
|
|
||||||
<div style={{ display: "flex", gap: 10 }}>
|
|
||||||
<VSCodeTextField
|
|
||||||
value={apiConfiguration?.openAiCusModelInfo?.cacheWritesPrice?.toString() || openAiModelInfoSaneDefaults.cacheWritesPrice?.toString() || ""}
|
|
||||||
type="text"
|
|
||||||
style={{ width: "100%" }}
|
|
||||||
title="Cost per million tokens when writing to the prompt cache"
|
|
||||||
onChange={(e: any) => {
|
|
||||||
const parsed = parseFloat(e.target.value)
|
|
||||||
setApiConfiguration({
|
|
||||||
...apiConfiguration,
|
|
||||||
openAiCusModelInfo: {
|
|
||||||
...(apiConfiguration?.openAiCusModelInfo || openAiModelInfoSaneDefaults),
|
|
||||||
cacheWritesPrice: e.target.value === "" ? undefined : (isNaN(parsed) ? openAiModelInfoSaneDefaults.cacheWritesPrice : parsed)
|
|
||||||
}
|
|
||||||
})
|
|
||||||
}}
|
|
||||||
placeholder="e.g. 0.0001">
|
|
||||||
<span style={{ fontWeight: 500 }}>Cache Write Price</span>
|
|
||||||
</VSCodeTextField>
|
|
||||||
|
|
||||||
<VSCodeTextField
|
|
||||||
value={apiConfiguration?.openAiCusModelInfo?.cacheReadsPrice?.toString() || openAiModelInfoSaneDefaults.cacheReadsPrice?.toString() || ""}
|
|
||||||
type="text"
|
|
||||||
style={{ width: "100%" }}
|
|
||||||
title="Cost per million tokens when reading from the prompt cache"
|
|
||||||
onChange={(e: any) => {
|
|
||||||
const parsed = parseFloat(e.target.value)
|
|
||||||
setApiConfiguration({
|
|
||||||
...apiConfiguration,
|
|
||||||
openAiCusModelInfo: {
|
|
||||||
...(apiConfiguration?.openAiCusModelInfo || openAiModelInfoSaneDefaults),
|
|
||||||
cacheReadsPrice: e.target.value === "" ? undefined : (isNaN(parsed) ? openAiModelInfoSaneDefaults.cacheReadsPrice : parsed)
|
|
||||||
}
|
|
||||||
})
|
|
||||||
}}
|
|
||||||
placeholder="e.g. 0.00001">
|
|
||||||
<span style={{ fontWeight: 500 }}>Cache Read Price</span>
|
|
||||||
</VSCodeTextField>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{ /* TODO: model info here */}
|
{/* TODO: model info here */}
|
||||||
|
|
||||||
|
|
||||||
<p
|
<p
|
||||||
style={{
|
style={{
|
||||||
|
|||||||
Reference in New Issue
Block a user