github/dbx
4
0
Fork 0
mirror of https://github.com/t8y2/dbx.git synced 2026-10-22 19:58:51 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix(ai): make reasoning expand/collapse consistent across messages

Browse Source 
fix(ai): make reasoning expand/collapse consistent across messages

Replace per-message expandedReasoning Set with a global reasoningExpanded
boolean ref so all messages share the same toggle state. Default to collapsed.
This avoids the flip-flop where reasoning auto-expands during streaming and
collapses afterward, requiring repeated manual toggles.

- Replace expandedReasoning (Set<number>) with reasoningExpanded (boolean)
- Remove per-index toggleReasoning; use global flip instead
- Template uses reasoningExpanded instead of expandedReasoning.has(i) || msg.isThinking
@
This commit is contained in:
Abeautifulsnow
2026-07-07 13:36:53 +08:00
committed by GitHub
parent 24ac0f7413
commit 09f9e44661
1 changed files with 7 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/desktop/src/components/editor/AiAssistant.vue
+7 -13
View File
@@ -511,7 +511,7 @@ function appendAssistantReasoning(assistantIdx: number, delta: string) {
scrollToBottom(); scrollToBottom();
} }
const expandedReasoning = ref<Set<number>>(new Set()); const reasoningExpanded = ref(false);
const expandedSteps = ref<Set<string>>(new Set()); const expandedSteps = ref<Set<string>>(new Set());
function toggleStep(key: string) { function toggleStep(key: string) {
@@ -626,14 +626,8 @@ function agentEventToStep(event: AgentEvent, index: number): AiAgentStepItem | u
}; };
} }
function toggleReasoning(index: number) { function toggleReasoning() {
const next = new Set(expandedReasoning.value); reasoningExpanded.value = !reasoningExpanded.value;
if (next.has(index)) {
next.delete(index);
} else {
next.add(index);
}
expandedReasoning.value = next;
} }
function scrollToBottom() { function scrollToBottom() {
@@ -1324,16 +1318,16 @@ async function openExternalUrl(url: string) {
<div v-else-if="msg.content || msg.reasoning || msg.isThinking" class="flex"> <div v-else-if="msg.content || msg.reasoning || msg.isThinking" class="flex">
<div class="max-w-[95%] min-w-0 rounded-lg bg-muted px-3 py-2 text-xs leading-relaxed"> <div class="max-w-[95%] min-w-0 rounded-lg bg-muted px-3 py-2 text-xs leading-relaxed">
<div v-if="msg.reasoning || msg.isThinking" class="mb-2"> <div v-if="msg.reasoning || msg.isThinking" class="mb-2">
<button class="flex items-center gap-1 text-[11px] text-muted-foreground hover:text-foreground transition-colors" @click="toggleReasoning(i)"> <button class="flex items-center gap-1 text-[11px] text-muted-foreground hover:text-foreground transition-colors" @click="toggleReasoning()">
<ChevronRight class="h-3 w-3 transition-transform duration-200" :class="{ 'rotate-90': expandedReasoning.has(i) || msg.isThinking }" /> <ChevronRight class="h-3 w-3 transition-transform duration-200" :class="{ 'rotate-90': reasoningExpanded }" />
<Loader2 v-if="msg.isThinking" class="h-3 w-3 animate-spin" /> <Loader2 v-if="msg.isThinking" class="h-3 w-3 animate-spin" />
<span>{{ t("ai.reasoningProcess") }}</span> <span>{{ t("ai.reasoningProcess") }}</span>
</button> </button>
<div <div
class="overflow-hidden transition-[max-height,opacity] duration-200 ease-in-out" class="overflow-hidden transition-[max-height,opacity] duration-200 ease-in-out"
:style="{ :style="{
maxHeight: expandedReasoning.has(i) || msg.isThinking ? '20000px' : '0px', maxHeight: reasoningExpanded ? '20000px' : '0px',
opacity: expandedReasoning.has(i) || msg.isThinking ? '1' : '0', opacity: reasoningExpanded ? '1' : '0',
}" }"
> >
<div class="mt-1.5 pl-4 border-l-2 border-muted-foreground/20 text-[11px] text-muted-foreground whitespace-pre-wrap"> <div class="mt-1.5 pl-4 border-l-2 border-muted-foreground/20 text-[11px] text-muted-foreground whitespace-pre-wrap">