fix(frontend): hide model activity execution noise
This commit is contained in:
@@ -2,10 +2,21 @@ import { useLayoutEffect, useRef } from "react";
|
||||
import { X } from "lucide-react";
|
||||
import ReactMarkdown from "react-markdown";
|
||||
import remarkGfm from "remark-gfm";
|
||||
import type { ActivityEntry } from "../api/types";
|
||||
import type { ActivityEntry, ActivityKind } from "../api/types";
|
||||
import { useSessionStore } from "../store/sessionStore";
|
||||
import { Button } from "../components/ui/button";
|
||||
|
||||
const VISIBLE_MODEL_ACTIVITY_KINDS: ReadonlySet<ActivityKind> = new Set([
|
||||
"prompt",
|
||||
"thinking",
|
||||
"status",
|
||||
"gate",
|
||||
]);
|
||||
|
||||
export function isVisibleModelActivity(entry: ActivityEntry): boolean {
|
||||
return VISIBLE_MODEL_ACTIVITY_KINDS.has(entry.kind);
|
||||
}
|
||||
|
||||
export function isNearBottom(
|
||||
el: Pick<HTMLElement, "scrollHeight" | "clientHeight" | "scrollTop">,
|
||||
threshold = 48,
|
||||
@@ -85,16 +96,19 @@ function ActivityRow({ entry }: { entry: ActivityEntry }) {
|
||||
);
|
||||
}
|
||||
|
||||
/** Left drawer showing the complete in-memory model activity timeline. */
|
||||
/** Left drawer showing the user-facing projection of the in-memory model activity timeline. */
|
||||
export function ModelActivityPanel({ onClose }: { onClose: () => void }) {
|
||||
const activityLog = useSessionStore((s) => s.activityLog);
|
||||
const visibleActivity = activityLog.filter(isVisibleModelActivity);
|
||||
const visibleCount = visibleActivity.length;
|
||||
const visibleTail = visibleActivity.at(-1);
|
||||
const scrollRef = useRef<HTMLDivElement>(null);
|
||||
const followRef = useRef(true);
|
||||
|
||||
useLayoutEffect(() => {
|
||||
const viewport = scrollRef.current;
|
||||
if (viewport && followRef.current) viewport.scrollTop = viewport.scrollHeight;
|
||||
}, [activityLog]);
|
||||
}, [visibleCount, visibleTail]);
|
||||
|
||||
return (
|
||||
<aside className="flex w-2/5 shrink-0 flex-col border-r border-border bg-sidebar">
|
||||
@@ -114,10 +128,10 @@ export function ModelActivityPanel({ onClose }: { onClose: () => void }) {
|
||||
followRef.current = isNearBottom(event.currentTarget);
|
||||
}}
|
||||
>
|
||||
{activityLog.length === 0 ? (
|
||||
{visibleActivity.length === 0 ? (
|
||||
<p className="py-3 text-sm text-muted-foreground">No activity yet.</p>
|
||||
) : (
|
||||
activityLog.map((entry, index) => (
|
||||
visibleActivity.map((entry, index) => (
|
||||
<ActivityRow key={`${index}-${entry.toolCallId ?? entry.kind}`} entry={entry} />
|
||||
))
|
||||
)}
|
||||
|
||||
Reference in New Issue
Block a user