mirror of
https://github.com/FlowiseAI/Flowise.git
synced 2026-10-12 02:02:17 +00:00
Jocelyn LinandClaude Opus 4.7
7591ddd594
* feat(observe): ExecutionDetail with tree view, headers, and resizable drawer
## Summary
Ports the legacy `ExecutionDetails.jsx` (~984 lines) into the `@flowiseai/observe` SDK as a composable `ExecutionDetail` orchestrator.
- **`ExecutionDetail`**: split-pane (sidebar tree + node detail) with sidebar header that holds the agentflow chip, Copy-ID chip, formatted updated date, and refresh button. Auto-selects the first STOPPED node (or first top-level otherwise) on initial tree build.
- **`ExecutionTreeSidebar`**: `@mui/x-tree-view` `RichTreeView` with a custom `TreeItem2` slot — per-branch border colored from `AGENTFLOW_ICONS`, status-icon variants on each row, virtual `Iteration #N` containers, controlled expand/collapse defaulting to all-expanded.
- **`useExecutionTree`** rewritten to mirror the legacy three-pass `buildTreeData`: `previousNodeIds` parent→child with most-recent disambiguation, iteration grouping under the latest parent instance, sub-tree linking inside virtual containers, iterations-first sibling sort, and recursive `FLOWISE_CREDENTIAL_ID` scrub. Iteration container status is the legacy `ERROR > INPROGRESS > all-FINISHED > UNKNOWN` rollup.
- **`useDrawerWidths`** + `useResizableSidebar({ inverted })` extension drive a resizable `ExecutionsViewer` Drawer (parity with the legacy left-edge drag handle). Adds a public `ExecutionsViewerProps.drawer?: { defaultWidth?, minWidth?, maxWidth? }` override.
- **`AGENTFLOW_ICONS`** lifted from `atoms/NodeIcon.tsx` to `core/primitives/agentflowIcons.ts` so the tree slot can consume it without re-importing through `atoms`.
- **`ExecutionDetailProps.agentflow?: AgentflowRef`** seeds the header chip while the detail endpoint loads (server-side `getExecutionById` doesn't perform the agentflow join — only `getAllExecutions` does).
- Adds `@mui/x-tree-view` as a runtime dep.
## Test plan
- [x] `pnpm -C packages/observe test:coverage` — 331 tests pass, all `coverageThreshold` entries met (85.37% statements / 82.98% branches overall; `useExecutionTree` 96.5% / 85.18%, new `useDrawerWidths` 100% / 90.9%, `ExecutionDetail` 89.18% / 92.5%).
- [x] Manually verify in `packages/observe/examples` (`pnpm dev` after copying `.env.example` to `.env`):
- List → row click opens the resizable Drawer; left-edge handle widens/narrows.
- Tree shows status icons for each row plus rolled-up status on virtual iteration containers; `IconLoader` spins for INPROGRESS rows.
- Agentflow chip is clickable and opens the canvas in a new tab when `VITE_AGENTFLOW_CANVAS_URL` is set; non-clickable otherwise.
- Copy-ID chip flips inline to `Copied!` for 2s. **Behavior change from legacy**: legacy dispatched a Redux/notistack snackbar toast ("ID copied to clipboard") via the host app; the SDK can't assume a snackbar provider exists, so the confirmation is rendered on the chip itself.
- Refresh button re-fetches; date formatted as `MMM d, yyyy h:mm a`.
- Standalone `<ExecutionDetail>` demo by execution id renders the same surface without the list.
Co-Authored-By: Claude Opus 4.7 (1M context) <[email protected]>
* address gemini review feedback
* fix flaky test and console warning in test
* fix drawer min/max edge case bug
* fix Copy ID chip falsely showing 'Copied!' on clipboard reject
Co-Authored-By: Claude Opus 4.7 (1M context) <[email protected]>
* fix(observe): iteration tree parity with legacy
Iteration metadata (parentNodeId/iterationIndex) is nested under `data`
in the runtime payload per IAgentflowExecutedData; the SDK was reading
from the top level so virtual Iteration #N containers never materialized
and iteration children dangled at root. Same shape fix applies to
humanInputAgentflow detection in useNodeData. Iteration parent input
now shows "No data" matching legacy's `data.input.question || '*No
data*'` fallback, and virtual Iteration #N containers are selectable
with empty Input/Output panels.
Co-Authored-By: Claude Opus 4.7 (1M context) <[email protected]>
---------
Co-authored-by: Claude Opus 4.7 (1M context) <[email protected]>
27 lines
667 B
JSON
27 lines
667 B
JSON
{
|
|
"name": "observe-basic-example",
|
|
"private": true,
|
|
"version": "0.0.0",
|
|
"type": "module",
|
|
"scripts": {
|
|
"dev": "vite",
|
|
"build": "vite build",
|
|
"preview": "vite preview"
|
|
},
|
|
"dependencies": {
|
|
"@emotion/react": "^11.10.0",
|
|
"@emotion/styled": "^11.10.0",
|
|
"@mui/icons-material": "^5.15.0",
|
|
"@mui/material": "^5.15.0",
|
|
"react": "^18.2.0",
|
|
"react-dom": "^18.2.0"
|
|
},
|
|
"devDependencies": {
|
|
"@types/react": "^18.2.0",
|
|
"@types/react-dom": "^18.2.0",
|
|
"@vitejs/plugin-react": "^4.0.0",
|
|
"typescript": "^5.0.0",
|
|
"vite": "^5.0.2"
|
|
}
|
|
}
|