feat: add session config sidebar with override level, tools, and permissions

Implements issue #13 — right sidebar for session configuration with
override level selection, disabled tools checkboxes, and granted
permissions input. Integrates config into chat page header with toggle
button and non-default indicator.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
shahondin1624
2026-03-12 12:03:40 +01:00
parent 1e62f7d1c1
commit 7b81de9ffd
4 changed files with 243 additions and 2 deletions

View File

@@ -4,12 +4,17 @@
import { resolveRoute } from '$app/paths';
import type { ChatMessage } from '$lib/types';
import type { SubagentResult } from '$lib/proto/llm_multiverse/v1/common_pb';
import { OverrideLevel } from '$lib/proto/llm_multiverse/v1/common_pb';
import type { SessionConfig } from '$lib/proto/llm_multiverse/v1/orchestrator_pb';
import { SessionConfigSchema } from '$lib/proto/llm_multiverse/v1/orchestrator_pb';
import { create } from '@bufbuild/protobuf';
import MessageList from '$lib/components/MessageList.svelte';
import MessageInput from '$lib/components/MessageInput.svelte';
import OrchestrationProgress from '$lib/components/OrchestrationProgress.svelte';
import ThinkingSection from '$lib/components/ThinkingSection.svelte';
import FinalResult from '$lib/components/FinalResult.svelte';
import SessionSidebar from '$lib/components/SessionSidebar.svelte';
import ConfigSidebar from '$lib/components/ConfigSidebar.svelte';
import { processRequest, OrchestratorError } from '$lib/services/orchestrator';
import { OrchestrationState } from '$lib/proto/llm_multiverse/v1/orchestrator_pb';
import { sessionStore } from '$lib/stores/sessions.svelte';
@@ -20,6 +25,16 @@
let orchestrationState: OrchestrationState = $state(OrchestrationState.UNSPECIFIED);
let intermediateResult: string = $state('');
let finalResult: SubagentResult | null = $state(null);
let sessionConfig: SessionConfig = $state(
create(SessionConfigSchema, { overrideLevel: OverrideLevel.NONE })
);
let showConfig = $state(false);
const isNonDefaultConfig = $derived(
sessionConfig.overrideLevel !== OverrideLevel.NONE ||
sessionConfig.disabledTools.length > 0 ||
sessionConfig.grantedPermissions.length > 0
);
function navigateToSession(sessionId: string, replace = false) {
const url = `${resolveRoute('/chat')}?session=${sessionId}`;
@@ -83,7 +98,7 @@
isStreaming = true;
try {
for await (const response of processRequest(sessionId, content)) {
for await (const response of processRequest(sessionId, content, sessionConfig)) {
orchestrationState = response.state;
if (response.intermediateResult) {
intermediateResult = response.intermediateResult;
@@ -119,8 +134,19 @@
<SessionSidebar onSelectSession={handleSelectSession} onNewChat={handleNewChat} />
<div class="flex flex-1 flex-col">
<header class="border-b border-gray-200 bg-white px-4 py-3">
<header class="flex items-center justify-between border-b border-gray-200 bg-white px-4 py-3">
<h1 class="text-lg font-semibold text-gray-900">Chat</h1>
<button
type="button"
onclick={() => (showConfig = !showConfig)}
class="flex items-center gap-1 rounded-lg px-2.5 py-1.5 text-sm
{showConfig ? 'bg-blue-100 text-blue-700' : 'bg-gray-100 text-gray-700 hover:bg-gray-200'}"
>
{#if isNonDefaultConfig}
<span class="h-2 w-2 rounded-full bg-amber-500"></span>
{/if}
Config
</button>
</header>
<MessageList {messages} />
@@ -157,4 +183,11 @@
<MessageInput onSend={handleSend} disabled={isStreaming} />
</div>
{#if showConfig}
<ConfigSidebar
config={sessionConfig}
onConfigChange={(c) => (sessionConfig = c)}
/>
{/if}
</div>