chore: various fixes and improvements for v2 runs - #2605
Conversation
🎩 PreviewA preview build has been created at: |
There was a problem hiding this comment.
Pull request overview
This PR bundles a set of UI and UX improvements across the v2 Run View and related shared components/stores, including better context-panel behavior (task details/logs), richer run metadata display, and multiple layout/styling tweaks.
Changes:
- Refactors task “Open Logs” behavior to route through the context panel (with a new “Pop out” logs action) and adds selection clearing on context-panel close.
- Enhances Run View details with run-source messaging derived from run annotations, and upgrades the AI Assistant’s suggested prompts based on run status.
- Improves UI consistency and overflow handling (sticky header background, InfoBox/CopyText wrapping, tool/action button styling).
Reviewed changes
Copilot reviewed 13 out of 13 changed files in this pull request and generated 2 comments.
Show a summary per file
| File | Description |
|---|---|
| src/routes/v2/shared/windows/components/WindowStickyHeader.tsx | Uses theme background token for docked sticky header. |
| src/routes/v2/shared/store/editorStore.ts | Adds pendingTaskDetailTab state + setter to coordinate tab switching. |
| src/routes/v2/pages/RunView/nodes/TaskNode/RunViewTaskNode.tsx | Routes “Open Logs” through selection + pending tab instead of opening a logs window. |
| src/routes/v2/pages/RunView/nodes/TaskNode/context/RunViewTaskDetails.tsx | Makes task details tabs controlled, supports pending-tab selection, and adds “Pop out” logs action. |
| src/routes/v2/pages/RunView/hooks/useRunViewSelectionSync.tsx | Clears editor selection when the context panel window closes. |
| src/routes/v2/pages/RunView/hooks/useAiChatWindow.tsx | Computes AI suggested prompts dynamically from overall run status. |
| src/routes/v2/pages/RunView/components/RunToolsContent.tsx | Adjusts tool button sizing and centralizes cancel styling. |
| src/routes/v2/pages/RunView/components/RunDetailsContent.tsx | Fetches run annotations to display run source message in details. |
| src/routes/v2/pages/RunView/components/RunActionsBar.tsx | Promotes common actions (inspect/clone/cancel/rerun) into the main action bar. |
| src/routes/v2/pages/Editor/components/EditorMenuBar/components/QuickRunButton.tsx | Adds a mini “submit with arguments” button when inputs exist and there are no errors. |
| src/components/shared/RunSource.tsx | Adds a run-source message API and exports getRunSourceBucket. |
| src/components/shared/InfoBox.tsx | Improves wrapping/overflow behavior for title/content rows. |
| src/components/shared/CopyText/CopyText.tsx | Ensures CopyText wrapper respects container width constraints. |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
| useEffect(() => { | ||
| if (pendingTab) { | ||
| setActiveTab(pendingTab); | ||
| editor.setPendingTaskDetailTab(null); | ||
| } | ||
| }, [pendingTab, editor]); |
| const { | ||
| task, | ||
| status, | ||
| disabledCache, | ||
| executionId, | ||
| showLogsButton, |
| }; | ||
|
|
||
| const FAILED_STATUSES = new Set(["FAILED", "SYSTEM_ERROR", "INVALID"]); | ||
| const IN_PROGRESS_STATUSES = new Set([ |
There was a problem hiding this comment.
🤖 This is an AI-generated code review comment.
This IN_PROGRESS_STATUSES set is a byte-for-byte copy of the private one in executionStatus.ts:65. This file already imports from that module, so this duplicates domain knowledge (the canonical list of in-progress statuses) that will silently drift if the source of truth changes.
Suggest export-ing the existing set from executionStatus.ts and importing it here. (FAILED_STATUSES has no existing equivalent, so keeping it local is fine — or co-locate it in executionStatus.ts too.)
| import type { ExecutionStatusStats } from "@/utils/executionStatus"; | ||
| import { tracking } from "@/utils/tracking"; | ||
|
|
||
| const CANCEL_ACTION_CLASS_NAME = |
There was a problem hiding this comment.
🤖 This is an AI-generated code review comment.
This destructive text/hover recipe is nearly identical to CANCEL_TOOL_CLASS_NAME introduced in RunToolsContent.tsx in this same PR (that one just adds border classes). Worth defining the shared dark-mode override once and appending the border classes where needed, rather than maintaining two copies. Low priority — fine to defer.
| icon: "AppWindow", | ||
| label: "Web app", | ||
| tooltip: "Submitted via Tangle web app", | ||
| message: "Generated via Tangle UI", |
There was a problem hiding this comment.
🤖 This is an AI-generated code review comment.
Minor copy nit: the new message strings diverge in verb/product naming from the existing tooltip for the same bucket — "Generated via Tangle UI" vs tooltip "Submitted via Tangle web app", and "Submitted via AI or CLI" vs tooltip "Submitted by AI or via CLI". Since both describe the same source, consider aligning the wording (or confirm the difference is intentional).
265f9d5 to
87aa036
Compare
87aa036 to
2a4cd40
Compare
There was a problem hiding this comment.
Pull request overview
Copilot reviewed 17 out of 17 changed files in this pull request and generated no new comments.
Suppressed comments (4)
src/routes/v2/pages/RunView/nodes/TaskNode/context/RunViewTaskDetails.tsx:76
- When switching from a non-subgraph task (where the Logs tab exists) to a subgraph task (where Logs is hidden), activeTab can remain set to "logs", causing the Tabs to render no content. Add a guard to reset activeTab to a valid value when Logs is not available.
const taskSpecForIO = { componentRef } as TaskSpec;
const handlePopOutLogs = () => {
if (!executionId) return;
windows.openWindow(<Logs executionId={executionId} status={status} />, {
src/routes/v2/pages/RunView/hooks/useAiChatWindow.tsx:35
- The new getRunSuggestedPrompts() branching is user-facing behavior that depends on server status values; it would be easy to regress (e.g., CANCELLED/SKIPPED handling). Consider adding a small unit test suite covering representative statuses and expected prompt labels/icons (similar to other RunView hook tests).
function getRunSuggestedPrompts(status: string | undefined): SuggestedPrompt[] {
if (status && FAILED_STATUSES.has(status)) {
return [
SUMMARIZE_PROMPT,
{ label: "Why did this run fail?", icon: "CircleAlert" },
src/routes/v2/pages/RunView/hooks/useAiChatWindow.tsx:53
- getRunSuggestedPrompts() treats cancelled/skipped runs as the generic "success" case, which can produce misleading suggestions like "Explain the outputs" for CANCELLED/SKIPPED overall statuses (both are valid server statuses per utils/executionStatus). Add explicit handling for these terminal statuses.
This issue also appears on line 31 of the same file.
function getRunSuggestedPrompts(status: string | undefined): SuggestedPrompt[] {
if (status && FAILED_STATUSES.has(status)) {
return [
SUMMARIZE_PROMPT,
{ label: "Why did this run fail?", icon: "CircleAlert" },
src/components/shared/RunSource.tsx:22
- The web-app run source message says "Generated via Tangle UI", which is inconsistent with the tooltip wording ("Submitted via Tangle web app") and the intent of describing how the run was started/submitted. Consider using consistent "Submitted via …" phrasing.
message: "Generated via Tangle UI",
There was a problem hiding this comment.
Pull request overview
Copilot reviewed 17 out of 17 changed files in this pull request and generated no new comments.
Suppressed comments (2)
src/routes/v2/pages/RunView/nodes/TaskNode/context/RunViewTaskDetails.tsx:48
activeTabis kept in component state acrossentityIdchanges, so switching from a normal task (where you selected the "logs" tab) to a subgraph task (which doesn't render a "logs" tab) can leave Tabs controlled with an invalid value and render an empty panel until the user re-selects a tab. Resetting the active tab whenentityIdchanges avoids this and still lets the pending-tab effect override to "logs" when requested (e.g. from the node-level Open Logs button).
const [activeTab, setActiveTab] = useState("artifacts");
const pendingTab = editor.pendingTaskDetailTab;
useEffect(() => {
if (pendingTab) {
setActiveTab(pendingTab);
src/components/shared/RunSource.tsx:22
- The new user-facing run source message for "web-app" says "Generated via Tangle UI", but the tooltip (and the intent described in the PR) uses "Submitted" wording. Keeping the message aligned with the tooltip reduces confusion about what the source represents (submission origin vs. artifact generation).
message: "Generated via Tangle UI",
Description
This PR is a round of small polish fixes and quality-of-life improvements for the new (v2) runs view. None of them are big new features — they're the little things that make inspecting a run feel smoother and less confusing. In short:
The goal is simply to make the v2 runs view feel more consistent, more polished, and closer to (or better than) the old view it's replacing.
Related Issue and Pull requests
Type of Change
Checklist
Screenshots (if applicable)
Test Instructions
Open a v2 run and check the fixes above feel right:
Additional Comments