mirror of
https://github.com/rennf93/roboco.git
synced 2026-08-03 07:23:24 +02:00
style(panel): show the Grok (xAI) key card above the Ollama card
This commit is contained in:
@@ -310,54 +310,6 @@ export function AIRoutingCard() {
|
||||
</CardDescription>
|
||||
</CardHeader>
|
||||
<CardContent className="space-y-6">
|
||||
{/* -------- Ollama key -------- */}
|
||||
<section className="space-y-2">
|
||||
<div className="flex items-center justify-between">
|
||||
<Label className="text-sm font-medium">Ollama Cloud API key</Label>
|
||||
{hasOllamaKey ? (
|
||||
<Badge className="bg-emerald-500/10 text-emerald-600 border-0">
|
||||
<KeyRound className="h-3 w-3" /> key set
|
||||
</Badge>
|
||||
) : (
|
||||
<Badge className="bg-amber-500/10 text-amber-600 border-0">
|
||||
<Key className="h-3 w-3" /> not set
|
||||
</Badge>
|
||||
)}
|
||||
</div>
|
||||
<div className="flex gap-2">
|
||||
<Input
|
||||
type="password"
|
||||
value={apiKey}
|
||||
onChange={(e) => setApiKey(e.target.value)}
|
||||
placeholder={
|
||||
hasOllamaKey ? "•••••••••••• (leave blank to keep)" : "ollama_xxx…"
|
||||
}
|
||||
disabled={clearKey}
|
||||
/>
|
||||
<Button onClick={saveKey} disabled={setKey.isPending}>
|
||||
{setKey.isPending ? "Saving…" : "Save"}
|
||||
</Button>
|
||||
</div>
|
||||
{hasOllamaKey ? (
|
||||
<label className="flex items-center gap-2 text-xs text-muted-foreground cursor-pointer">
|
||||
<Checkbox
|
||||
checked={clearKey}
|
||||
onCheckedChange={(checked) => {
|
||||
const next = checked === true;
|
||||
setClearKey(next);
|
||||
if (next) setApiKey("");
|
||||
}}
|
||||
/>
|
||||
Clear the stored key
|
||||
</label>
|
||||
) : (
|
||||
<p className="text-xs text-muted-foreground">
|
||||
Stored Fernet-encrypted server-side; never returned by the API.
|
||||
</p>
|
||||
)}
|
||||
</section>
|
||||
|
||||
<Separator />
|
||||
|
||||
{/* -------- Grok (xAI) key -------- */}
|
||||
<section className="space-y-2">
|
||||
@@ -409,6 +361,55 @@ export function AIRoutingCard() {
|
||||
|
||||
<Separator />
|
||||
|
||||
{/* -------- Ollama key -------- */}
|
||||
<section className="space-y-2">
|
||||
<div className="flex items-center justify-between">
|
||||
<Label className="text-sm font-medium">Ollama Cloud API key</Label>
|
||||
{hasOllamaKey ? (
|
||||
<Badge className="bg-emerald-500/10 text-emerald-600 border-0">
|
||||
<KeyRound className="h-3 w-3" /> key set
|
||||
</Badge>
|
||||
) : (
|
||||
<Badge className="bg-amber-500/10 text-amber-600 border-0">
|
||||
<Key className="h-3 w-3" /> not set
|
||||
</Badge>
|
||||
)}
|
||||
</div>
|
||||
<div className="flex gap-2">
|
||||
<Input
|
||||
type="password"
|
||||
value={apiKey}
|
||||
onChange={(e) => setApiKey(e.target.value)}
|
||||
placeholder={
|
||||
hasOllamaKey ? "•••••••••••• (leave blank to keep)" : "ollama_xxx…"
|
||||
}
|
||||
disabled={clearKey}
|
||||
/>
|
||||
<Button onClick={saveKey} disabled={setKey.isPending}>
|
||||
{setKey.isPending ? "Saving…" : "Save"}
|
||||
</Button>
|
||||
</div>
|
||||
{hasOllamaKey ? (
|
||||
<label className="flex items-center gap-2 text-xs text-muted-foreground cursor-pointer">
|
||||
<Checkbox
|
||||
checked={clearKey}
|
||||
onCheckedChange={(checked) => {
|
||||
const next = checked === true;
|
||||
setClearKey(next);
|
||||
if (next) setApiKey("");
|
||||
}}
|
||||
/>
|
||||
Clear the stored key
|
||||
</label>
|
||||
) : (
|
||||
<p className="text-xs text-muted-foreground">
|
||||
Stored Fernet-encrypted server-side; never returned by the API.
|
||||
</p>
|
||||
)}
|
||||
</section>
|
||||
|
||||
<Separator />
|
||||
|
||||
{/* -------- Self-Hosted LLM -------- */}
|
||||
<SelfHostedSection
|
||||
testResult={selfHostedTestResult}
|
||||
|
||||
Reference in New Issue
Block a user