feat(agentflow): add requestInterceptor prop for API customization

[jocelynlin-wd]

• Introduced a new requestInterceptor prop in the Agentflow component to allow users to customize outgoing API requests.
• Updated relevant components and types to support the new interceptor functionality.
• Enhanced the API client to handle the interceptor and log errors if thrown during request processing.
• Added tests to ensure the interceptor works as expected and does not recreate the client unnecessarily.

Before:

The change in #5919 no longer allows token to work.

After:

[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 significantly enhances the Agentflow component by providing a powerful new mechanism for API request customization. Users can now inject their own logic to modify outgoing requests, enabling advanced use cases like dynamic authentication or request signing. The changes involve updating the component's public API, refining the internal API client to support this extensibility, and reorganizing core type definitions for better clarity and future growth. This feature empowers developers with greater control over network interactions within the Agentflow environment.

Highlights

• API Request Customization: Introduced a new requestInterceptor prop to the Agentflow component, allowing users to customize outgoing API requests before they are sent. This provides flexibility for adding headers, modifying parameters, or handling authentication dynamically.
• Enhanced API Client: The underlying API client (Axios) was updated to integrate this new interceptor. It now gracefully handles potential errors thrown by the custom interceptor, logging them without disrupting the request flow.
• Type System Refinement: The core type definitions were refactored into separate, more granular files, improving organization and maintainability. New types for RequestInterceptor and updated component props were added to support the new functionality.
• Robust Testing: Comprehensive tests were added to ensure the requestInterceptor functions as expected, including scenarios for its application, default behavior, and error handling. Tests also confirm that the API client is not unnecessarily recreated when the interceptor function changes.

Changelog

• packages/agentflow/README.md
  • Updated documentation to include the new requestInterceptor prop.
• packages/agentflow/src/Agentflow.tsx
  • Added requestInterceptor to AgentflowProps and passed it to AgentflowProvider.
• packages/agentflow/src/AgentflowProvider.tsx
  • Added requestInterceptor prop to AgentflowProviderProps.
  • Imported RequestInterceptor type.
  • Passed requestInterceptor to ApiProvider.
• packages/agentflow/src/core/types/agentflow.ts
  • Added new file to define AgentflowProps and AgentFlowInstance interfaces, including the requestInterceptor type.
• packages/agentflow/src/core/types/api.ts
  • Added new file to define RequestInterceptor type and ApiContextValue interface.
• packages/agentflow/src/core/types/context.ts
  • Added new file to define ConfigContextValue, EditDialogProps, AgentflowState, and AgentflowAction interfaces.
• packages/agentflow/src/core/types/flow.ts
  • Added new file to define Viewport, FlowNode, FlowEdge, FlowData, FlowDataCallback, and FlowConfig interfaces.
• packages/agentflow/src/core/types/index.ts
  • Refactored type exports to consolidate them from individual type files.
• packages/agentflow/src/core/types/node.ts
  • Added new file to define NodeData, NodeInput, NodeOutput, InputAnchor, OutputAnchor, InputParam, and EdgeData interfaces.
• packages/agentflow/src/core/types/validation.ts
  • Added new file to define ValidationResult and ValidationError interfaces.
• packages/agentflow/src/index.ts
  • Exported the new RequestInterceptor type.
• packages/agentflow/src/infrastructure/api/client.test.ts
  • Added tests to verify withCredentials is not set by default.
  • Added tests to confirm requestInterceptor correctly modifies requests.
  • Added tests to ensure requestInterceptor is a no-op when not provided.
  • Added tests to verify error logging when requestInterceptor throws an error.
• packages/agentflow/src/infrastructure/api/client.ts
  • Imported RequestInterceptor type.
  • Modified createApiClient to accept an optional requestInterceptor parameter.
  • Removed the default withCredentials: true from Axios client creation.
  • Implemented request interceptor logic to apply the provided requestInterceptor with error handling.
• packages/agentflow/src/infrastructure/store/ApiContext.test.tsx
  • Updated createApiClient mock expectations to include the requestInterceptor function.
  • Added a test to ensure the API client is not recreated when the requestInterceptor prop changes.
• packages/agentflow/src/infrastructure/store/ApiContext.tsx
  • Imported RequestInterceptor type.
  • Added requestInterceptor prop to ApiProviderProps.
  • Implemented useRef to store the requestInterceptor to prevent unnecessary client recreation on re-renders.
  • Passed the requestInterceptor via the ref to createApiClient.

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 introduces a new requestInterceptor prop to the Agentflow component, enabling customization of outgoing API requests. While this enhances flexibility, it also introduces a significant security risk, as an untrusted or compromised interceptor could manipulate sensitive request configurations, including authentication tokens, potentially leading to data exfiltration or unauthorized actions. This aligns with Rule 5's emphasis on secure authentication flows. Consumers must carefully vet any provided interceptor functions and adhere to security best practices. Additionally, the documentation for this new prop needs improvement, particularly regarding its use for re-enabling cookie-based authentication, which is crucial for maintaining correct authentication flows as per Rule 5. The PR also includes a beneficial refactoring of TypeScript type definitions.

[jhead]

lgtm. I agree with your comment re: trust @jocelynlin-wd