_config_panel.php

Code Hygiene Score: 100

Keine Issues gefunden.

Code

<?php

declare(strict_types=1);

// @responsibility: Config Panel UI-Komponente für Chat-Einstellungen

/**
 * Config Panel Partial
 * Required vars: $models, $currentModel, $currentLimit, $selected, $collections,
 *                $currentTemperature, $currentMaxTokens, $systemPrompts, $currentPromptId,
 *                $outputStructures, $authorProfiles, $currentProfileId, $session, $csrfToken
 */
?>
<aside class="config-panel" id="configPanel">
    <div class="config-panel__header">
        <span class="config-panel__title">Einstellungen</span>
        <button type="button" class="config-panel__close" id="configPanelClose" aria-label="Panel schliessen">&times;</button>
    </div>

    <div class="config-panel__body">
        <!-- Modell -->
        <div class="config-panel__group">
            <label for="configModel" class="config-panel__label">Modell</label>
            <select id="configModel" class="config-panel__select" aria-label="Modell waehlen">
                <optgroup label="Anthropic">
                    <?php foreach ($models ?? [] as $modelId => $modelLabel): ?>
                    <?php if (!str_starts_with($modelId, 'ollama:')): ?>
                    <option value="<?= htmlspecialchars($modelId) ?>" <?= $currentModel === $modelId ? 'selected' : '' ?>><?= htmlspecialchars($modelLabel) ?></option>
                    <?php endif; ?>
                    <?php endforeach; ?>
                </optgroup>
                <optgroup label="Ollama (lokal)">
                    <?php foreach ($models ?? [] as $modelId => $modelLabel): ?>
                    <?php if (str_starts_with($modelId, 'ollama:')): ?>
                    <option value="<?= htmlspecialchars($modelId) ?>" <?= $currentModel === $modelId ? 'selected' : '' ?>><?= htmlspecialchars($modelLabel) ?></option>
                    <?php endif; ?>
                    <?php endforeach; ?>
                </optgroup>
            </select>
        </div>

        <!-- Quellen -->
        <div class="config-panel__group">
            <label for="configContextLimit" class="config-panel__label">Quellen</label>
            <select id="configContextLimit" class="config-panel__select" aria-label="Anzahl Quellen">
                <option value="3" <?= $currentLimit === 3 ? 'selected' : '' ?>>3 Quellen</option>
                <option value="5" <?= $currentLimit === 5 ? 'selected' : '' ?>>5 Quellen</option>
                <option value="10" <?= $currentLimit === 10 ? 'selected' : '' ?>>10 Quellen</option>
                <option value="15" <?= $currentLimit === 15 ? 'selected' : '' ?>>15 Quellen</option>
            </select>
        </div>

        <!-- Collections -->
        <div class="config-panel__group">
            <label class="config-panel__label">Sammlungen</label>
            <div class="config-panel__collections" id="configCollections">
                <?php foreach ($collections ?? [] as $col):
                    $colId = $col['collection_id'];
                    $isSelected = in_array($colId, $selected, true);
                    $points = (int) ($col['points_count'] ?? 0);
                    ?>
                <label class="config-panel__checkbox">
                    <input type="checkbox" name="collections[]" value="<?= htmlspecialchars($colId) ?>" <?= $isSelected ? 'checked' : '' ?>>
                    <?= htmlspecialchars($col['display_name']) ?> <span class="config-panel__count">(<?= number_format($points) ?>)</span>
                </label>
                <?php endforeach; ?>
            </div>
        </div>

        <!-- Temperatur & Tokens -->
        <div class="config-panel__group">
            <label class="config-panel__label">Temperatur: <span id="tempValuePanel"><?= number_format($currentTemperature, 1) ?></span></label>
            <input type="range" id="configTemperature" class="config-panel__slider" min="0" max="1" step="0.1" value="<?= $currentTemperature ?>">
            <div class="config-panel__presets">
                <button type="button" class="config-panel__preset<?= $currentTemperature == 0.3 ? ' config-panel__preset--active' : '' ?>" data-temp="0.3" data-tokens="2048">Präzise</button>
                <button type="button" class="config-panel__preset<?= $currentTemperature == 0.5 ? ' config-panel__preset--active' : '' ?>" data-temp="0.5" data-tokens="4096">Ausgewogen</button>
                <button type="button" class="config-panel__preset<?= $currentTemperature == 0.9 ? ' config-panel__preset--active' : '' ?>" data-temp="0.9" data-tokens="4096">Kreativ</button>
            </div>
        </div>

        <!-- Max Tokens -->
        <div class="config-panel__group">
            <label for="configMaxTokens" class="config-panel__label">Max Tokens</label>
            <select id="configMaxTokens" class="config-panel__select">
                <option value="1024" <?= $currentMaxTokens === 1024 ? 'selected' : '' ?>>1024</option>
                <option value="2048" <?= $currentMaxTokens === 2048 ? 'selected' : '' ?>>2048</option>
                <option value="4096" <?= $currentMaxTokens === 4096 ? 'selected' : '' ?>>4096</option>
                <option value="8192" <?= $currentMaxTokens === 8192 ? 'selected' : '' ?>>8192</option>
            </select>
        </div>

        <!-- Qualitätsprüfung -->
        <div class="config-panel__group">
            <label class="config-panel__checkbox config-panel__checkbox--large">
                <input type="checkbox" id="configQualityCheck" name="quality_check" value="1">
                Qualitätsprüfung (LLM-Validierung)
            </label>
        </div>

        <hr class="config-panel__divider">

        <!-- System Prompt -->
        <div class="config-panel__group">
            <label for="configSystemPrompt" class="config-panel__label">System Prompt</label>
            <select id="configSystemPrompt" class="config-panel__select" aria-label="System Prompt waehlen">
                <?php foreach ($systemPrompts ?? [] as $prompt): ?>
                <option value="<?= $prompt['id'] ?>" <?= $currentPromptId === (int) $prompt['id'] ? 'selected' : '' ?>><?= htmlspecialchars($prompt['name']) ?></option>
                <?php endforeach; ?>
            </select>
            <button type="button" class="config-panel__toggle" data-config-type="system_prompt" aria-expanded="false" aria-controls="systemPromptEditor">&#9998;</button>
            <div id="systemPromptEditor" class="config-panel__editor config-panel__editor--hidden" aria-hidden="true">
                <textarea id="systemPromptContent" class="config-panel__textarea" rows="8"></textarea>
                <div class="config-panel__actions">
                    <span class="config-panel__version" id="systemPromptVersion"></span>
                    <button type="button" class="config-panel__save" data-config-type="system_prompt">Speichern</button>
                </div>
            </div>
        </div>

        <!-- Ausgabeformat -->
        <div class="config-panel__group">
            <label for="configStructure" class="config-panel__label">Ausgabeformat</label>
            <select id="configStructure" class="config-panel__select">
                <option value="0">Frei (kein Format)</option>
                <?php foreach ($outputStructures ?? [] as $structure): ?>
                <option value="<?= $structure['id'] ?>"><?= htmlspecialchars($structure['name']) ?></option>
                <?php endforeach; ?>
            </select>
            <button type="button" class="config-panel__toggle" data-config-type="structure" aria-expanded="false" aria-controls="structureEditor">&#9998;</button>
            <div id="structureEditor" class="config-panel__editor config-panel__editor--hidden" aria-hidden="true">
                <textarea id="structureContent" class="config-panel__textarea" rows="8"></textarea>
                <div class="config-panel__actions">
                    <span class="config-panel__version" id="structureVersion"></span>
                    <button type="button" class="config-panel__save" data-config-type="structure">Speichern</button>
                </div>
            </div>
        </div>

        <!-- Autorenprofil -->
        <div class="config-panel__group">
            <label for="configAuthorProfile" class="config-panel__label">Autorenprofil</label>
            <select id="configAuthorProfile" class="config-panel__select">
                <option value="0">Kein Profil</option>
                <?php foreach ($authorProfiles ?? [] as $profile): ?>
                <option value="<?= $profile['id'] ?>" <?= $currentProfileId === (int) $profile['id'] ? 'selected' : '' ?>><?= htmlspecialchars($profile['name']) ?></option>
                <?php endforeach; ?>
            </select>
            <button type="button" class="config-panel__toggle" data-config-type="author_profile" aria-expanded="false" aria-controls="authorProfileEditor">&#9998;</button>
            <div id="authorProfileEditor" class="config-panel__editor config-panel__editor--hidden" aria-hidden="true">
                <textarea id="authorProfileContent" class="config-panel__textarea" rows="8"></textarea>
                <div class="config-panel__actions">
                    <span class="config-panel__version" id="authorProfileVersion"></span>
                    <button type="button" class="config-panel__save" data-config-type="author_profile">Speichern</button>
                </div>
            </div>
        </div>

        <hr class="config-panel__divider">

        <!-- Export -->
        <div class="config-panel__group">
            <label class="config-panel__label">Export</label>
            <div class="config-panel__export">
                <a href="/chat/<?= $session['uuid'] ?? '' ?>/export?format=markdown" class="config-panel__export-btn">Markdown</a>
                <a href="/chat/<?= $session['uuid'] ?? '' ?>/export?format=json" class="config-panel__export-btn">JSON</a>
            </div>
        </div>

        <!-- Theme Toggle -->
        <div class="config-panel__group">
            <label class="config-panel__label">Design</label>
            <button type="button" class="config-panel__theme" id="configThemeToggle">
                <span id="configThemeIcon">&#9790;</span> <span id="configThemeText">Light Mode</span>
            </button>
        </div>
    </div>
</aside>

<!-- Config Panel Toggle Button -->
<button type="button" class="config-panel__toggle-btn" id="configPanelToggle" aria-expanded="false" aria-controls="configPanel" title="Konfiguration">
    <span class="visually-hidden">Konfiguration anzeigen</span>
    <span aria-hidden="true">&#9881;</span>
</button>
← Übersicht