feat(chat): add starring to assistant messages and fix state handling

- Add star/unstar toggle for assistant messages with optimistic UI and server sync
- Track starred state via reactive effect instead of capturing initial message value to satisfy Svelte state rules

Co-Authored-By: Warp <agent@warp.dev>

Author: Jason

src/routes/chat/[id]/message.svelte

@@ -25,6 +25,7 @@
 	import ChevronDownIcon from '~icons/lucide/chevron-down';
 	import RefreshCwIcon from '~icons/lucide/refresh-cw';
 	import PencilIcon from '~icons/lucide/pencil';
+	import StarIcon from '~icons/lucide/star';
 	import * as DropdownMenu from '$lib/components/ui/dropdown-menu';
 	import { AnnotationSchema, type Annotation } from '$lib/types';
 	import ExternalLinkIcon from '~icons/lucide/external-link';
@@ -186,6 +187,11 @@
 
 	let isEditing = $state(false);
 	let editedContent = $state('');
+	let isStarred = $state<boolean>(false);
+
+	$effect(() => {
+		isStarred = message.starred ?? false;
+	});
 
 	function startEditing() {
 		editedContent = message.content;
@@ -274,6 +280,37 @@
 			}
 		}
 	}
+
+	async function toggleStarred() {
+		if (!session.current?.session.token) return;
+		if (message.role !== 'assistant') return;
+
+		const previous = isStarred;
+		isStarred = !isStarred;
+
+		try {
+			const res = await fetch(api.messages.setStarred.url, {
+				method: 'POST',
+				headers: { 'Content-Type': 'application/json' },
+				body: JSON.stringify({
+					action: 'setStarred',
+					messageId: message.id,
+					starred: isStarred,
+				}),
+			});
+
+			if (!res.ok) {
+				console.error('Failed to update starred state');
+				isStarred = previous;
+				return;
+			}
+
+			invalidateQueryPattern(api.messages.getAllFromConversation.url);
+		} catch (e) {
+			console.error('Error updating starred state:', e);
+			isStarred = previous;
+	}
+	}
 </script>
 
 {#if message.role !== 'system' && !(message.role === 'assistant' && message.content.length === 0 && message.reasoning?.length === 0 && !message.error)}
@@ -480,6 +517,27 @@
 				{/snippet}
 				{message.role === 'user' ? 'Branch and regenerate message' : 'Branch off this message'}
 			</Tooltip>
+			{#if message.role === 'assistant' && message.content.length > 0 && !message.error}
+				<Tooltip>
+					{#snippet trigger(tooltip)}
+						<Button
+							size="icon"
+							variant="ghost"
+							class="order-1 size-7"
+							onclick={toggleStarred}
+							{...tooltip.trigger}
+						>
+							<StarIcon
+								class={cn('size-4', {
+									'text-yellow-400 fill-yellow-400': isStarred,
+									'text-muted-foreground/60': !isStarred,
+								})}
+							/>
+						</Button>
+					{/snippet}
+					{isStarred ? 'Unstar message' : 'Star message'}
+				</Tooltip>
+			{/if}
 			{#if message.content.length > 0}
 				<Tooltip>
 					{#snippet trigger(tooltip)}