feat: improve /connect command and /model selector UX (#665)
Co-authored-by: Letta <noreply@letta.com>
This commit is contained in:
Charles Packer
@@ -117,6 +117,7 @@ import { ModelSelector } from "./components/ModelSelector";
|
||||
import { NewAgentDialog } from "./components/NewAgentDialog";
|
||||
import { PendingApprovalStub } from "./components/PendingApprovalStub";
|
||||
import { PinDialog, validateAgentName } from "./components/PinDialog";
|
||||
import { ProviderSelector } from "./components/ProviderSelector";
|
||||
// QuestionDialog removed - now using InlineQuestionApproval
|
||||
import { ReasoningMessage } from "./components/ReasoningMessageRich";
|
||||
|
||||
@@ -978,6 +979,7 @@ export default function App({
|
||||
| "mcp-connect"
|
||||
| "help"
|
||||
| "hooks"
|
||||
| "connect"
|
||||
| null;
|
||||
const [activeOverlay, setActiveOverlay] = useState<ActiveOverlay>(null);
|
||||
const [feedbackPrefill, setFeedbackPrefill] = useState("");
|
||||
@@ -1053,6 +1055,40 @@ export default function App({
|
||||
: null;
|
||||
const currentModelProvider = llmConfig?.provider_name ?? null;
|
||||
|
||||
// Billing tier for conditional UI (fetched once on mount)
|
||||
const [billingTier, setBillingTier] = useState<string | null>(null);
|
||||
|
||||
// Fetch billing tier once on mount
|
||||
useEffect(() => {
|
||||
(async () => {
|
||||
try {
|
||||
const settings = settingsManager.getSettings();
|
||||
const baseURL =
|
||||
process.env.LETTA_BASE_URL ||
|
||||
settings.env?.LETTA_BASE_URL ||
|
||||
"https://api.letta.com";
|
||||
const apiKey = process.env.LETTA_API_KEY || settings.env?.LETTA_API_KEY;
|
||||
|
||||
const response = await fetch(`${baseURL}/v1/metadata/balance`, {
|
||||
headers: {
|
||||
"Content-Type": "application/json",
|
||||
Authorization: `Bearer ${apiKey}`,
|
||||
"X-Letta-Source": "letta-code",
|
||||
},
|
||||
});
|
||||
|
||||
if (response.ok) {
|
||||
const data = (await response.json()) as { billing_tier?: string };
|
||||
if (data.billing_tier) {
|
||||
setBillingTier(data.billing_tier);
|
||||
}
|
||||
}
|
||||
} catch {
|
||||
// Silently ignore - billing tier is optional context
|
||||
}
|
||||
})();
|
||||
}, []);
|
||||
|
||||
// Token streaming preference (can be toggled at runtime)
|
||||
const [tokenStreamingEnabled, setTokenStreamingEnabled] =
|
||||
useState(tokenStreaming);
|
||||
@@ -4707,11 +4743,14 @@ export default function App({
|
||||
return { submitted: true };
|
||||
}
|
||||
|
||||
// Special handling for /connect command - OAuth connection
|
||||
if (msg.trim().startsWith("/connect")) {
|
||||
// Handle all /connect commands through the unified handler
|
||||
// For codex: uses local ChatGPT OAuth server (no dialog needed)
|
||||
// For zai: requires API key as argument
|
||||
// Special handling for /connect command - opens provider selector
|
||||
if (msg.trim() === "/connect") {
|
||||
setActiveOverlay("connect");
|
||||
return { submitted: true };
|
||||
}
|
||||
|
||||
// /connect codex - direct OAuth flow (kept for backwards compatibility)
|
||||
if (msg.trim().startsWith("/connect codex")) {
|
||||
const { handleConnect } = await import("./commands/connect");
|
||||
await handleConnect(
|
||||
{
|
||||
@@ -9094,6 +9133,34 @@ Plan file path: ${planFilePath}`;
|
||||
onCancel={closeOverlay}
|
||||
filterProvider={modelSelectorOptions.filterProvider}
|
||||
forceRefresh={modelSelectorOptions.forceRefresh}
|
||||
billingTier={billingTier ?? undefined}
|
||||
/>
|
||||
)}
|
||||
|
||||
{/* Provider Selector - for connecting BYOK providers */}
|
||||
{activeOverlay === "connect" && (
|
||||
<ProviderSelector
|
||||
onCancel={closeOverlay}
|
||||
onStartOAuth={async () => {
|
||||
// Close selector and start OAuth flow
|
||||
closeOverlay();
|
||||
const { handleConnect } = await import("./commands/connect");
|
||||
await handleConnect(
|
||||
{
|
||||
buffersRef,
|
||||
refreshDerived,
|
||||
setCommandRunning,
|
||||
onCodexConnected: () => {
|
||||
setModelSelectorOptions({
|
||||
filterProvider: "chatgpt-plus-pro",
|
||||
forceRefresh: true,
|
||||
});
|
||||
setActiveOverlay("model");
|
||||
},
|
||||
},
|
||||
"/connect codex",
|
||||
);
|
||||
}}
|
||||
/>
|
||||
)}
|
||||
|
||||
|
||||
@@ -264,11 +264,11 @@ export const commands: Record<string, Command> = {
|
||||
|
||||
// === Session management (order 40-49) ===
|
||||
"/connect": {
|
||||
desc: "Connect an existing account (/connect codex or /connect zai <api-key>)",
|
||||
desc: "Connect your LLM API keys (OpenAI, Anthropic, etc.)",
|
||||
order: 40,
|
||||
handler: () => {
|
||||
// Handled specially in App.tsx
|
||||
return "Initiating account connection...";
|
||||
// Handled specially in App.tsx - opens ProviderSelector
|
||||
return "Opening provider connection...";
|
||||
},
|
||||
},
|
||||
"/disconnect": {
|
||||
|
||||
@@ -51,6 +51,7 @@ const InputFooter = memo(function InputFooter({
|
||||
agentName,
|
||||
currentModel,
|
||||
isOpenAICodexProvider,
|
||||
isByokProvider,
|
||||
isAutocompleteActive,
|
||||
}: {
|
||||
ctrlCPressed: boolean;
|
||||
@@ -62,6 +63,7 @@ const InputFooter = memo(function InputFooter({
|
||||
agentName: string | null | undefined;
|
||||
currentModel: string | null | undefined;
|
||||
isOpenAICodexProvider: boolean;
|
||||
isByokProvider: boolean;
|
||||
isAutocompleteActive: boolean;
|
||||
}) {
|
||||
// Hide footer when autocomplete is showing
|
||||
@@ -96,11 +98,12 @@ const InputFooter = memo(function InputFooter({
|
||||
)}
|
||||
<Text>
|
||||
<Text color={colors.footer.agentName}>{agentName || "Unnamed"}</Text>
|
||||
<Text
|
||||
dimColor={!isOpenAICodexProvider}
|
||||
color={isOpenAICodexProvider ? "#74AA9C" : undefined}
|
||||
>
|
||||
{` [${currentModel ?? "unknown"}]`}
|
||||
<Text dimColor>
|
||||
{` [${currentModel ?? "unknown"}`}
|
||||
{isByokProvider && (
|
||||
<Text color={isOpenAICodexProvider ? "#74AA9C" : "yellow"}> ▲</Text>
|
||||
)}
|
||||
{"]"}
|
||||
</Text>
|
||||
</Text>
|
||||
</Box>
|
||||
@@ -903,6 +906,10 @@ export function Input({
|
||||
isOpenAICodexProvider={
|
||||
currentModelProvider === OPENAI_CODEX_PROVIDER_NAME
|
||||
}
|
||||
isByokProvider={
|
||||
currentModelProvider?.startsWith("lc-") ||
|
||||
currentModelProvider === OPENAI_CODEX_PROVIDER_NAME
|
||||
}
|
||||
isAutocompleteActive={isAutocompleteActive}
|
||||
/>
|
||||
</Box>
|
||||
|
||||
@@ -15,8 +15,18 @@ const SOLID_LINE = "─";
|
||||
|
||||
const VISIBLE_ITEMS = 8;
|
||||
|
||||
type ModelCategory = "supported" | "all";
|
||||
const MODEL_CATEGORIES: ModelCategory[] = ["supported", "all"];
|
||||
type ModelCategory = "supported" | "byok" | "byok-all" | "all";
|
||||
|
||||
// BYOK provider prefixes (ChatGPT OAuth + lc-* providers from /connect)
|
||||
const BYOK_PROVIDER_PREFIXES = ["chatgpt-plus-pro/", "lc-"];
|
||||
|
||||
// Get tab order based on billing tier (free = BYOK first, paid = BYOK last)
|
||||
function getModelCategories(billingTier?: string): ModelCategory[] {
|
||||
const isFreeTier = billingTier?.toLowerCase() === "free";
|
||||
return isFreeTier
|
||||
? ["byok", "byok-all", "supported", "all"]
|
||||
: ["supported", "all", "byok", "byok-all"];
|
||||
}
|
||||
|
||||
type UiModel = {
|
||||
id: string;
|
||||
@@ -25,6 +35,7 @@ type UiModel = {
|
||||
description: string;
|
||||
isDefault?: boolean;
|
||||
isFeatured?: boolean;
|
||||
free?: boolean;
|
||||
updateArgs?: Record<string, unknown>;
|
||||
};
|
||||
|
||||
@@ -36,6 +47,8 @@ interface ModelSelectorProps {
|
||||
filterProvider?: string;
|
||||
/** Force refresh the models list on mount */
|
||||
forceRefresh?: boolean;
|
||||
/** User's billing tier - affects tab ordering (free = BYOK first) */
|
||||
billingTier?: string;
|
||||
}
|
||||
|
||||
export function ModelSelector({
|
||||
@@ -44,11 +57,20 @@ export function ModelSelector({
|
||||
onCancel,
|
||||
filterProvider,
|
||||
forceRefresh: forceRefreshOnMount,
|
||||
billingTier,
|
||||
}: ModelSelectorProps) {
|
||||
const terminalWidth = useTerminalWidth();
|
||||
const solidLine = SOLID_LINE.repeat(Math.max(terminalWidth, 10));
|
||||
const typedModels = models as UiModel[];
|
||||
const [category, setCategory] = useState<ModelCategory>("supported");
|
||||
|
||||
// Tab order depends on billing tier (free = BYOK first)
|
||||
const modelCategories = useMemo(
|
||||
() => getModelCategories(billingTier),
|
||||
[billingTier],
|
||||
);
|
||||
const defaultCategory = modelCategories[0] ?? "supported";
|
||||
|
||||
const [category, setCategory] = useState<ModelCategory>(defaultCategory);
|
||||
const [selectedIndex, setSelectedIndex] = useState(0);
|
||||
|
||||
// undefined: not loaded yet (show spinner)
|
||||
@@ -117,6 +139,8 @@ export function ModelSelector({
|
||||
// Supported models: models.json entries that are available
|
||||
// Featured models first, then non-featured, preserving JSON order within each group
|
||||
// If filterProvider is set, only show models from that provider
|
||||
// For free tier, free models go first
|
||||
const isFreeTier = billingTier?.toLowerCase() === "free";
|
||||
const supportedModels = useMemo(() => {
|
||||
if (availableHandles === undefined) return [];
|
||||
let available =
|
||||
@@ -139,26 +163,156 @@ export function ModelSelector({
|
||||
m.handle.toLowerCase().includes(query),
|
||||
);
|
||||
}
|
||||
|
||||
// For free tier, put free models first, then others with standard ordering
|
||||
if (isFreeTier) {
|
||||
const freeModels = available.filter((m) => m.free);
|
||||
const paidModels = available.filter((m) => !m.free);
|
||||
const featured = paidModels.filter((m) => m.isFeatured);
|
||||
const nonFeatured = paidModels.filter((m) => !m.isFeatured);
|
||||
return [...freeModels, ...featured, ...nonFeatured];
|
||||
}
|
||||
|
||||
const featured = available.filter((m) => m.isFeatured);
|
||||
const nonFeatured = available.filter((m) => !m.isFeatured);
|
||||
return [...featured, ...nonFeatured];
|
||||
}, [typedModels, availableHandles, filterProvider, searchQuery]);
|
||||
}, [typedModels, availableHandles, filterProvider, searchQuery, isFreeTier]);
|
||||
|
||||
// All other models: API handles not in models.json
|
||||
// BYOK models: models from chatgpt-plus-pro or lc-* providers
|
||||
const isByokHandle = useCallback(
|
||||
(handle: string) =>
|
||||
BYOK_PROVIDER_PREFIXES.some((prefix) => handle.startsWith(prefix)),
|
||||
[],
|
||||
);
|
||||
|
||||
// All other models: API handles not in models.json and not BYOK
|
||||
const otherModelHandles = useMemo(() => {
|
||||
const filtered = allApiHandles.filter(
|
||||
(handle) => !staticModelHandles.has(handle),
|
||||
(handle) => !staticModelHandles.has(handle) && !isByokHandle(handle),
|
||||
);
|
||||
if (!searchQuery) return filtered;
|
||||
const query = searchQuery.toLowerCase();
|
||||
return filtered.filter((handle) => handle.toLowerCase().includes(query));
|
||||
}, [allApiHandles, staticModelHandles, searchQuery]);
|
||||
}, [allApiHandles, staticModelHandles, searchQuery, isByokHandle]);
|
||||
|
||||
// Provider name mappings for BYOK -> models.json lookup
|
||||
// Maps BYOK provider prefix to models.json provider prefix
|
||||
const BYOK_PROVIDER_ALIASES: Record<string, string> = {
|
||||
"lc-anthropic": "anthropic",
|
||||
"lc-openai": "openai",
|
||||
"lc-zai": "zai",
|
||||
"lc-gemini": "google_ai",
|
||||
"chatgpt-plus-pro": "chatgpt-plus-pro", // No change needed
|
||||
};
|
||||
|
||||
// Convert BYOK handle to base provider handle for models.json lookup
|
||||
// e.g., "lc-anthropic/claude-3-5-haiku" -> "anthropic/claude-3-5-haiku"
|
||||
// e.g., "lc-gemini/gemini-2.0-flash" -> "google_ai/gemini-2.0-flash"
|
||||
const toBaseHandle = useCallback((handle: string): string => {
|
||||
const slashIndex = handle.indexOf("/");
|
||||
if (slashIndex === -1) return handle;
|
||||
|
||||
const provider = handle.slice(0, slashIndex);
|
||||
const model = handle.slice(slashIndex + 1);
|
||||
const baseProvider = BYOK_PROVIDER_ALIASES[provider];
|
||||
|
||||
if (baseProvider) {
|
||||
return `${baseProvider}/${model}`;
|
||||
}
|
||||
return handle;
|
||||
}, []);
|
||||
|
||||
// BYOK (recommended): BYOK API handles that have matching entries in models.json
|
||||
const byokModels = useMemo(() => {
|
||||
if (availableHandles === undefined) return [];
|
||||
|
||||
// Get all BYOK handles from API
|
||||
const byokHandles = allApiHandles.filter(isByokHandle);
|
||||
|
||||
// Find models.json entries that match (using alias for lc-* providers)
|
||||
const matched: UiModel[] = [];
|
||||
for (const handle of byokHandles) {
|
||||
const baseHandle = toBaseHandle(handle);
|
||||
const staticModel = typedModels.find((m) => m.handle === baseHandle);
|
||||
if (staticModel) {
|
||||
// Use models.json data but with the BYOK handle as the ID
|
||||
matched.push({
|
||||
...staticModel,
|
||||
id: handle,
|
||||
handle: handle,
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
// Apply search filter
|
||||
if (searchQuery) {
|
||||
const query = searchQuery.toLowerCase();
|
||||
return matched.filter(
|
||||
(m) =>
|
||||
m.label.toLowerCase().includes(query) ||
|
||||
m.description.toLowerCase().includes(query) ||
|
||||
m.handle.toLowerCase().includes(query),
|
||||
);
|
||||
}
|
||||
|
||||
return matched;
|
||||
}, [
|
||||
availableHandles,
|
||||
allApiHandles,
|
||||
typedModels,
|
||||
searchQuery,
|
||||
isByokHandle,
|
||||
toBaseHandle,
|
||||
]);
|
||||
|
||||
// BYOK (all): BYOK handles from API that don't have matching models.json entries
|
||||
const byokAllModels = useMemo(() => {
|
||||
if (availableHandles === undefined) return [];
|
||||
|
||||
// Get BYOK handles that don't have a match in models.json (using alias)
|
||||
const byokHandles = allApiHandles.filter((handle) => {
|
||||
if (!isByokHandle(handle)) return false;
|
||||
const baseHandle = toBaseHandle(handle);
|
||||
// Exclude if there's a matching entry in models.json
|
||||
return !staticModelHandles.has(baseHandle);
|
||||
});
|
||||
|
||||
// Apply search filter
|
||||
let filtered = byokHandles;
|
||||
if (searchQuery) {
|
||||
const query = searchQuery.toLowerCase();
|
||||
filtered = byokHandles.filter((handle) =>
|
||||
handle.toLowerCase().includes(query),
|
||||
);
|
||||
}
|
||||
|
||||
return filtered;
|
||||
}, [
|
||||
availableHandles,
|
||||
allApiHandles,
|
||||
staticModelHandles,
|
||||
searchQuery,
|
||||
isByokHandle,
|
||||
toBaseHandle,
|
||||
]);
|
||||
|
||||
// Get the list for current category
|
||||
const currentList: UiModel[] = useMemo(() => {
|
||||
if (category === "supported") {
|
||||
return supportedModels;
|
||||
}
|
||||
if (category === "byok") {
|
||||
return byokModels;
|
||||
}
|
||||
if (category === "byok-all") {
|
||||
// Convert raw handles to UiModel
|
||||
return byokAllModels.map((handle) => ({
|
||||
id: handle,
|
||||
handle,
|
||||
label: handle,
|
||||
description: "",
|
||||
}));
|
||||
}
|
||||
// For "all" category, convert handles to simple UiModel objects
|
||||
return otherModelHandles.map((handle) => ({
|
||||
id: handle,
|
||||
@@ -166,7 +320,7 @@ export function ModelSelector({
|
||||
label: handle,
|
||||
description: "",
|
||||
}));
|
||||
}, [category, supportedModels, otherModelHandles]);
|
||||
}, [category, supportedModels, byokModels, byokAllModels, otherModelHandles]);
|
||||
|
||||
// Show 1 fewer item because Search line takes space
|
||||
const visibleCount = VISIBLE_ITEMS - 1;
|
||||
@@ -191,14 +345,14 @@ export function ModelSelector({
|
||||
// Reset selection when category changes
|
||||
const cycleCategory = useCallback(() => {
|
||||
setCategory((current) => {
|
||||
const idx = MODEL_CATEGORIES.indexOf(current);
|
||||
return MODEL_CATEGORIES[
|
||||
(idx + 1) % MODEL_CATEGORIES.length
|
||||
const idx = modelCategories.indexOf(current);
|
||||
return modelCategories[
|
||||
(idx + 1) % modelCategories.length
|
||||
] as ModelCategory;
|
||||
});
|
||||
setSelectedIndex(0);
|
||||
setSearchQuery("");
|
||||
}, []);
|
||||
}, [modelCategories]);
|
||||
|
||||
// Set initial selection to current model on mount
|
||||
const initializedRef = useRef(false);
|
||||
@@ -253,9 +407,9 @@ export function ModelSelector({
|
||||
if (key.leftArrow) {
|
||||
// Cycle backwards through categories
|
||||
setCategory((current) => {
|
||||
const idx = MODEL_CATEGORIES.indexOf(current);
|
||||
return MODEL_CATEGORIES[
|
||||
idx === 0 ? MODEL_CATEGORIES.length - 1 : idx - 1
|
||||
const idx = modelCategories.indexOf(current);
|
||||
return modelCategories[
|
||||
idx === 0 ? modelCategories.length - 1 : idx - 1
|
||||
] as ModelCategory;
|
||||
});
|
||||
setSelectedIndex(0);
|
||||
@@ -272,7 +426,23 @@ export function ModelSelector({
|
||||
return;
|
||||
}
|
||||
|
||||
// Disable other inputs while loading
|
||||
// Capture text input for search (allow typing even with 0 results)
|
||||
// Exclude special keys like Enter, arrows, etc.
|
||||
if (
|
||||
input &&
|
||||
input.length === 1 &&
|
||||
!key.ctrl &&
|
||||
!key.meta &&
|
||||
!key.return &&
|
||||
!key.upArrow &&
|
||||
!key.downArrow
|
||||
) {
|
||||
setSearchQuery((prev) => prev + input);
|
||||
setSelectedIndex(0);
|
||||
return;
|
||||
}
|
||||
|
||||
// Disable navigation/selection while loading or no results
|
||||
if (isLoading || refreshing || currentList.length === 0) {
|
||||
return;
|
||||
}
|
||||
@@ -286,10 +456,6 @@ export function ModelSelector({
|
||||
if (selectedModel) {
|
||||
onSelect(selectedModel.id);
|
||||
}
|
||||
} else if (input && input.length === 1) {
|
||||
// Capture text input for search
|
||||
setSearchQuery((prev) => prev + input);
|
||||
setSelectedIndex(0);
|
||||
}
|
||||
},
|
||||
// Keep active so ESC and 'r' work while loading.
|
||||
@@ -297,14 +463,34 @@ export function ModelSelector({
|
||||
);
|
||||
|
||||
const getCategoryLabel = (cat: ModelCategory) => {
|
||||
if (cat === "supported") return `Recommended (${supportedModels.length})`;
|
||||
return `All Available (${otherModelHandles.length})`;
|
||||
if (cat === "supported") return `Letta API [${supportedModels.length}]`;
|
||||
if (cat === "byok") return `BYOK [${byokModels.length}]`;
|
||||
if (cat === "byok-all") return `BYOK (all) [${byokAllModels.length}]`;
|
||||
return `Letta API (all) [${otherModelHandles.length}]`;
|
||||
};
|
||||
|
||||
const getCategoryDescription = (cat: ModelCategory) => {
|
||||
if (cat === "supported") {
|
||||
return isFreeTier
|
||||
? "Upgrade your account to access more models"
|
||||
: "Recommended models on the Letta API";
|
||||
}
|
||||
if (cat === "byok")
|
||||
return "Recommended models via your API keys (use /connect to add more)";
|
||||
if (cat === "byok-all")
|
||||
return "All models via your API keys (use /connect to add more)";
|
||||
if (cat === "all") {
|
||||
return isFreeTier
|
||||
? "Upgrade your account to access more models"
|
||||
: "All models on the Letta API";
|
||||
}
|
||||
return "All models on the Letta API";
|
||||
};
|
||||
|
||||
// Render tab bar (matches AgentSelector style)
|
||||
const renderTabBar = () => (
|
||||
<Box flexDirection="row" gap={2}>
|
||||
{MODEL_CATEGORIES.map((cat) => {
|
||||
{modelCategories.map((cat) => {
|
||||
const isActive = cat === category;
|
||||
return (
|
||||
<Text
|
||||
@@ -338,7 +524,15 @@ export function ModelSelector({
|
||||
{!isLoading && !refreshing && (
|
||||
<Box flexDirection="column" paddingLeft={1}>
|
||||
{renderTabBar()}
|
||||
<Text dimColor> Search: {searchQuery || "(type to filter)"}</Text>
|
||||
<Text dimColor> {getCategoryDescription(category)}</Text>
|
||||
<Text>
|
||||
<Text dimColor> Search: </Text>
|
||||
{searchQuery ? (
|
||||
<Text>{searchQuery}</Text>
|
||||
) : (
|
||||
<Text dimColor>(type to filter)</Text>
|
||||
)}
|
||||
</Text>
|
||||
</Box>
|
||||
)}
|
||||
</Box>
|
||||
@@ -380,6 +574,11 @@ export function ModelSelector({
|
||||
const actualIndex = startIndex + index;
|
||||
const isSelected = actualIndex === selectedIndex;
|
||||
const isCurrent = model.id === currentModelId;
|
||||
// Show lock for non-free models when on free tier (only for Letta API tabs)
|
||||
const showLock =
|
||||
isFreeTier &&
|
||||
!model.free &&
|
||||
(category === "supported" || category === "all");
|
||||
|
||||
return (
|
||||
<Box key={model.id} flexDirection="row">
|
||||
@@ -388,6 +587,7 @@ export function ModelSelector({
|
||||
>
|
||||
{isSelected ? "> " : " "}
|
||||
</Text>
|
||||
{showLock && <Text dimColor>🔒 </Text>}
|
||||
<Text
|
||||
bold={isSelected}
|
||||
color={
|
||||
|
||||
456
src/cli/components/ProviderSelector.tsx
Normal file
456
src/cli/components/ProviderSelector.tsx
Normal file
@@ -0,0 +1,456 @@
|
||||
import { Box, Text, useInput } from "ink";
|
||||
import { useCallback, useEffect, useRef, useState } from "react";
|
||||
import {
|
||||
BYOK_PROVIDERS,
|
||||
type ByokProvider,
|
||||
checkProviderApiKey,
|
||||
createOrUpdateProvider,
|
||||
getConnectedProviders,
|
||||
type ProviderResponse,
|
||||
removeProviderByName,
|
||||
} from "../../providers/byok-providers";
|
||||
import { useTerminalWidth } from "../hooks/useTerminalWidth";
|
||||
import { colors } from "./colors";
|
||||
|
||||
const SOLID_LINE = "─";
|
||||
|
||||
type ViewState =
|
||||
| { type: "list" }
|
||||
| { type: "input"; provider: ByokProvider }
|
||||
| { type: "options"; provider: ByokProvider; providerId: string };
|
||||
|
||||
type ValidationState = "idle" | "validating" | "valid" | "invalid";
|
||||
|
||||
interface ProviderSelectorProps {
|
||||
onCancel: () => void;
|
||||
/** Called when ChatGPT/Codex OAuth flow should start */
|
||||
onStartOAuth?: () => void;
|
||||
}
|
||||
|
||||
export function ProviderSelector({
|
||||
onCancel,
|
||||
onStartOAuth,
|
||||
}: ProviderSelectorProps) {
|
||||
const terminalWidth = useTerminalWidth();
|
||||
const solidLine = SOLID_LINE.repeat(Math.max(terminalWidth, 10));
|
||||
|
||||
// State
|
||||
const [selectedIndex, setSelectedIndex] = useState(0);
|
||||
const [connectedProviders, setConnectedProviders] = useState<
|
||||
Map<string, ProviderResponse>
|
||||
>(new Map());
|
||||
const [isLoading, setIsLoading] = useState(true);
|
||||
const [viewState, setViewState] = useState<ViewState>({ type: "list" });
|
||||
const [apiKeyInput, setApiKeyInput] = useState("");
|
||||
const [validationState, setValidationState] =
|
||||
useState<ValidationState>("idle");
|
||||
const [validationError, setValidationError] = useState<string | null>(null);
|
||||
const [optionIndex, setOptionIndex] = useState(0);
|
||||
|
||||
const mountedRef = useRef(true);
|
||||
useEffect(() => {
|
||||
mountedRef.current = true;
|
||||
return () => {
|
||||
mountedRef.current = false;
|
||||
};
|
||||
}, []);
|
||||
|
||||
// Load connected providers on mount
|
||||
useEffect(() => {
|
||||
(async () => {
|
||||
try {
|
||||
const providers = await getConnectedProviders();
|
||||
if (mountedRef.current) {
|
||||
setConnectedProviders(providers);
|
||||
setIsLoading(false);
|
||||
}
|
||||
} catch {
|
||||
if (mountedRef.current) {
|
||||
setIsLoading(false);
|
||||
}
|
||||
}
|
||||
})();
|
||||
}, []);
|
||||
|
||||
// Check if a provider is connected
|
||||
const isConnected = useCallback(
|
||||
(provider: ByokProvider) => {
|
||||
return connectedProviders.has(provider.providerName);
|
||||
},
|
||||
[connectedProviders],
|
||||
);
|
||||
|
||||
// Get provider ID if connected
|
||||
const getProviderId = useCallback(
|
||||
(provider: ByokProvider): string | undefined => {
|
||||
return connectedProviders.get(provider.providerName)?.id;
|
||||
},
|
||||
[connectedProviders],
|
||||
);
|
||||
|
||||
// Handle selecting a provider from the list
|
||||
const handleSelectProvider = useCallback(
|
||||
(provider: ByokProvider) => {
|
||||
if ("isOAuth" in provider && provider.isOAuth) {
|
||||
// OAuth provider - trigger OAuth flow
|
||||
if (onStartOAuth) {
|
||||
onStartOAuth();
|
||||
}
|
||||
return;
|
||||
}
|
||||
|
||||
const connected = isConnected(provider);
|
||||
if (connected) {
|
||||
// Show options for connected provider
|
||||
const providerId = getProviderId(provider);
|
||||
if (providerId) {
|
||||
setViewState({ type: "options", provider, providerId });
|
||||
setOptionIndex(0);
|
||||
}
|
||||
} else {
|
||||
// Show API key input for new provider
|
||||
setViewState({ type: "input", provider });
|
||||
setApiKeyInput("");
|
||||
setValidationState("idle");
|
||||
setValidationError(null);
|
||||
}
|
||||
},
|
||||
[isConnected, getProviderId, onStartOAuth],
|
||||
);
|
||||
|
||||
// Handle API key validation and saving
|
||||
const handleValidateAndSave = useCallback(async () => {
|
||||
if (viewState.type !== "input") return;
|
||||
if (!apiKeyInput.trim()) return;
|
||||
|
||||
const { provider } = viewState;
|
||||
|
||||
// If already validated, save
|
||||
if (validationState === "valid") {
|
||||
try {
|
||||
await createOrUpdateProvider(
|
||||
provider.providerType,
|
||||
provider.providerName,
|
||||
apiKeyInput.trim(),
|
||||
);
|
||||
// Refresh connected providers
|
||||
const providers = await getConnectedProviders();
|
||||
if (mountedRef.current) {
|
||||
setConnectedProviders(providers);
|
||||
setViewState({ type: "list" });
|
||||
setApiKeyInput("");
|
||||
setValidationState("idle");
|
||||
}
|
||||
} catch (err) {
|
||||
if (mountedRef.current) {
|
||||
setValidationError(
|
||||
err instanceof Error ? err.message : "Failed to save",
|
||||
);
|
||||
setValidationState("invalid");
|
||||
}
|
||||
}
|
||||
return;
|
||||
}
|
||||
|
||||
// Validate the key
|
||||
setValidationState("validating");
|
||||
setValidationError(null);
|
||||
|
||||
try {
|
||||
await checkProviderApiKey(provider.providerType, apiKeyInput.trim());
|
||||
if (mountedRef.current) {
|
||||
setValidationState("valid");
|
||||
}
|
||||
} catch (err) {
|
||||
if (mountedRef.current) {
|
||||
setValidationState("invalid");
|
||||
setValidationError(
|
||||
err instanceof Error ? err.message : "Invalid API key",
|
||||
);
|
||||
}
|
||||
}
|
||||
}, [viewState, apiKeyInput, validationState]);
|
||||
|
||||
// Handle disconnect
|
||||
const handleDisconnect = useCallback(async () => {
|
||||
if (viewState.type !== "options") return;
|
||||
|
||||
const { provider } = viewState;
|
||||
try {
|
||||
await removeProviderByName(provider.providerName);
|
||||
// Refresh connected providers
|
||||
const providers = await getConnectedProviders();
|
||||
if (mountedRef.current) {
|
||||
setConnectedProviders(providers);
|
||||
setViewState({ type: "list" });
|
||||
}
|
||||
} catch {
|
||||
// Silently fail, stay on options view
|
||||
}
|
||||
}, [viewState]);
|
||||
|
||||
// Handle update key option
|
||||
const handleUpdateKey = useCallback(() => {
|
||||
if (viewState.type !== "options") return;
|
||||
const { provider } = viewState;
|
||||
setViewState({ type: "input", provider });
|
||||
setApiKeyInput("");
|
||||
setValidationState("idle");
|
||||
setValidationError(null);
|
||||
}, [viewState]);
|
||||
|
||||
useInput((input, key) => {
|
||||
// CTRL-C: immediately cancel
|
||||
if (key.ctrl && input === "c") {
|
||||
onCancel();
|
||||
return;
|
||||
}
|
||||
|
||||
// Handle based on view state
|
||||
if (viewState.type === "list") {
|
||||
if (isLoading) return;
|
||||
|
||||
if (key.escape) {
|
||||
onCancel();
|
||||
} else if (key.upArrow) {
|
||||
setSelectedIndex((prev) => Math.max(0, prev - 1));
|
||||
} else if (key.downArrow) {
|
||||
setSelectedIndex((prev) =>
|
||||
Math.min(BYOK_PROVIDERS.length - 1, prev + 1),
|
||||
);
|
||||
} else if (key.return) {
|
||||
const provider = BYOK_PROVIDERS[selectedIndex];
|
||||
if (provider) {
|
||||
handleSelectProvider(provider);
|
||||
}
|
||||
}
|
||||
} else if (viewState.type === "input") {
|
||||
if (key.escape) {
|
||||
// Back to list
|
||||
setViewState({ type: "list" });
|
||||
setApiKeyInput("");
|
||||
setValidationState("idle");
|
||||
setValidationError(null);
|
||||
} else if (key.return) {
|
||||
handleValidateAndSave();
|
||||
} else if (key.backspace || key.delete) {
|
||||
setApiKeyInput((prev) => prev.slice(0, -1));
|
||||
// Reset validation if key changed
|
||||
if (validationState !== "idle") {
|
||||
setValidationState("idle");
|
||||
setValidationError(null);
|
||||
}
|
||||
} else if (input && !key.ctrl && !key.meta) {
|
||||
setApiKeyInput((prev) => prev + input);
|
||||
// Reset validation if key changed
|
||||
if (validationState !== "idle") {
|
||||
setValidationState("idle");
|
||||
setValidationError(null);
|
||||
}
|
||||
}
|
||||
} else if (viewState.type === "options") {
|
||||
const options = ["Update API key", "Disconnect", "Back"];
|
||||
if (key.escape) {
|
||||
setViewState({ type: "list" });
|
||||
} else if (key.upArrow) {
|
||||
setOptionIndex((prev) => Math.max(0, prev - 1));
|
||||
} else if (key.downArrow) {
|
||||
setOptionIndex((prev) => Math.min(options.length - 1, prev + 1));
|
||||
} else if (key.return) {
|
||||
if (optionIndex === 0) {
|
||||
handleUpdateKey();
|
||||
} else if (optionIndex === 1) {
|
||||
handleDisconnect();
|
||||
} else {
|
||||
setViewState({ type: "list" });
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
// Mask API key for display
|
||||
const maskApiKey = (key: string): string => {
|
||||
if (key.length <= 8) return "*".repeat(key.length);
|
||||
return key.slice(0, 4) + "*".repeat(Math.min(key.length - 4, 20));
|
||||
};
|
||||
|
||||
// Render list view
|
||||
const renderListView = () => (
|
||||
<>
|
||||
<Box flexDirection="column" marginBottom={1}>
|
||||
<Text bold color={colors.selector.title}>
|
||||
Connect your LLM API keys
|
||||
</Text>
|
||||
<Text dimColor>Change models with /model after connecting</Text>
|
||||
</Box>
|
||||
|
||||
{isLoading ? (
|
||||
<Box>
|
||||
<Text dimColor>{" "}Loading providers...</Text>
|
||||
</Box>
|
||||
) : (
|
||||
<Box flexDirection="column">
|
||||
{BYOK_PROVIDERS.map((provider, index) => {
|
||||
const isSelected = index === selectedIndex;
|
||||
const connected = isConnected(provider);
|
||||
|
||||
return (
|
||||
<Box key={provider.id} flexDirection="row">
|
||||
<Text
|
||||
color={
|
||||
isSelected ? colors.selector.itemHighlighted : undefined
|
||||
}
|
||||
>
|
||||
{isSelected ? "> " : " "}
|
||||
</Text>
|
||||
<Text color={connected ? "green" : undefined}>
|
||||
[{connected ? "✓" : " "}]
|
||||
</Text>
|
||||
<Text> </Text>
|
||||
<Text
|
||||
bold={isSelected}
|
||||
color={
|
||||
isSelected ? colors.selector.itemHighlighted : undefined
|
||||
}
|
||||
>
|
||||
{provider.displayName}
|
||||
</Text>
|
||||
<Text dimColor>
|
||||
{" · "}
|
||||
{connected ? (
|
||||
<Text color="green">Connected</Text>
|
||||
) : (
|
||||
provider.description
|
||||
)}
|
||||
</Text>
|
||||
</Box>
|
||||
);
|
||||
})}
|
||||
</Box>
|
||||
)}
|
||||
|
||||
{!isLoading && (
|
||||
<Box marginTop={1}>
|
||||
<Text dimColor>{" "}Enter select · ↑↓ navigate · Esc cancel</Text>
|
||||
</Box>
|
||||
)}
|
||||
</>
|
||||
);
|
||||
|
||||
// Render input view
|
||||
const renderInputView = () => {
|
||||
if (viewState.type !== "input") return null;
|
||||
const { provider } = viewState;
|
||||
|
||||
const statusText =
|
||||
validationState === "validating"
|
||||
? " (validating...)"
|
||||
: validationState === "valid"
|
||||
? " (key validated!)"
|
||||
: validationState === "invalid"
|
||||
? ` (invalid key${validationError ? `: ${validationError}` : ""})`
|
||||
: "";
|
||||
|
||||
const statusColor =
|
||||
validationState === "valid"
|
||||
? "green"
|
||||
: validationState === "invalid"
|
||||
? "red"
|
||||
: undefined;
|
||||
|
||||
const footerText =
|
||||
validationState === "valid"
|
||||
? "Enter to save · Esc cancel"
|
||||
: "Enter to validate · Esc cancel";
|
||||
|
||||
return (
|
||||
<>
|
||||
<Box flexDirection="column" marginBottom={1}>
|
||||
<Text>
|
||||
{" "}Connect your {provider.displayName} key:
|
||||
</Text>
|
||||
</Box>
|
||||
|
||||
<Box flexDirection="row">
|
||||
<Text color={colors.selector.itemHighlighted}>{"> "}</Text>
|
||||
<Text>{apiKeyInput ? maskApiKey(apiKeyInput) : "(enter key)"}</Text>
|
||||
<Text color={statusColor} dimColor={validationState === "validating"}>
|
||||
{statusText}
|
||||
</Text>
|
||||
</Box>
|
||||
|
||||
<Box marginTop={1}>
|
||||
<Text dimColor>
|
||||
{" "}
|
||||
{footerText}
|
||||
</Text>
|
||||
</Box>
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
// Render options view (for connected providers)
|
||||
const renderOptionsView = () => {
|
||||
if (viewState.type !== "options") return null;
|
||||
const { provider } = viewState;
|
||||
const options = ["Update API key", "Disconnect", "Back"];
|
||||
|
||||
return (
|
||||
<>
|
||||
<Box flexDirection="column" marginBottom={1}>
|
||||
<Box flexDirection="row">
|
||||
<Text>{" "}</Text>
|
||||
<Text color="green">[✓]</Text>
|
||||
<Text> </Text>
|
||||
<Text bold>{provider.displayName}</Text>
|
||||
<Text dimColor> · </Text>
|
||||
<Text color="green">Connected</Text>
|
||||
</Box>
|
||||
</Box>
|
||||
|
||||
<Box flexDirection="column">
|
||||
{options.map((option, index) => {
|
||||
const isSelected = index === optionIndex;
|
||||
return (
|
||||
<Box key={option} flexDirection="row">
|
||||
<Text
|
||||
color={
|
||||
isSelected ? colors.selector.itemHighlighted : undefined
|
||||
}
|
||||
>
|
||||
{isSelected ? "> " : " "}
|
||||
</Text>
|
||||
<Text
|
||||
bold={isSelected}
|
||||
color={
|
||||
isSelected ? colors.selector.itemHighlighted : undefined
|
||||
}
|
||||
>
|
||||
{option}
|
||||
</Text>
|
||||
</Box>
|
||||
);
|
||||
})}
|
||||
</Box>
|
||||
|
||||
<Box marginTop={1}>
|
||||
<Text dimColor>{" "}Enter select · ↑↓ navigate · Esc back</Text>
|
||||
</Box>
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
return (
|
||||
<Box flexDirection="column">
|
||||
{/* Command header */}
|
||||
<Text dimColor>{"> /connect"}</Text>
|
||||
<Text dimColor>{solidLine}</Text>
|
||||
|
||||
<Box height={1} />
|
||||
|
||||
{viewState.type === "list" && renderListView()}
|
||||
{viewState.type === "input" && renderInputView()}
|
||||
{viewState.type === "options" && renderOptionsView()}
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
@@ -503,6 +503,7 @@
|
||||
"label": "GLM-4.7",
|
||||
"description": "The best open weights coding model",
|
||||
"isFeatured": true,
|
||||
"free": true,
|
||||
"updateArgs": {
|
||||
"context_window": 200000
|
||||
}
|
||||
|
||||
246
src/providers/byok-providers.ts
Normal file
246
src/providers/byok-providers.ts
Normal file
@@ -0,0 +1,246 @@
|
||||
/**
|
||||
* BYOK (Bring Your Own Key) Provider Service
|
||||
* Unified module for managing custom LLM provider connections
|
||||
*/
|
||||
|
||||
import { LETTA_CLOUD_API_URL } from "../auth/oauth";
|
||||
import { settingsManager } from "../settings-manager";
|
||||
|
||||
// Provider configuration for the /connect UI
|
||||
export const BYOK_PROVIDERS = [
|
||||
{
|
||||
id: "codex",
|
||||
displayName: "ChatGPT / Codex plan",
|
||||
description: "Connect your ChatGPT coding plan",
|
||||
providerType: "chatgpt_oauth",
|
||||
providerName: "chatgpt-plus-pro",
|
||||
isOAuth: true,
|
||||
},
|
||||
{
|
||||
id: "anthropic",
|
||||
displayName: "Claude API",
|
||||
description: "Connect an Anthropic API key",
|
||||
providerType: "anthropic",
|
||||
providerName: "lc-anthropic",
|
||||
},
|
||||
{
|
||||
id: "openai",
|
||||
displayName: "OpenAI API",
|
||||
description: "Connect an OpenAI API key",
|
||||
providerType: "openai",
|
||||
providerName: "lc-openai",
|
||||
},
|
||||
{
|
||||
id: "zai",
|
||||
displayName: "zAI API",
|
||||
description: "Connect a zAI key or coding plan",
|
||||
providerType: "zai",
|
||||
providerName: "lc-zai",
|
||||
},
|
||||
{
|
||||
id: "gemini",
|
||||
displayName: "Gemini API",
|
||||
description: "Connect a Google Gemini API key",
|
||||
providerType: "google_ai",
|
||||
providerName: "lc-gemini",
|
||||
},
|
||||
] as const;
|
||||
|
||||
export type ByokProviderId = (typeof BYOK_PROVIDERS)[number]["id"];
|
||||
export type ByokProvider = (typeof BYOK_PROVIDERS)[number];
|
||||
|
||||
// Response type from the providers API
|
||||
export interface ProviderResponse {
|
||||
id: string;
|
||||
name: string;
|
||||
provider_type: string;
|
||||
api_key?: string;
|
||||
base_url?: string;
|
||||
}
|
||||
|
||||
/**
|
||||
* Get the Letta API base URL and auth token
|
||||
*/
|
||||
async function getLettaConfig(): Promise<{ baseUrl: string; apiKey: string }> {
|
||||
const settings = await settingsManager.getSettingsWithSecureTokens();
|
||||
const baseUrl =
|
||||
process.env.LETTA_BASE_URL ||
|
||||
settings.env?.LETTA_BASE_URL ||
|
||||
LETTA_CLOUD_API_URL;
|
||||
const apiKey = process.env.LETTA_API_KEY || settings.env?.LETTA_API_KEY || "";
|
||||
return { baseUrl, apiKey };
|
||||
}
|
||||
|
||||
/**
|
||||
* Make a request to the Letta providers API
|
||||
*/
|
||||
async function providersRequest<T>(
|
||||
method: "GET" | "POST" | "PATCH" | "DELETE",
|
||||
path: string,
|
||||
body?: Record<string, unknown>,
|
||||
): Promise<T> {
|
||||
const { baseUrl, apiKey } = await getLettaConfig();
|
||||
const url = `${baseUrl}${path}`;
|
||||
|
||||
const response = await fetch(url, {
|
||||
method,
|
||||
headers: {
|
||||
"Content-Type": "application/json",
|
||||
Authorization: `Bearer ${apiKey}`,
|
||||
"X-Letta-Source": "letta-code",
|
||||
},
|
||||
...(body && { body: JSON.stringify(body) }),
|
||||
});
|
||||
|
||||
if (!response.ok) {
|
||||
const errorText = await response.text();
|
||||
throw new Error(`Provider API error (${response.status}): ${errorText}`);
|
||||
}
|
||||
|
||||
// Handle empty responses (e.g., DELETE)
|
||||
const text = await response.text();
|
||||
if (!text) {
|
||||
return {} as T;
|
||||
}
|
||||
return JSON.parse(text) as T;
|
||||
}
|
||||
|
||||
/**
|
||||
* List all BYOK providers for the current user
|
||||
*/
|
||||
export async function listProviders(): Promise<ProviderResponse[]> {
|
||||
try {
|
||||
const response = await providersRequest<ProviderResponse[]>(
|
||||
"GET",
|
||||
"/v1/providers",
|
||||
);
|
||||
return response;
|
||||
} catch {
|
||||
return [];
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Get a map of connected providers by name
|
||||
*/
|
||||
export async function getConnectedProviders(): Promise<
|
||||
Map<string, ProviderResponse>
|
||||
> {
|
||||
const providers = await listProviders();
|
||||
const map = new Map<string, ProviderResponse>();
|
||||
for (const provider of providers) {
|
||||
map.set(provider.name, provider);
|
||||
}
|
||||
return map;
|
||||
}
|
||||
|
||||
/**
|
||||
* Check if a specific BYOK provider is connected
|
||||
*/
|
||||
export async function isProviderConnected(
|
||||
providerName: string,
|
||||
): Promise<boolean> {
|
||||
const providers = await listProviders();
|
||||
return providers.some((p) => p.name === providerName);
|
||||
}
|
||||
|
||||
/**
|
||||
* Get a provider by name
|
||||
*/
|
||||
export async function getProviderByName(
|
||||
providerName: string,
|
||||
): Promise<ProviderResponse | null> {
|
||||
const providers = await listProviders();
|
||||
return providers.find((p) => p.name === providerName) || null;
|
||||
}
|
||||
|
||||
/**
|
||||
* Validate an API key with the provider's check endpoint
|
||||
* Returns true if valid, throws error if invalid
|
||||
*/
|
||||
export async function checkProviderApiKey(
|
||||
providerType: string,
|
||||
apiKey: string,
|
||||
): Promise<void> {
|
||||
await providersRequest<{ message: string }>("POST", "/v1/providers/check", {
|
||||
provider_type: providerType,
|
||||
api_key: apiKey,
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* Create a new BYOK provider
|
||||
*/
|
||||
export async function createProvider(
|
||||
providerType: string,
|
||||
providerName: string,
|
||||
apiKey: string,
|
||||
): Promise<ProviderResponse> {
|
||||
return providersRequest<ProviderResponse>("POST", "/v1/providers", {
|
||||
name: providerName,
|
||||
provider_type: providerType,
|
||||
api_key: apiKey,
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* Update an existing provider's API key
|
||||
*/
|
||||
export async function updateProvider(
|
||||
providerId: string,
|
||||
apiKey: string,
|
||||
): Promise<ProviderResponse> {
|
||||
return providersRequest<ProviderResponse>(
|
||||
"PATCH",
|
||||
`/v1/providers/${providerId}`,
|
||||
{
|
||||
api_key: apiKey,
|
||||
},
|
||||
);
|
||||
}
|
||||
|
||||
/**
|
||||
* Delete a provider by ID
|
||||
*/
|
||||
export async function deleteProvider(providerId: string): Promise<void> {
|
||||
await providersRequest<void>("DELETE", `/v1/providers/${providerId}`);
|
||||
}
|
||||
|
||||
/**
|
||||
* Create or update a BYOK provider
|
||||
* If provider exists, updates the API key; otherwise creates new
|
||||
*/
|
||||
export async function createOrUpdateProvider(
|
||||
providerType: string,
|
||||
providerName: string,
|
||||
apiKey: string,
|
||||
): Promise<ProviderResponse> {
|
||||
const existing = await getProviderByName(providerName);
|
||||
|
||||
if (existing) {
|
||||
return updateProvider(existing.id, apiKey);
|
||||
}
|
||||
|
||||
return createProvider(providerType, providerName, apiKey);
|
||||
}
|
||||
|
||||
/**
|
||||
* Remove a provider by name
|
||||
*/
|
||||
export async function removeProviderByName(
|
||||
providerName: string,
|
||||
): Promise<void> {
|
||||
const existing = await getProviderByName(providerName);
|
||||
if (existing) {
|
||||
await deleteProvider(existing.id);
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Get provider config by ID
|
||||
*/
|
||||
export function getProviderConfig(
|
||||
id: ByokProviderId,
|
||||
): ByokProvider | undefined {
|
||||
return BYOK_PROVIDERS.find((p) => p.id === id);
|
||||
}
|
||||
Reference in New Issue
Block a user