refactor(agentflow): remove unused components, fix connector anchor bug

[jocelynlin-wd]

• Deleted unused Input and ConfirmDialog components to streamline the codebase.
• Updated jest.config.js to improve coverage thresholds and exclude deprecated hooks.
• Enhanced test coverage for useAgentflow and AgentflowContext with new E2E tests.
• Adjusted architecture documentation to reflect the removal of components and updated file structure.

Before: connector bug (render to the top of the nodes on initial load)

initial-flow-data-connector-anchor-bug.mov

After: connector rendered to the middle position

initial-flow-data-connector-anchor-fixed.mov

[gemini-code-assist]

Summary of Changes

Hello, I'm Gemini Code Assist¹! I'm currently reviewing this pull request and will post my feedback shortly. In the meantime, here's a summary to help you and other reviewers quickly get up to speed!

This pull request streamlines the agentflow package by removing unused UI components and a deprecated API hook, thereby reducing technical debt. It significantly enhances the testing infrastructure by introducing new end-to-end tests for critical context and hook functionalities, ensuring greater stability. Furthermore, it addresses a visual bug that caused connector anchors to misalign, leading to a more polished and reliable user interface.

Highlights

• Component Removal: The Input and ConfirmDialog components have been deleted, contributing to a leaner and more focused codebase.
• Test Configuration Update: The jest.config.js file was updated to refine test coverage thresholds and explicitly exclude deprecated API hooks from coverage reports.
• Enhanced Test Coverage: Comprehensive E2E tests were introduced for useAgentflow and AgentflowContext, significantly boosting the test coverage and robustness of core functionalities.
• Connector Anchor Bug Fix: A bug causing connector anchors to render incorrectly at the top of nodes on initial load has been resolved, improving the visual consistency of the flow canvas.
• Documentation Synchronization: The architecture documentation has been updated to accurately reflect the removal of components and the updated file structure.

Changelog

• packages/agentflow/ARCHITECTURE.md
  • Removed entries for Input.tsx and ConfirmDialog.tsx from the atoms/ section.
  • Removed hooks/useApi.ts from the infrastructure/ section.
  • Reordered AgentflowContext.tsx within the store/ section.
• packages/agentflow/TESTS.md
  • Updated test coverage status for src/infrastructure/store/AgentflowContext.tsx and src/useAgentflow.ts to "✅ Done", reflecting new E2E tests.
  • Removed src/infrastructure/api/hooks/useApi.ts and src/atoms/ConfirmDialog.tsx from test considerations.
  • Added a new section "File Extension Convention" explaining .test.ts vs .test.tsx usage.
  • Included ./src/*.ts in the list of paths for coverage thresholds.
• packages/agentflow/jest.config.js
  • Modified coveragePathIgnorePatterns to exclude the entire src/infrastructure/api/hooks/ directory.
  • Added a new entry for ./src/*.ts to coverageThreshold with an 80% floor.
• packages/agentflow/src/atoms/ConfirmDialog.tsx
  • Removed the entire file.
• packages/agentflow/src/atoms/Input.tsx
  • Removed the entire file.
• packages/agentflow/src/atoms/index.ts
  • Removed exports for ConfirmDialog, ConfirmProvider, useConfirm, and Input.
• packages/agentflow/src/features/canvas/components/NodeOutputHandles.tsx
  • Introduced useState and useEffect with ResizeObserver to dynamically track and update node height, ensuring correct positioning of output handles.
  • Removed the immediate updateNodeInternals call from getAnchorPosition.
• packages/agentflow/src/features/canvas/containers/AgentFlowNode.tsx
  • Removed the useUpdateNodeInternals hook and its associated useEffect call, as node internal updates for anchor positioning are now managed by NodeOutputHandles.tsx.
• packages/agentflow/src/features/node-editor/EditNodeDialog.tsx
  • Removed a TODO comment related to integrating the dialog with canvas node interactions.
• packages/agentflow/src/infrastructure/api/hooks/useApi.ts
  • Removed the entire file.
• packages/agentflow/src/infrastructure/api/index.ts
  • Removed the export for useApi.
• packages/agentflow/src/infrastructure/store/AgentflowContext.e2e.test.tsx
  • Added a new file containing end-to-end tests for AgentflowContext, covering composite workflows, load/modify/save roundtrips, multiple edges, rapid connect/disconnect cycles, and edge deletion.
• packages/agentflow/src/useAgentflow.test.tsx
  • Added a new file containing end-to-end tests for the useAgentflow hook, validating its core functionalities.

Activity

• No human activity (comments, reviews, approvals) has been recorded on this pull request yet.

Using Gemini Code Assist

The full guide for Gemini Code Assist can be found on our documentation page, here are some quick tips.

Invoking Gemini

You can request assistance from Gemini at any point by creating a comment using either /gemini <command> or @gemini-code-assist <command>. Below is a summary of the supported commands on the current page.

Feature	Command	Description
Code Review	/gemini review	Performs a code review for the current pull request in its current state.
Pull Request Summary	/gemini summary	Provides a summary of the current pull request in its current state.
Comment	@gemini-code-assist	Responds in comments when explicitly tagged, both in pull request comments and review comments.
Help	/gemini help	Displays a list of available commands.

Customization

To customize Gemini Code Assist for GitHub experience, repository maintainers can create a configuration file and/or provide a custom code review style guide (such as PEP-8 for Python) by creating and adding files to a .gemini/ folder in the base of the repository. Detailed instructions can be found here.

Limitations & Feedback

Gemini Code Assist may make mistakes. Please leave feedback on any instances where its feedback is incorrect or counter productive. You can react with 👍 and 👎 on @gemini-code-assist comments. If you're interested in giving your feedback about your experience with Gemini Code Assist for Github and other Google products, sign up here.

You can also get AI-powered code generation, chat, as well as code reviews directly in the IDE at no cost with the Gemini Code Assist IDE Extension.

Footnotes

1. Review the Privacy Notices, Generative AI Prohibited Use Policy, Terms of Service, and learn how to configure Gemini Code Assist in GitHub here. Gemini can make mistakes, so double check it and use code with caution. ↩

[gemini-code-assist]

Code Review

This pull request effectively streamlines the codebase by removing unused Input and ConfirmDialog components, and the useApi hook. The core fix for the connector anchor bug in NodeOutputHandles.tsx is well-implemented using ResizeObserver, ensuring accurate positioning of connectors based on dynamic node heights. Furthermore, the addition of comprehensive E2E tests for AgentflowContext and unit tests for useAgentflow significantly enhances the overall test coverage and reliability of the application. The architectural documentation and Jest configuration have been updated to reflect these positive changes.