feat: openrouter byok support through /connect (#735)
This commit is contained in:
@@ -28,7 +28,7 @@ type ViewState =
|
||||
| { type: "profileSelect"; provider: ByokProvider }
|
||||
| { type: "options"; provider: ByokProvider; providerId: string };
|
||||
|
||||
type ValidationState = "idle" | "validating" | "valid" | "invalid";
|
||||
type ValidationState = "idle" | "validating" | "valid" | "invalid" | "saving";
|
||||
|
||||
interface ProviderSelectorProps {
|
||||
onCancel: () => void;
|
||||
@@ -219,6 +219,7 @@ export function ProviderSelector({
|
||||
|
||||
// If already validated, save
|
||||
if (validationState === "valid") {
|
||||
setValidationState("saving");
|
||||
try {
|
||||
await createOrUpdateProvider(
|
||||
provider.providerType,
|
||||
@@ -285,6 +286,7 @@ export function ProviderSelector({
|
||||
|
||||
// If already validated, save
|
||||
if (validationState === "valid") {
|
||||
setValidationState("saving");
|
||||
try {
|
||||
await createOrUpdateProvider(
|
||||
provider.providerType,
|
||||
@@ -603,11 +605,13 @@ export function ProviderSelector({
|
||||
const statusText =
|
||||
validationState === "validating"
|
||||
? " (validating...)"
|
||||
: validationState === "valid"
|
||||
? " (key validated!)"
|
||||
: validationState === "invalid"
|
||||
? ` (invalid key${validationError ? `: ${validationError}` : ""})`
|
||||
: "";
|
||||
: validationState === "saving"
|
||||
? " (saving & syncing models...)"
|
||||
: validationState === "valid"
|
||||
? " (key validated!)"
|
||||
: validationState === "invalid"
|
||||
? ` (invalid key${validationError ? `: ${validationError}` : ""})`
|
||||
: "";
|
||||
|
||||
const statusColor =
|
||||
validationState === "valid"
|
||||
@@ -617,9 +621,11 @@ export function ProviderSelector({
|
||||
: undefined;
|
||||
|
||||
const footerText =
|
||||
validationState === "valid"
|
||||
? "Enter to save · Esc cancel"
|
||||
: "Enter to validate · Esc cancel";
|
||||
validationState === "saving"
|
||||
? "Saving provider..."
|
||||
: validationState === "valid"
|
||||
? "Enter to save · Esc cancel"
|
||||
: "Enter to validate · Esc cancel";
|
||||
|
||||
return (
|
||||
<>
|
||||
@@ -632,7 +638,12 @@ export function ProviderSelector({
|
||||
<Box flexDirection="row">
|
||||
<Text color={colors.selector.itemHighlighted}>{"> "}</Text>
|
||||
<Text>{apiKeyInput ? maskApiKey(apiKeyInput) : "(enter key)"}</Text>
|
||||
<Text color={statusColor} dimColor={validationState === "validating"}>
|
||||
<Text
|
||||
color={statusColor}
|
||||
dimColor={
|
||||
validationState === "validating" || validationState === "saving"
|
||||
}
|
||||
>
|
||||
{statusText}
|
||||
</Text>
|
||||
</Box>
|
||||
@@ -810,11 +821,13 @@ export function ProviderSelector({
|
||||
const statusText =
|
||||
validationState === "validating"
|
||||
? " (validating...)"
|
||||
: validationState === "valid"
|
||||
? " (credentials validated!)"
|
||||
: validationState === "invalid"
|
||||
? ` (invalid${validationError ? `: ${validationError}` : ""})`
|
||||
: "";
|
||||
: validationState === "saving"
|
||||
? " (saving & syncing models...)"
|
||||
: validationState === "valid"
|
||||
? " (credentials validated!)"
|
||||
: validationState === "invalid"
|
||||
? ` (invalid${validationError ? `: ${validationError}` : ""})`
|
||||
: "";
|
||||
|
||||
const statusColor =
|
||||
validationState === "valid"
|
||||
@@ -826,11 +839,13 @@ export function ProviderSelector({
|
||||
const hasAuthMethods = "authMethods" in provider && provider.authMethods;
|
||||
const escText = hasAuthMethods ? "Esc back" : "Esc cancel";
|
||||
const footerText =
|
||||
validationState === "valid"
|
||||
? `Enter to save · ${escText}`
|
||||
: allFilled
|
||||
? `Enter to validate · Tab/↑↓ navigate · ${escText}`
|
||||
: `Tab/↑↓ navigate · ${escText}`;
|
||||
validationState === "saving"
|
||||
? "Saving provider..."
|
||||
: validationState === "valid"
|
||||
? `Enter to save · ${escText}`
|
||||
: allFilled
|
||||
? `Enter to validate · Tab/↑↓ navigate · ${escText}`
|
||||
: `Tab/↑↓ navigate · ${escText}`;
|
||||
|
||||
// Build title - include auth method name if present
|
||||
const title = authMethod
|
||||
@@ -883,7 +898,9 @@ export function ProviderSelector({
|
||||
<Box marginTop={1}>
|
||||
<Text
|
||||
color={statusColor}
|
||||
dimColor={validationState === "validating"}
|
||||
dimColor={
|
||||
validationState === "validating" || validationState === "saving"
|
||||
}
|
||||
>
|
||||
{" "}
|
||||
{statusText}
|
||||
|
||||
Reference in New Issue
Block a user