c94d3f85e8
- Implement Fake repositories and services for testing purposes. - Create tests for Article API including creation, validation, and listing. - Develop ProcessTicketJobFlowTest to validate ticket processing logic. - Add QuickReplyAdminTest for creating and updating quick replies. - Implement TicketAndArticleModelTest to ensure proper cascading deletes and credential encryption. - Create TicketIngestionTest for ticket creation and job dispatching. - Add TicketShowPageTest to verify rendering of quick replies and tool calls. - Implement unit tests for ClassifierPromptBuilder, EmbeddingService, LlmJsonDecoder, QuickReplyResolver, SupportReplyService, TicketResultPayloadBuilder, TicketToolCallService, and ToolCallRequestValidator.
312 lines
17 KiB
PHP
312 lines
17 KiB
PHP
<div class="space-y-4">
|
|
<div class="bg-white rounded-xl p-4 shadow">
|
|
<div class="flex flex-col gap-3 md:flex-row md:items-center md:justify-between">
|
|
<div>
|
|
<h2 class="text-lg font-semibold">AI Settings</h2>
|
|
<p class="text-sm text-slate-600">Beheer prompts, providers en modellen per stap in de pipeline.</p>
|
|
</div>
|
|
<button form="ai-settings-form" class="bg-slate-900 text-white px-4 py-2 rounded text-sm" type="submit">
|
|
Opslaan
|
|
</button>
|
|
</div>
|
|
|
|
@if (session('saved'))
|
|
<div class="mt-3 rounded bg-green-100 text-green-700 p-2 text-sm">{{ session('saved') }}</div>
|
|
@endif
|
|
|
|
<div class="mt-4 flex flex-wrap gap-2 text-sm">
|
|
@foreach (['process' => 'Proces & prompts', 'providers' => 'Providers', 'models' => 'Modellen', 'embeddings' => 'Embeddings'] as $tab => $label)
|
|
<button type="button" wire:click="setTab('{{ $tab }}')"
|
|
class="rounded px-3 py-2 {{ $activeTab === $tab ? 'bg-slate-900 text-white' : 'bg-slate-100 text-slate-700' }}">
|
|
{{ $label }}
|
|
</button>
|
|
@endforeach
|
|
</div>
|
|
</div>
|
|
|
|
<form id="ai-settings-form" wire:submit="save" class="space-y-4">
|
|
@if ($activeTab === 'process')
|
|
<section class="bg-white rounded-xl p-4 shadow space-y-4">
|
|
<div>
|
|
<h3 class="font-semibold">Proces & prompts</h3>
|
|
<p class="text-sm text-slate-600">Elke stap toont wat er gebeurt. Waar een prompt gebruikt wordt,
|
|
kun je die hier aanpassen.</p>
|
|
</div>
|
|
|
|
<div>
|
|
<label class="block text-sm mb-1">Aanspreekvorm fallback</label>
|
|
<select wire:model="tone_addressing" class="border rounded px-2 py-1">
|
|
<option value="je">je/jij</option>
|
|
<option value="u">u/uw</option>
|
|
</select>
|
|
</div>
|
|
|
|
<div class="space-y-3">
|
|
@foreach ($processSteps as $step)
|
|
<x-admin.timeline-card :number="$step['number']" :title="$step['title']" :description="$step['description']" :badge="isset($step['prompt_key']) ? 'Prompt' : 'Geen prompt'">
|
|
@if (isset($step['prompt_key']))
|
|
<label
|
|
class="block text-xs font-medium text-slate-500">{{ $step['prompt_key'] }}</label>
|
|
<textarea wire:model="promptValues.{{ $step['id'] }}" class="w-full border rounded p-2 min-h-28 text-sm"></textarea>
|
|
@error('promptValues.' . $step['id'])
|
|
<p class="text-sm text-red-600">{{ $message }}</p>
|
|
@enderror
|
|
@endif
|
|
</x-admin.timeline-card>
|
|
@endforeach
|
|
</div>
|
|
</section>
|
|
@endif
|
|
|
|
@if ($activeTab === 'providers')
|
|
<section class="bg-white rounded-xl p-4 shadow space-y-4">
|
|
<div class="flex flex-col gap-3 md:flex-row md:items-center md:justify-between">
|
|
<div>
|
|
<h3 class="font-semibold">LLM provider instances</h3>
|
|
<p class="text-sm text-slate-600">Voeg meerdere Ollama- of LM Studio-instances toe en kies welke
|
|
instance actief is.</p>
|
|
</div>
|
|
<button type="button" wire:click="addProviderInstance"
|
|
class="rounded bg-slate-900 px-3 py-2 text-sm text-white">
|
|
Instance toevoegen
|
|
</button>
|
|
</div>
|
|
|
|
<div class="grid gap-3 md:grid-cols-2">
|
|
<div>
|
|
<label class="block text-sm mb-1">Actieve instance</label>
|
|
<select wire:model.live="activeProviderInstanceId" wire:change="loadModels"
|
|
class="w-full border rounded p-2">
|
|
@foreach ($providerInstances as $instance)
|
|
<option value="{{ $instance['id'] }}">{{ $instance['name'] }}
|
|
({{ $providerDefinitions[$instance['type']]['label'] ?? $instance['type'] }})
|
|
</option>
|
|
@endforeach
|
|
</select>
|
|
</div>
|
|
<div>
|
|
<label class="block text-sm mb-1">Timeout seconden</label>
|
|
<input wire:model="llm_timeout" type="number" min="5" max="600"
|
|
class="w-full border rounded p-2">
|
|
</div>
|
|
</div>
|
|
|
|
<div class="space-y-4">
|
|
@foreach ($providerInstances as $index => $instance)
|
|
@php($type = $instance['type'] ?? 'lmstudio')
|
|
@php($definition = $providerDefinitions[$type] ?? ['label' => $type, 'description' => ''])
|
|
<div class="border rounded p-4 space-y-3">
|
|
<div class="flex items-center justify-between gap-3">
|
|
<div>
|
|
<div class="font-medium">{{ $instance['name'] ?? 'Provider' }}</div>
|
|
<p class="text-sm text-slate-600">{{ $definition['description'] }}</p>
|
|
</div>
|
|
<div class="flex items-center gap-2">
|
|
@if ($activeProviderInstanceId === ($instance['id'] ?? null))
|
|
<span
|
|
class="rounded bg-green-100 px-2 py-1 text-xs text-green-700">Actief</span>
|
|
@else
|
|
<button type="button"
|
|
wire:click="setActiveProviderInstance('{{ $instance['id'] }}')"
|
|
class="rounded bg-slate-100 px-2 py-1 text-xs text-slate-700">
|
|
Actief maken
|
|
</button>
|
|
@endif
|
|
<button type="button" wire:click="removeProviderInstance('{{ $instance['id'] }}')"
|
|
class="text-xs text-red-600 hover:underline">
|
|
Verwijderen
|
|
</button>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="grid gap-3 md:grid-cols-2">
|
|
<div>
|
|
<label class="block text-sm mb-1">Naam</label>
|
|
<input wire:model="providerInstances.{{ $index }}.name" type="text"
|
|
class="w-full border rounded p-2">
|
|
</div>
|
|
<div>
|
|
<label class="block text-sm mb-1">Type</label>
|
|
<select wire:model="providerInstances.{{ $index }}.type"
|
|
class="w-full border rounded p-2">
|
|
@foreach ($providerDefinitions as $provider => $providerDefinition)
|
|
<option value="{{ $provider }}">{{ $providerDefinition['label'] }}
|
|
</option>
|
|
@endforeach
|
|
</select>
|
|
</div>
|
|
</div>
|
|
|
|
<div>
|
|
<label class="block text-sm mb-1">Base URL</label>
|
|
<input wire:model="providerInstances.{{ $index }}.base_url" type="url"
|
|
class="w-full border rounded p-2">
|
|
</div>
|
|
<div class="grid gap-3 md:grid-cols-2">
|
|
<div>
|
|
<label class="block text-sm mb-1">Standaard chat model</label>
|
|
<input wire:model="providerInstances.{{ $index }}.chat_model" type="text"
|
|
class="w-full border rounded p-2">
|
|
</div>
|
|
<div>
|
|
<label class="block text-sm mb-1">Standaard embedding model</label>
|
|
<input wire:model="providerInstances.{{ $index }}.embedding_model"
|
|
type="text" class="w-full border rounded p-2">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
@endforeach
|
|
</div>
|
|
</section>
|
|
@endif
|
|
|
|
@if ($activeTab === 'models')
|
|
<section class="bg-white rounded-xl p-4 shadow space-y-4">
|
|
<div class="flex flex-col gap-3 md:flex-row md:items-center md:justify-between">
|
|
<div>
|
|
<h3 class="font-semibold">Modellen per stap</h3>
|
|
<p class="text-sm text-slate-600">Kies per stap een model van de actieve instance. De lijst
|
|
wordt 5 minuten gecachet.</p>
|
|
</div>
|
|
<button type="button" wire:click="refreshModels"
|
|
class="rounded bg-slate-900 px-3 py-2 text-sm text-white">
|
|
Modellen verversen
|
|
</button>
|
|
</div>
|
|
|
|
@if ($modelLoadError)
|
|
<div class="rounded bg-amber-100 p-2 text-sm text-amber-800">
|
|
Modellen konden niet live worden opgehaald: {{ $modelLoadError }}
|
|
</div>
|
|
@elseif($availableModels === [])
|
|
<div class="rounded bg-slate-100 p-2 text-sm text-slate-700">
|
|
Geen modellen gevonden voor de actieve instance. Je kunt nog steeds handmatig een modelnaam
|
|
invullen.
|
|
</div>
|
|
@else
|
|
<div class="rounded bg-green-100 p-2 text-sm text-green-800">
|
|
{{ count($availableModels) }} modellen gevonden op de actieve instance.
|
|
</div>
|
|
@endif
|
|
|
|
<div class="rounded border p-3 text-sm text-slate-600">
|
|
Actieve instance:
|
|
@foreach ($providerInstances as $instance)
|
|
@if (($instance['id'] ?? null) === $activeProviderInstanceId)
|
|
<strong>{{ $instance['name'] }}</strong>
|
|
({{ $providerDefinitions[$instance['type']]['label'] ?? $instance['type'] }})
|
|
@endif
|
|
@endforeach
|
|
</div>
|
|
|
|
<div class="space-y-3">
|
|
@foreach ($modelTasks as $task)
|
|
<x-admin.timeline-card :number="$task['number']" :title="$task['title']" :description="$task['description']" badge="Model">
|
|
@if ($availableModels !== [])
|
|
<select wire:model="modelValues.{{ $task['id'] }}"
|
|
class="w-full border rounded p-2 text-sm">
|
|
<option value="">Kies model</option>
|
|
@foreach ($availableModels as $model)
|
|
<option value="{{ $model }}">{{ $model }}</option>
|
|
@endforeach
|
|
</select>
|
|
@else
|
|
<input wire:model="modelValues.{{ $task['id'] }}" type="text"
|
|
class="w-full border rounded p-2 text-sm" placeholder="Modelnaam">
|
|
@endif
|
|
@error('modelValues.' . $task['id'])
|
|
<p class="text-sm text-red-600">{{ $message }}</p>
|
|
@enderror
|
|
</x-admin.timeline-card>
|
|
@endforeach
|
|
</div>
|
|
</section>
|
|
@endif
|
|
|
|
@if ($activeTab === 'embeddings')
|
|
<section class="bg-white rounded-xl p-4 shadow space-y-4">
|
|
<div class="flex flex-col gap-3 md:flex-row md:items-center md:justify-between">
|
|
<div>
|
|
<h3 class="font-semibold">Chunk embeddings</h3>
|
|
<p class="text-sm text-slate-600">Hergenereer embeddings voor kennisbankchunks. Dit draait via
|
|
de queue en gebruikt de actieve embedding-provider en het embeddingmodel.</p>
|
|
</div>
|
|
<button type="button" wire:click="refreshEmbeddingStats"
|
|
class="rounded bg-slate-100 px-3 py-2 text-sm text-slate-700">
|
|
Status verversen
|
|
</button>
|
|
</div>
|
|
|
|
<div class="grid gap-3 md:grid-cols-3">
|
|
<div class="rounded border p-3">
|
|
<div class="text-xs text-slate-500">Artikelen</div>
|
|
<div class="mt-1 text-2xl font-semibold">{{ $embeddingStats['articles'] ?? 0 }}</div>
|
|
<p class="mt-1 text-xs text-slate-600">{{ $embeddingStats['articles_without_chunks'] ?? 0 }}
|
|
zonder chunks</p>
|
|
</div>
|
|
<div class="rounded border p-3">
|
|
<div class="text-xs text-slate-500">Chunks</div>
|
|
<div class="mt-1 text-2xl font-semibold">{{ $embeddingStats['chunks'] ?? 0 }}</div>
|
|
<p class="mt-1 text-xs text-slate-600">{{ $embeddingStats['chunks_without_embedding'] ?? 0 }}
|
|
zonder embedding</p>
|
|
</div>
|
|
<div class="rounded border p-3">
|
|
<div class="text-xs text-slate-500">Chunks met embedding</div>
|
|
<div class="mt-1 text-2xl font-semibold">{{ $embeddingStats['chunks_with_embedding'] ?? 0 }}
|
|
</div>
|
|
<p class="mt-1 text-xs text-slate-600">{{ $embeddingStats['articles_with_chunks'] ?? 0 }}
|
|
artikelen geindexeerd</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="rounded border p-3 text-sm">
|
|
<div class="font-medium">Actieve embedding context</div>
|
|
<div class="mt-2 grid gap-2 md:grid-cols-2">
|
|
<div>
|
|
<span class="text-slate-500">Provider instance:</span>
|
|
<span class="font-mono">{{ $embeddingStats['active_provider_instance_id'] ?? '-' }}</span>
|
|
</div>
|
|
<div>
|
|
<span class="text-slate-500">Embedding model:</span>
|
|
<span class="font-mono">{{ $embeddingStats['active_embedding_model'] ?? '-' }}</span>
|
|
</div>
|
|
</div>
|
|
<p class="mt-2 text-slate-600">
|
|
{{ $embeddingStats['current_embedding_chunks'] ?? 0 }} chunks passen bij het actieve
|
|
embeddingmodel.
|
|
{{ $embeddingStats['stale_or_other_model_chunks'] ?? 0 }} chunks zijn leeg, oud of voor een
|
|
ander model.
|
|
</p>
|
|
</div>
|
|
|
|
<div class="grid gap-4 lg:grid-cols-2">
|
|
<div class="border rounded p-4 space-y-3">
|
|
<div>
|
|
<h4 class="font-medium">Alleen ontbrekende chunks genereren</h4>
|
|
<p class="mt-1 text-sm text-slate-600">Plaats alleen artikelen zonder chunks opnieuw in de
|
|
queue.</p>
|
|
</div>
|
|
<button type="button" wire:click="reindexMissingEmbeddings"
|
|
class="rounded bg-slate-900 px-3 py-2 text-sm text-white">
|
|
Ontbrekende chunks genereren
|
|
</button>
|
|
</div>
|
|
|
|
<div class="border rounded p-4 space-y-3">
|
|
<div>
|
|
<h4 class="font-medium">Alles opnieuw genereren</h4>
|
|
<p class="mt-1 text-sm text-slate-600">Plaats alle artikelen opnieuw in de queue. Bestaande
|
|
chunks worden per artikel vervangen tijdens verwerking.</p>
|
|
</div>
|
|
<button type="button" wire:click="reindexAllEmbeddings"
|
|
wire:confirm="Weet je zeker dat je alle artikelchunks opnieuw wilt genereren?"
|
|
class="rounded bg-red-700 px-3 py-2 text-sm text-white">
|
|
Alle chunks opnieuw genereren
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
@endif
|
|
</form>
|
|
</div>
|