From c8c86dbc3fd23001cca7904791ab539300ec60f4 Mon Sep 17 00:00:00 2001
From: Adam Malczewski <github@tradam.dev>
Date: Sun, 7 Jun 2026 16:46:20 +0900
Subject: feat(chat): drop the faded opacity on in-flight messages

Remove the opacity-50 dimming applied to provisional (streaming) chunks
across user/assistant/tool/batch rendering; in-flight content now renders
at full opacity. Test updated to assert no dimming.
---
 src/features/chat/ui.test.ts         | 7 +++----
 src/features/chat/ui/ChatView.svelte | 8 ++++----
 2 files changed, 7 insertions(+), 8 deletions(-)

(limited to 'src/features')

diff --git a/src/features/chat/ui.test.ts b/src/features/chat/ui.test.ts
index 43822a7..c118115 100644
--- a/src/features/chat/ui.test.ts
+++ b/src/features/chat/ui.test.ts
@@ -133,7 +133,7 @@ describe("ChatView", () => {
 		expect(screen.getByText("System context loaded")).toBeInTheDocument();
 	});
 
-	it("marks provisional chunks", () => {
+	it("renders provisional (in-flight) chunks without any dimming", () => {
 		const chunks: RenderedChunk[] = [
 			{
 				seq: null,
@@ -145,10 +145,9 @@ describe("ChatView", () => {
 
 		render(ChatView, { props: { chunks } });
 
-		// Assistant chunks are no longer in a bubble; the provisional marker now
-		// lives on the plain wrapper that directly contains the text.
+		// In-flight chunks render at full opacity (no faded "disabled" look).
 		const wrapper = screen.getByText("Streaming...").closest("div");
-		expect(wrapper).toHaveClass("opacity-50");
+		expect(wrapper).not.toHaveClass("opacity-50");
 	});
 
 	it("renders empty transcript", () => {
diff --git a/src/features/chat/ui/ChatView.svelte b/src/features/chat/ui/ChatView.svelte
index 60da571..76d122d 100644
--- a/src/features/chat/ui/ChatView.svelte
+++ b/src/features/chat/ui/ChatView.svelte
@@ -10,7 +10,7 @@
 	{#if rendered.role === "user"}
 		<!-- User: a speech bubble, left-aligned -->
 		<div class="chat chat-start">
-			<div class="chat-bubble chat-bubble-primary" class:opacity-50={rendered.provisional}>
+			<div class="chat-bubble chat-bubble-primary">
 				{#if rendered.chunk.type === "text"}
 					<p>{rendered.chunk.text}</p>
 				{/if}
@@ -21,7 +21,7 @@
 		     chat-start grid via a transparent, padding-stripped chat-bubble shim so
 		     the card inherits the same left offset as the bubble bodies. -->
 		<div class="chat chat-start [&>.chat-bubble]:max-w-full [&>.chat-bubble]:p-0">
-			<div class="chat-bubble bg-transparent" class:opacity-50={rendered.provisional}>
+			<div class="chat-bubble bg-transparent">
 				{#if rendered.chunk.type === "tool-call"}
 					<div class="w-fit max-w-full rounded-box bg-base-200 p-3 text-sm">
 						<strong>{rendered.chunk.toolName}</strong>
@@ -42,7 +42,7 @@
 		<!-- Assistant / system / error: an INVISIBLE speech bubble — same chat-start
 		     grid as the user bubble, so it inherits identical left spacing. -->
 		<div class="chat chat-start [&>.chat-bubble]:max-w-5xl">
-			<div class="chat-bubble w-full bg-transparent" class:opacity-50={rendered.provisional}>
+			<div class="chat-bubble w-full bg-transparent">
 				{#if rendered.chunk.type === "text"}
 					<p>{rendered.chunk.text}</p>
 				{:else if rendered.chunk.type === "thinking"}
@@ -74,7 +74,7 @@
 			     one row per call paired with its result. Same chat-start grid shim as
 			     the single tool card so it lines up with the other messages. -->
 			<div class="chat chat-start [&>.chat-bubble]:max-w-full [&>.chat-bubble]:p-0">
-				<div class="chat-bubble bg-transparent" class:opacity-50={group.provisional}>
+				<div class="chat-bubble bg-transparent">
 					<ul class="list w-fit max-w-full rounded-box bg-base-200 text-sm">
 						{#each group.entries as entry (entry.call.toolCallId)}
 							<li class="list-row">
-- 
cgit v1.2.3