Skip to content

feat(components): add Merge Agent Handler bundle and docs#12020

Open
pritak-merge wants to merge 2 commits intolangflow-ai:mainfrom
pritak-merge:codex/merge-agent-handler-bundle
Open

feat(components): add Merge Agent Handler bundle and docs#12020
pritak-merge wants to merge 2 commits intolangflow-ai:mainfrom
pritak-merge:codex/merge-agent-handler-bundle

Conversation

@pritak-merge
Copy link

@pritak-merge pritak-merge commented Mar 3, 2026

feat(components): add Merge Agent Handler bundle and docs

What changed

Backend

  • Added new merge bundle at src/lfx/src/lfx/components/merge/ with:
    • merge_agent_handler_tool.py
    • mcp_client.py
    • schema_utils.py
    • types.py
    • __init__.py
  • Registered merge in src/lfx/src/lfx/components/__init__.py for bundle discovery.

Frontend

  • Added Merge icon set in src/frontend/src/icons/Merge/.
  • Registered icon lazy import in src/frontend/src/icons/lazyIconImports.ts (Merge -> MergeIcon).
  • Added sidebar bundle entry in src/frontend/src/utils/styleUtils.ts:
    • display_name: "Merge"
    • name: "merge"
    • icon: "Merge"

Docs

  • Added provider documentation page: docs/docs/Components/bundles-merge.mdx.
  • Added docs sidebar entry in docs/sidebars.js.

Tests

  • Added unit tests for Merge helper behavior:
    • src/backend/tests/unit/components/bundles/merge/test_merge_agent_handler_tools.py

How the integration works

This bundle provides Merge Agent Handler Tools for agent tool use in Langflow.

  1. User connects Merge Agent Handler Tools to an Agent node (Tools input).
  2. Component authenticates with Merge using api_key.
  3. Component loads Tool Packs and Registered Users based on selected environment.
  4. Component calls Merge Agent Handler MCP endpoints:
    • tools/list to discover available tools in the selected Tool Pack
    • tools/call to execute selected tools
  5. Tool execution runs in the context of the selected Registered User, which determines which connectors/accounts are available.
  6. Tool output returns to the agent for response synthesis.

Tool Pack role

  • Defines which connector-backed tools are exposed to the agent.

Registered User role

  • Defines whose authenticated connectors the tool runs against.

Example runtime path

  • Prompt: "List my open tickets"
  • Agent decides to call a Merge tool from selected Tool Pack
  • Merge component sends tools/call with selected Registered User context
  • Merge executes via authenticated connector(s)
  • Tool response is returned to Agent and included in final reply

Why this design

  • Keeps Merge integration aligned with Langflow’s existing bundle model and tool-driven agent UX.
  • Supports dynamic MCP tool discovery without hardcoding provider-specific operations.
  • Preserves user-scoped security model by explicitly selecting Registered User.
  • Offers optional dispatch mode for very large tool sets and token/tool-count control.

User impact

  • New Merge bundle appears in Bundles sidebar.
  • New Merge Agent Handler Tools component can be attached directly to Agent Tools.
  • Users can choose:
    • API key
    • Tool Pack
    • Environment (Production / Test)
    • Registered User
  • Component now shows richer dropdown labels (tool/connector context) for better selection clarity.

Testing performed

