implemented getting key from env

This commit is contained in:
Lucas Oliveira 2025-09-24 14:13:51 -03:00
parent ac15e36733
commit 1034fa2635
2 changed files with 40 additions and 22 deletions

View file

@ -90,7 +90,6 @@ export const useGetOllamaModelsQuery = (
queryKey: ["models", "ollama", params], queryKey: ["models", "ollama", params],
queryFn: getOllamaModels, queryFn: getOllamaModels,
retry: 2, retry: 2,
enabled: !!params?.endpoint, // Only run if endpoint is provided
staleTime: 0, // Always fetch fresh data staleTime: 0, // Always fetch fresh data
gcTime: 0, // Don't cache results gcTime: 0, // Don't cache results
...options, ...options,

View file

@ -1,6 +1,8 @@
import { useState } from "react"; import { useState } from "react";
import { LabelInput } from "@/components/label-input"; import { LabelInput } from "@/components/label-input";
import { LabelWrapper } from "@/components/label-wrapper";
import OpenAILogo from "@/components/logo/openai-logo"; import OpenAILogo from "@/components/logo/openai-logo";
import { Switch } from "@/components/ui/switch";
import { useDebouncedValue } from "@/lib/debounce"; import { useDebouncedValue } from "@/lib/debounce";
import type { OnboardingVariables } from "../../api/mutations/useOnboardingMutation"; import type { OnboardingVariables } from "../../api/mutations/useOnboardingMutation";
import { useGetOpenAIModelsQuery } from "../../api/queries/useGetModelsQuery"; import { useGetOpenAIModelsQuery } from "../../api/queries/useGetModelsQuery";
@ -18,6 +20,7 @@ export function OpenAIOnboarding({
setSampleDataset: (dataset: boolean) => void; setSampleDataset: (dataset: boolean) => void;
}) { }) {
const [apiKey, setApiKey] = useState(""); const [apiKey, setApiKey] = useState("");
const [getFromEnv, setGetFromEnv] = useState(true);
const debouncedApiKey = useDebouncedValue(apiKey, 500); const debouncedApiKey = useDebouncedValue(apiKey, 500);
// Fetch models from API when API key is provided // Fetch models from API when API key is provided
@ -26,7 +29,12 @@ export function OpenAIOnboarding({
isLoading: isLoadingModels, isLoading: isLoadingModels,
error: modelsError, error: modelsError,
} = useGetOpenAIModelsQuery( } = useGetOpenAIModelsQuery(
debouncedApiKey ? { apiKey: debouncedApiKey } : undefined, getFromEnv
? { apiKey: "" }
: debouncedApiKey
? { apiKey: debouncedApiKey }
: undefined,
{ enabled: debouncedApiKey !== "" || getFromEnv },
); );
// Use custom hook for model selection logic // Use custom hook for model selection logic
const { const {
@ -53,26 +61,37 @@ export function OpenAIOnboarding({
); );
return ( return (
<> <>
<div className="space-y-1"> <div className="space-y-5">
<LabelInput <LabelWrapper
label="OpenAI API key" label="Get API key from environment variable"
helperText="The API key for your OpenAI account." id="get-api-key"
id="api-key" flex
type="password" >
required <Switch checked={getFromEnv} onCheckedChange={setGetFromEnv} />
placeholder="sk-..." </LabelWrapper>
value={apiKey} {!getFromEnv && (
onChange={(e) => setApiKey(e.target.value)} <div className="space-y-1">
/> <LabelInput
{isLoadingModels && ( label="OpenAI API key"
<p className="text-mmd text-muted-foreground"> helperText="The API key for your OpenAI account."
Validating API key... id="api-key"
</p> type="password"
)} required
{modelsError && ( placeholder="sk-..."
<p className="text-mmd text-accent-amber-foreground"> value={apiKey}
Invalid OpenAI API key. Verify or replace the key. onChange={(e) => setApiKey(e.target.value)}
</p> />
{isLoadingModels && (
<p className="text-mmd text-muted-foreground">
Validating API key...
</p>
)}
{modelsError && (
<p className="text-mmd text-accent-amber-foreground">
Invalid OpenAI API key. Verify or replace the key.
</p>
)}
</div>
)} )}
</div> </div>
<AdvancedOnboarding <AdvancedOnboarding