48 lines
1.3 KiB
Svelte
48 lines
1.3 KiB
Svelte
<!-- [DEF:LLMSettingsPage:Component] -->
|
|
<!--
|
|
@TIER: STANDARD
|
|
@PURPOSE: Admin settings page for LLM provider configuration.
|
|
@LAYER: UI
|
|
@RELATION: CALLS -> frontend/src/components/llm/ProviderConfig.svelte
|
|
-->
|
|
|
|
<script>
|
|
import { onMount } from 'svelte';
|
|
import ProviderConfig from '../../../../components/llm/ProviderConfig.svelte';
|
|
import { requestApi } from '../../../../lib/api';
|
|
|
|
let providers = [];
|
|
let loading = true;
|
|
|
|
async function fetchProviders() {
|
|
loading = true;
|
|
try {
|
|
providers = await requestApi('/llm/providers');
|
|
} catch (err) {
|
|
console.error("Failed to fetch providers", err);
|
|
} finally {
|
|
loading = false;
|
|
}
|
|
}
|
|
|
|
onMount(fetchProviders);
|
|
</script>
|
|
|
|
<div class="max-w-4xl mx-auto py-8 px-4">
|
|
<div class="mb-8">
|
|
<h1 class="text-3xl font-bold text-gray-900">LLM Settings</h1>
|
|
<p class="mt-2 text-gray-600">
|
|
Configure LLM providers for dashboard validation, documentation generation, and git assistance.
|
|
</p>
|
|
</div>
|
|
|
|
{#if loading}
|
|
<div class="flex justify-center py-12">
|
|
<div class="animate-spin rounded-full h-8 w-8 border-b-2 border-blue-600"></div>
|
|
</div>
|
|
{:else}
|
|
<ProviderConfig {providers} onSave={fetchProviders} />
|
|
{/if}
|
|
</div>
|
|
|
|
<!-- [/DEF:LLMSettingsPage:Component] --> |