Local commands

  • make init
  • make lint
  • make unit_tests ⚠️ ran extensively; encountered unrelated pre-existing flaky/healthcheck failure:
    • src/backend/tests/unit/services/telemetry/test_component_inputs_splitting.py::test_property_split_never_exceeds_max_size
  • uv run pytest -n 0 src/backend/tests/unit/components/bundles/merge/test_merge_agent_handler_tools.py -q ✅ (4 passed)
  • LFX_DEV=1 make backend ✅ (/health returned {"status":"ok"})
  • make frontend ✅ (starts on http://localhost:3000, Node version warning present)
  • cd docs && npm install && npm run build ✅ (build success; existing broken-anchor warning unrelated to this bundle)

Documentation added

  • New bundles-merge page includes:
    • Merge overview for Langflow
    • architecture/data-flow diagram
    • Tool Packs and Registered Users concepts
    • prerequisites
    • setup walkthrough
    • parameter table
    • output behavior
    • troubleshooting guidance
    • links to Merge docs/dashboard/MCP

Screenshots

Please attach the following screenshots before merge:

  1. Merge bundle visible in Bundles sidebar
  2. Merge Agent Handler Tools node configuration with populated Tool Pack and Registered User selectors
  3. Agent connected to Merge tools
  4. Successful tool-backed agent run

Summary by CodeRabbit

Release Notes

  • New Features
    • Added Merge integration enabling access to Merge tool packs and registered users in workflows
    • Added complete documentation for configuring and using Merge component
    • Added visual icon for Merge component in the interface

@github-actions github-actions bot added the community Pull Request from an external contributor label Mar 3, 2026
@coderabbitai
Copy link
Contributor

coderabbitai bot commented Mar 3, 2026

Important

Review skipped

Auto incremental reviews are disabled on this repository.

Please check the settings in the CodeRabbit UI or the .coderabbit.yaml file in this repository. To trigger a single review, invoke the @coderabbitai review command.

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

Use the checkbox below for a quick retry:

  • 🔍 Trigger review

Walkthrough

This pull request introduces a new Merge bundle integration, adding backend components for MCP client communication with the Merge API, dynamic Pydantic model generation from JSON schemas, frontend icon components, comprehensive documentation, unit tests, and integration configuration across the platform.

Changes

Cohort / File(s) Summary
Documentation & Configuration
docs/docs/Components/bundles-merge.mdx, docs/sidebars.js
Added new documentation page for Merge bundle covering integration details, prerequisites, workflow, parameters, and troubleshooting; updated sidebar navigation to include the new bundle reference.
Frontend Icons
src/frontend/src/icons/Merge/MergeAgentHandlerIcon.jsx, src/frontend/src/icons/Merge/index.tsx, src/frontend/src/icons/lazyIconImports.ts
Introduced new React SVG icon component for Merge with dark mode support via useDarkStore; added lazy-loaded icon mapping for dynamic imports; re-exported as MergeAgentHandlerIcon for backward compatibility.
Frontend Type & Bundle Updates
src/frontend/src/utils/styleUtils.ts
Introduced CachedIcon type alias for precise icon caching; updated getNodeIcon return type to Promise<CachedIcon>; added Merge entry to SIDEBAR_BUNDLES in two locations.
Backend Component Package Setup
src/lfx/src/lfx/components/__init__.py, src/lfx/src/lfx/components/merge/__init__.py
Registered merge component in dynamic imports system; exposed MergeAgentHandlerToolComponent and MergeAgentHandlerToolsComponent via package exports.
Backend MCP Client
src/lfx/src/lfx/components/merge/mcp_client.py
Implemented MergeAgentHandlerClient for Merge API interaction, including tool pack and registered user fetching, MCP tool listing/invocation, paginated requests, JSON-RPC 2.0 protocol handling, and comprehensive error handling.
Backend Schema Utilities
src/lfx/src/lfx/components/merge/schema_utils.py
Added utilities to dynamically convert JSON Schema to Pydantic models, with support for nested objects, enums, arrays, and dispatch schema generation for MCP tool invocation.
Backend Type Definitions
src/lfx/src/lfx/components/merge/types.py
Defined comprehensive TypedDict schemas for Merge ecosystem entities (tool packs, registered users, MCP tools, JSON-RPC protocol messages) and related structures.
Backend Main Component
src/lfx/src/lfx/components/merge/merge_agent_handler_tool.py
Implemented MergeAgentHandlerToolsComponent orchestrating tool pack selection, registered user management, dynamic tool discovery, and execution via dispatch or individual tool modes; includes validation, error handling, and option map generation.
Backend Unit Tests
src/backend/tests/unit/components/bundles/merge/test_merge_agent_handler_tools.py
Added unit tests validating tool pack option formatting, registered user option formatting, tool validation error messages, and environment input capitalization.

Sequence Diagram(s)

sequenceDiagram
    participant User
    participant Component as MergeAgentHandlerToolsComponent
    participant Client as MergeAgentHandlerClient
    participant API as Merge API
    participant Schema as SchemaUtils

    User->>Component: build_tool(api_key, tool_pack, user, dispatch_mode)
    Component->>Component: Validate inputs
    Component->>Client: get_tool_packs()
    Client->>API: GET /tool-packs (paginated)
    API-->>Client: Tool pack list
    Client-->>Component: list[MergeToolPack]
    Component->>Client: get_registered_users(is_test)
    Client->>API: GET /registered-users (paginated)
    API-->>Client: Registered users list
    Client-->>Component: list[MergeRegisteredUser]
    Component->>Component: Resolve IDs from labels
    Component->>Client: list_mcp_tools(tool_pack_id, user_id)
    Client->>API: POST /mcp (JSON-RPC 2.0 request)
    API-->>Client: MCP tools list
    Client-->>Component: list[McpTool]
    
    alt dispatch_mode enabled
        Component->>Schema: create_dispatch_schema(tool_names)
        Schema-->>Component: Dispatch Pydantic model
        Component->>Component: _build_dispatch_tool()
    else individual tools mode
        Component->>Schema: json_schema_to_pydantic_model(per tool)
        Schema-->>Component: Per-tool Pydantic models
        Component->>Component: _build_individual_tools()
    end
    
    Component-->>User: list[Tool]
Loading

Estimated code review effort

🎯 4 (Complex) | ⏱️ ~75 minutes


Important

Pre-merge checks failed

Please resolve all errors before merging. Addressing warnings is optional.

❌ Failed checks (1 error, 3 warnings)

Check name Status Explanation Resolution
Test Coverage For New Implementations ❌ Error PR introduces 912 lines of backend code with only 4 unit tests covering ~8% of methods, testing only static helpers and configuration assertions while core functionality remains untested. Add comprehensive tests for MergeAgentHandlerClient (HTTP/pagination/errors), build_tool/update_build_config methods, schema utilities, tool execution logic, and frontend icon components; establish 80% minimum coverage threshold.
Docstring Coverage ⚠️ Warning Docstring coverage is 2.44% which is insufficient. The required threshold is 80.00%. Write docstrings for the functions missing them to satisfy the coverage threshold.
Test Quality And Coverage ⚠️ Warning Test coverage is inadequate for the 508-line merge implementation. Only 4 simple validation tests mentioned; critical methods like build_tool, update_build_config, and all mcp_client API methods lack coverage. Expand tests to cover: build_tool with both modes and errors, update_build_config, mcp_client HTTP methods with success/failure cases, schema_utils conversion, async patterns, and edge cases like empty lists and collisions.
Test File Naming And Structure ⚠️ Warning Pull request lacks comprehensive test coverage for critical public methods and introduces substantial code complexity without adequate testing. Add tests for public methods, create integration tests, add frontend tests for components, use pytest fixtures for mocking, and parametrize tests for multiple scenarios.
✅ Passed checks (3 passed)
Check name Status Explanation
Description Check ✅ Passed Check skipped - CodeRabbit’s high-level summary is enabled.
Title check ✅ Passed The title 'feat(components): add Merge Agent Handler bundle and docs' accurately summarizes the main changes: adding a new Merge bundle component and its documentation.
Excessive Mock Usage Warning ✅ Passed Unit tests demonstrate excellent design with minimal, appropriate use of a single FakeValidationError class and real data structures for testing static methods directly.
✨ Finishing Touches
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Post copyable unit tests in a comment

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

Comment @coderabbitai help to get the list of available commands and usage tips.

@github-actions github-actions bot added enhancement New feature or request and removed enhancement New feature or request labels Mar 3, 2026
Copy link
Contributor

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 6

Caution

Some comments are outside the diff and can’t be posted inline due to platform limitations.

⚠️ Outside diff range comments (1)
src/frontend/src/utils/styleUtils.ts (1)

631-633: ⚠️ Potential issue | 🟡 Minor

Line 632 returns CachedIcon | undefined, conflicting with declared Promise<CachedIcon> return type.

Under TypeScript strict mode (enabled in your tsconfig.json), Map.get() returns CachedIcon | undefined. The has() check on line 631 does not narrow the type for the get() call on line 632, causing the function to potentially return Promise<CachedIcon | undefined> instead of the declared Promise<CachedIcon>.

Fix by storing the result in a variable and checking it:

Proposed fix
-  if (iconCache.has(name)) {
-    return iconCache.get(name);
-  }
+  const cached = iconCache.get(name);
+  if (cached) {
+    return cached;
+  }
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.

In `@src/frontend/src/utils/styleUtils.ts` around lines 631 - 633, The current
code returns iconCache.get(name) which yields CachedIcon | undefined, violating
the declared Promise<CachedIcon> return type; fix it in the function that uses
iconCache by first assigning const cached = iconCache.get(name), then check if
(cached !== undefined) return cached (or return Promise.resolve(cached) if the
function is non-async), otherwise continue the existing logic to create/cache
the icon; this ensures the returned value is strictly CachedIcon and not
undefined. Reference the iconCache variable and its get/has calls in this
function when making the change.
🧹 Nitpick comments (2)
src/backend/tests/unit/components/bundles/merge/test_merge_agent_handler_tools.py (2)

15-17: Adopt the component test base contract for this bundle test class.

This class does not inherit from a ComponentTestBase* class and does not define the expected fixtures (component_class, default_kwargs, file_names_mapping).

As per coding guidelines "Inherit from the correct ComponentTestBase family class located in src/backend/tests/base.py ... Provide three required fixtures: component_class, default_kwargs, and file_names_mapping."

🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.

In
`@src/backend/tests/unit/components/bundles/merge/test_merge_agent_handler_tools.py`
around lines 15 - 17, The test class TestMergeAgentHandlerToolsComponent must
adopt the component test base contract: have it inherit from the appropriate
ComponentTestBase family class and add the three required fixtures named
component_class, default_kwargs, and file_names_mapping; implement
component_class to point to the MergeAgentHandler tools component under test,
default_kwargs to supply minimal constructor kwargs for that component, and
file_names_mapping to map expected fixture file names to test assets so the base
class can load them.

19-69: Expand coverage beyond helper formatting paths.

Current tests mostly validate label/error formatting helpers. Please add coverage for component behavior such as to_frontend_node() + update_build_config() and main build/validation flows.

As per coding guidelines "Create comprehensive unit tests for all new backend components." and "Test component build config updates by calling to_frontend_node() to get the node template, then calling update_build_config() to apply configuration changes".

🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.

In
`@src/backend/tests/unit/components/bundles/merge/test_merge_agent_handler_tools.py`
around lines 19 - 69, Add unit tests that exercise
MergeAgentHandlerToolsComponent's behavior beyond formatting helpers by calling
to_frontend_node() to obtain a node template, asserting expected node
fields/options, then invoking update_build_config(node_template,
build_config_changes) to apply changes and asserting the returned/updated build
config reflects those changes; also add tests that run the component's main
build and validation flows (e.g., create a minimal valid input payload, call the
component build/validation entrypoints or methods used in production, and assert
it returns a valid build config or raises expected validation errors). Target
the methods MergeAgentHandlerToolsComponent.to_frontend_node,
MergeAgentHandlerToolsComponent.update_build_config, and the component's
build/validation entrypoints when adding these tests.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.

Inline comments:
In `@docs/docs/Components/bundles-merge.mdx`:
- Around line 1-4: The front matter block at the top (the YAML between the
leading --- markers containing title/slug) is missing required metadata; update
that front matter to include a descriptive `description` string and a numeric
`sidebar_position` field alongside the existing `title` and `slug` so the page
conforms to the docs guideline; edit the front matter in the current file to add
`description: "<short summary of the page>"` and `sidebar_position: <number>`
with appropriate values for ordering.

In `@src/frontend/src/icons/Merge/index.tsx`:
- Around line 6-11: Change the MergeIcon wrapper to use
React.PropsWithChildren<{}> as its generic prop type (instead of
React.SVGProps<SVGSVGElement>), read dark mode as a boolean from useDarkStore
(e.g., const isDark = useDarkStore(state => state.dark)), and pass that boolean
to the underlying MergeIconSVG via the isDark prop (rename isdark → isDark)
while forwarding ref and other props; update references to MergeIcon,
MergeIconSVG, and useDarkStore accordingly so the TypeScript contract and
dark-mode prop match the icon conventions.

In `@src/frontend/src/icons/Merge/MergeAgentHandlerIcon.jsx`:
- Around line 3-9: The MergeIcon component forwards a custom string prop
`isdark` to the DOM and uses the wrong casing; change to the `isDark` boolean
prop contract and stop forwarding it to the <svg>. In the forwardRef function
(MergeIcon) destructure props to pull out isDark (const { isDark, ...svgProps }
= props), use fill based on the boolean (e.g., fill={isDark ? "#ffffff" :
"#0A0A0A"}), and spread only svgProps into the <svg> so the custom isDark prop
is not forwarded to the DOM.

In `@src/lfx/src/lfx/components/merge/mcp_client.py`:
- Line 4: Replace the direct import of Self from typing with a compatibility
fallback that imports Self from typing if available else from typing_extensions
so Python 3.10 users don't crash; update the import statement in mcp_client.py
(the line currently importing "Self" alongside "TYPE_CHECKING, Any, cast") to
attempt to import Self from typing and fall back to typing_extensions, ensuring
all uses of Self in the file continue working.

In `@src/lfx/src/lfx/components/merge/merge_agent_handler_tool.py`:
- Around line 351-354: The dropdown labels built in
MergeAgentHandlerToolsComponent._summarize_option_items creation use truncated
tool_pack_id (tool_pack_id[:8]) to form the dict key `label`, causing silent
overwrites in the `options` dict when labels collide; fix by making labels
unique before inserting into `options` — e.g., detect existing `label`
collisions and disambiguate by appending more of `tool_pack_id` (or the full
id), a sequence number, or otherwise include a unique suffix (use the same
strategy for the other occurrence around lines building `label`/`options`), so
every `tool_pack_id` maps to a distinct key without losing entries.

---

Outside diff comments:
In `@src/frontend/src/utils/styleUtils.ts`:
- Around line 631-633: The current code returns iconCache.get(name) which yields
CachedIcon | undefined, violating the declared Promise<CachedIcon> return type;
fix it in the function that uses iconCache by first assigning const cached =
iconCache.get(name), then check if (cached !== undefined) return cached (or
return Promise.resolve(cached) if the function is non-async), otherwise continue
the existing logic to create/cache the icon; this ensures the returned value is
strictly CachedIcon and not undefined. Reference the iconCache variable and its
get/has calls in this function when making the change.

---

Nitpick comments:
In
`@src/backend/tests/unit/components/bundles/merge/test_merge_agent_handler_tools.py`:
- Around line 15-17: The test class TestMergeAgentHandlerToolsComponent must
adopt the component test base contract: have it inherit from the appropriate
ComponentTestBase family class and add the three required fixtures named
component_class, default_kwargs, and file_names_mapping; implement
component_class to point to the MergeAgentHandler tools component under test,
default_kwargs to supply minimal constructor kwargs for that component, and
file_names_mapping to map expected fixture file names to test assets so the base
class can load them.
- Around line 19-69: Add unit tests that exercise
MergeAgentHandlerToolsComponent's behavior beyond formatting helpers by calling
to_frontend_node() to obtain a node template, asserting expected node
fields/options, then invoking update_build_config(node_template,
build_config_changes) to apply changes and asserting the returned/updated build
config reflects those changes; also add tests that run the component's main
build and validation flows (e.g., create a minimal valid input payload, call the
component build/validation entrypoints or methods used in production, and assert
it returns a valid build config or raises expected validation errors). Target
the methods MergeAgentHandlerToolsComponent.to_frontend_node,
MergeAgentHandlerToolsComponent.update_build_config, and the component's
build/validation entrypoints when adding these tests.

ℹ️ Review info

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 2fc6ca8 and 651f403.

⛔ Files ignored due to path filters (1)
  • src/frontend/src/icons/Merge/merge-agent-handler-icon.svg is excluded by !**/*.svg
📒 Files selected for processing (14)
  • docs/docs/Components/bundles-merge.mdx
  • docs/sidebars.js
  • src/backend/tests/unit/components/bundles/merge/__init__.py
  • src/backend/tests/unit/components/bundles/merge/test_merge_agent_handler_tools.py
  • src/frontend/src/icons/Merge/MergeAgentHandlerIcon.jsx
  • src/frontend/src/icons/Merge/index.tsx
  • src/frontend/src/icons/lazyIconImports.ts
  • src/frontend/src/utils/styleUtils.ts
  • src/lfx/src/lfx/components/__init__.py
  • src/lfx/src/lfx/components/merge/__init__.py
  • src/lfx/src/lfx/components/merge/mcp_client.py
  • src/lfx/src/lfx/components/merge/merge_agent_handler_tool.py
  • src/lfx/src/lfx/components/merge/schema_utils.py
  • src/lfx/src/lfx/components/merge/types.py

@github-actions github-actions bot added enhancement New feature or request and removed enhancement New feature or request labels Mar 3, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

community Pull Request from an external contributor enhancement New feature or request

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant