implemented getting key from env
This commit is contained in:
parent
ac15e36733
commit
1034fa2635
2 changed files with 40 additions and 22 deletions
|
|
@ -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,
|
||||||
|
|
|
||||||
|
|
@ -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
|
||||||
|
|
|
||||||
Loading…
Add table
Reference in a new issue