Skip to content

feat: add examples directory support and update metadata schema in skill files and bug fixes#322

Closed
frontegg-david wants to merge 3 commits intorelease/1.0.xfrom
bug-fixes
Closed

feat: add examples directory support and update metadata schema in skill files and bug fixes#322
frontegg-david wants to merge 3 commits intorelease/1.0.xfrom
bug-fixes

Conversation

@frontegg-david
Copy link
Copy Markdown
Contributor

@frontegg-david frontegg-david commented Mar 31, 2026

Summary by CodeRabbit

  • New Features

    • Added React-based weather tool with interactive UI components
    • Introduced resource completion/autocomplete for template parameters
    • Added support for session reconnection and reinitialization
    • Added resource templates for catalog browsing (categories, products)
    • Implemented FileSource-driven widget rendering pipeline for React UIs
  • Bug Fixes

    • Improved session termination and recovery handling
  • Documentation

    • Enhanced resource completer documentation with convention-based and override-based patterns

@frontegg-david frontegg-david changed the base branch from main to release/1.0.x March 31, 2026 01:56
@coderabbitai
Copy link
Copy Markdown
Contributor

coderabbitai bot commented Mar 31, 2026

Caution

Review failed

The pull request is closed.

ℹ️ Recent review info
⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro

Run ID: 966bdf9c-59ad-46a1-8bd6-4695199584af

📥 Commits

Reviewing files that changed from the base of the PR and between 6b99368 and 8e79d69.

📒 Files selected for processing (38)
  • apps/demo/src/apps/weather/tools/get-weather.tool.tsx
  • apps/demo/src/apps/weather/tools/get-weather.ui-2.tsx
  • apps/demo/src/apps/weather/tools/get-weather.ui.tsx
  • apps/e2e/demo-e2e-resource-providers/e2e/resource-completion.e2e.spec.ts
  • apps/e2e/demo-e2e-resource-providers/src/apps/main/index.ts
  • apps/e2e/demo-e2e-resource-providers/src/apps/main/providers/catalog.provider.ts
  • apps/e2e/demo-e2e-resource-providers/src/apps/main/resources/category-products.resource.ts
  • apps/e2e/demo-e2e-resource-providers/src/apps/main/resources/plain-template.resource.ts
  • apps/e2e/demo-e2e-resource-providers/src/apps/main/resources/product-detail.resource.ts
  • apps/e2e/demo-e2e-transport-recreation/e2e/session-reconnect.e2e.spec.ts
  • apps/e2e/demo-e2e-ui/e2e/widget-rendering.e2e.spec.ts
  • apps/e2e/demo-e2e-ui/src/apps/widgets/index.ts
  • apps/e2e/demo-e2e-ui/src/apps/widgets/tools/react-weather.tool.ts
  • apps/e2e/demo-e2e-ui/src/apps/widgets/tools/react-weather.ui.tsx
  • libs/sdk/src/common/interfaces/resource.interface.ts
  • libs/sdk/src/common/tokens/server.tokens.ts
  • libs/sdk/src/notification/notification.service.ts
  • libs/sdk/src/resource/__tests__/resource.instance.completer.spec.ts
  • libs/sdk/src/resource/resource.instance.ts
  • libs/sdk/src/scope/flows/__tests__/http.request.reconnect.spec.ts
  • libs/sdk/src/scope/flows/http.request.flow.ts
  • libs/sdk/src/tool/ui/ui-shared.ts
  • libs/sdk/src/transport/adapters/transport.local.adapter.ts
  • libs/sdk/src/transport/flows/handle.streamable-http.flow.ts
  • libs/sdk/src/transport/transport.local.ts
  • libs/sdk/src/transport/transport.remote.ts
  • libs/sdk/src/transport/transport.types.ts
  • libs/ui/src/react/hooks/context.tsx
  • libs/ui/src/react/hooks/tools.tsx
  • libs/uipack/src/adapters/template-renderer.ts
  • libs/uipack/src/bridge-runtime/__tests__/iife-generator.spec.ts
  • libs/uipack/src/bridge-runtime/iife-generator.ts
  • libs/uipack/src/component/__tests__/renderer.spec.ts
  • libs/uipack/src/component/__tests__/transpiler.spec.ts
  • libs/uipack/src/component/transpiler.ts
  • libs/uipack/src/shell/__tests__/builder.spec.ts
  • libs/uipack/src/shell/__tests__/data-injector.spec.ts
  • libs/uipack/src/shell/data-injector.ts

📝 Walkthrough

Walkthrough

This PR refactors the weather tool to externalize its React UI into separate template files, implements dual-path resource argument completers with convention-based and override-based discovery, enables MCP session reinitialization with ID reuse, and enhances the UI bundling system to auto-detect and reuse pre-existing MCP bridges.

Changes

Cohort / File(s) Summary
Weather Tool Refactoring
apps/demo/src/apps/weather/tools/get-weather.tool.tsx, get-weather.ui.tsx, get-weather.ui-2.tsx
Removed inline React UI component and imports from tool definition; exported WeatherInput/WeatherOutput types; changed UI template config from component reference to external file path; introduced standalone Card and Badge components and moved WeatherWidget to external template file.
React Weather Tool (E2E)
apps/e2e/demo-e2e-ui/src/apps/widgets/tools/react-weather.tool.ts, react-weather.ui.tsx
Added new weather tool with Zod schemas for input/output; implemented execute method with hardcoded data for London/Tokyo locations; created corresponding UI component using Card/Badge with conditional loading/data rendering.
Resource Argument Completers
libs/sdk/src/resource/resource.instance.ts, resource.interface.ts, libs/sdk/src/resource/__tests__/resource.instance.completer.spec.ts
Implemented two-pattern completer resolution: convention-based ${argName}Completer methods (prioritized) and override-based getArgumentCompleter(argName) dispatch; instantiate proper ResourceContext with DI for completer invocation; added comprehensive test suite covering both strategies and priority behavior.
Resource Completers (E2E)
apps/e2e/demo-e2e-resource-providers/src/apps/main/resources/category-products.resource.ts, product-detail.resource.ts, plain-template.resource.ts
Introduced three new resource templates with @ResourceTemplate decorators: category-products and product-detail with convention/override completers, and plain-template without completers; supports case-insensitive filtering and cross-category product aggregation.
Catalog Service & App Config
apps/e2e/demo-e2e-resource-providers/src/apps/main/providers/catalog.provider.ts, apps/main/index.ts
Added global-scoped CatalogService with in-memory category/product data and search methods; extended MainApp providers array with CatalogService and resources array with three new resource templates.
Resource Completion E2E Tests
apps/e2e/demo-e2e-resource-providers/e2e/resource-completion.e2e.spec.ts
Added 230-line E2E test suite validating mcp.completion/complete behavior: convention-based/override-based completers, filtering, multi-argument templates, protocol compliance, statelessness, concurrency, and interaction with mcp.resources.read.
Session Reinitialization
libs/sdk/src/common/tokens/server.tokens.ts, notification/notification.service.ts, scope/flows/http.request.flow.ts, transport/adapters/transport.local.adapter.ts, transport/transport.local.ts, transport/transport.remote.ts, transport/transport.types.ts
Added reinitialize token field to ServerRequestTokens; introduced unmarkTerminated(sessionId) to NotificationService to allow session ID reuse; updated HTTP request flow to unmark terminated sessions on initialize and keep session references intact; added reregisterServer() method to transporter interfaces for post-reinitialization recovery.
Streamable HTTP Flow Updates
libs/sdk/src/transport/flows/handle.streamable-http.flow.ts
Refactored session resolution: initialize requests reuse existing session or create new; non-initialize requests follow prior header-based lookup; conditional resetForReinitialization() based on reinitialize token; added reregisterServer() call after reset.
Session Management Tests
libs/sdk/src/scope/flows/__tests__/http.request.reconnect.spec.ts
Updated test expectations for reinitialization semantics: initialize on terminated session now succeeds with session ID reuse; non-initialize on terminated session fails with 404; removed session-clear assertions; added unmarkTerminated callback validation.
Session Reconnect E2E Tests
apps/e2e/demo-e2e-transport-recreation/e2e/session-reconnect.e2e.spec.ts
Significantly reworked test suite (-852/+362 lines): removed legacy SSE helpers; updated assertions for 404 failures on non-initialize after DELETE; verified re-initialization succeeds and reuses session ID; added concurrent calls, multi-cycle DELETE/reconnect, and session isolation tests.
Widget Rendering E2E Tests
apps/e2e/demo-e2e-ui/e2e/widget-rendering.e2e.spec.ts, apps/e2e/demo-e2e-ui/src/apps/widgets/index.ts
Added 180-line E2E test suite validating React widget pipeline: FileSource resource reading for HTML output; tool calls with output validation; discovery of tool metadata and resource templates; verified no leaked server paths in bundled HTML; added ReactWeatherTool to WidgetsApp tools.
UI Registry & Template Rendering
libs/sdk/src/tool/ui/ui-shared.ts, libs/uipack/src/adapters/template-renderer.ts
Refactored template extraction in ToolUIRegistry.renderAndRegisterAsync to use intermediate variable; updated documentation to clarify supported template inputs (FileSource, function, string); added buildCspConfig() helper for CSP domain extraction from resolver overrides.
React Component Transpilation
libs/uipack/src/component/transpiler.ts, __tests__/transpiler.spec.ts, __tests__/renderer.spec.ts
Switched from React.createElement to auto JSX runtime (__h); replaced direct React import with dynamic data-source polling (window.openai.toolOutput, window.__mcpToolOutput, bridge callback, event listener); updated esbuild to use automatic JSX + extended externals; added alias resolver for @frontmcp/ui subpaths.
Bridge IIFE Generation
libs/uipack/src/bridge-runtime/iife-generator.ts, __tests__/iife-generator.spec.ts
Added DOM-ready indicator and root pre-population; deferred ext-apps handshake until DOMContentLoaded; renamed performHandshake() to sendHandshake() with 10s timeout and capability negotiation; updated callTool() to use MCP tools/call method; added 54-line test suite validating IIFE structure and adapter configuration.
UI Bridge Hook Updates
libs/ui/src/react/hooks/context.tsx, tools.tsx
Added detection of pre-existing IIFE FrontMcpBridge via globalThis inspection; reuse shared bridge or create new; skip disposal of shared instance; added bridge:ready event handler for late initialization; removed debug console.log from useCallTool.
Shell & Data Injection
libs/uipack/src/shell/data-injector.ts, __tests__/data-injector.spec.ts, __tests__/builder.spec.ts
Updated buildDataInjectionScript to inject window.__mcpAppsEnabled = true; added test suite validating injected globals and script tag structure; added builder test asserting __mcpAppsEnabled ordering before __mcpToolName.

Sequence Diagram(s)

sequenceDiagram
    participant Client as Client Request
    participant HttpFlow as HttpRequestFlow
    participant Notif as NotificationService
    participant Transport as Transporter
    participant Adapter as TransportAdapter

    Client->>HttpFlow: DELETE /{sessionId}
    HttpFlow->>Notif: terminateSession(sessionId)
    Notif-->>HttpFlow: success
    HttpFlow->>Transport: destroy()
    Transport->>Adapter: destroy()

    rect rgba(150, 150, 255, 0.5)
    Note over Client,Adapter: Later: Re-initialization
    Client->>HttpFlow: initialize (with mcp-session-id)
    HttpFlow->>Notif: unmarkTerminated(sessionId)
    Notif-->>HttpFlow: removed from terminated set
    HttpFlow->>Transport: resetForReinitialization()
    Transport->>Adapter: resetForReinitialization()
    Adapter-->>Transport: ready
    Transport->>Adapter: reregisterServer()
    Adapter->>Notif: registerServer(sessionId, server)
    Notif-->>Adapter: registered
    Adapter-->>Transport: registered
    Transport-->>HttpFlow: reinitialized
    HttpFlow-->>Client: initialize success (same session ID)
    end
Loading
sequenceDiagram
    participant SDK as ResourceInstance
    participant Class as ResourceClass
    participant DI as DI Scope
    participant Completer as Completer Method

    SDK->>SDK: getArgumentCompleter('categoryName')
    
    rect rgba(100, 200, 100, 0.5)
    Note over SDK,Completer: Convention-based (Prioritized)
    SDK->>Class: check for categoryNameCompleter method
    Class-->>SDK: method exists
    SDK->>DI: create ResourceContext instance
    DI-->>SDK: instance with providers
    SDK->>Completer: invoke categoryNameCompleter(partial)
    Completer->>DI: this.get(CatalogService)
    DI-->>Completer: service
    Completer-->>SDK: { values: [...], total: N }
    SDK-->>Class: return wrapped completer
    end
Loading
sequenceDiagram
    participant Window as Window/IIFE
    participant Bridge as FrontMcpBridge
    participant Provider as McpBridgeProvider
    participant Hook as useCallTool

    Window->>Window: Check globalThis.FrontMcpBridge
    alt Existing IIFE Bridge
        Window->>Provider: existing bridge found
        Provider->>Provider: skip creating new bridge
        alt Bridge already initialized
            Provider->>Hook: use existing bridge
        else Bridge not initialized
            Provider->>Window: register bridge:ready listener
            Window->>Provider: fire bridge:ready event
            Provider->>Hook: use shared bridge
        end
    else No IIFE Bridge
        Provider->>Bridge: create new FrontMcpBridge
        Bridge-->>Provider: bridge instance
        Provider->>Hook: use created bridge
    end
Loading

Estimated code review effort

🎯 4 (Complex) | ⏱️ ~65 minutes

Possibly related PRs

Poem

🐰 A rabbit hopped through refactored trees,
Where sessions now reuse their IDs with ease,
Completers bloom in convention and override,
Bridges detect themselves far and wide,
And widgets render in sunny delight! 🌤️

✨ Finishing Touches
📝 Generate docstrings
  • Create stacked PR
  • Commit on current branch
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Commit unit tests in branch bug-fixes

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

# Conflicts:
#	libs/cli/src/commands/skills/read.ts
#	libs/skills/__tests__/skills-validation.spec.ts
#	libs/skills/catalog/frontmcp-config/examples/configure-auth-modes/remote-enterprise-oauth.md
#	libs/skills/catalog/frontmcp-deployment/examples/build-for-sdk/create-flat-config.md
#	libs/skills/catalog/frontmcp-deployment/examples/deploy-to-cloudflare/basic-worker-deploy.md
#	libs/skills/catalog/frontmcp-deployment/examples/deploy-to-lambda/cdk-deployment.md
#	libs/skills/catalog/frontmcp-deployment/examples/deploy-to-node/docker-compose-with-redis.md
#	libs/skills/catalog/frontmcp-development/examples/create-plugin-hooks/basic-logging-plugin.md
#	libs/skills/catalog/frontmcp-development/examples/create-plugin/plugin-with-context-extension.md
#	libs/skills/catalog/frontmcp-production-readiness/examples/production-cli-binary/binary-build-config.md
#	libs/skills/catalog/frontmcp-production-readiness/examples/production-cli-binary/stdio-transport-error-handling.md
#	libs/skills/catalog/frontmcp-production-readiness/examples/production-lambda/scaling-and-monitoring.md
#	libs/skills/catalog/frontmcp-production-readiness/examples/production-node-sdk/package-json-config.md
#	libs/skills/catalog/frontmcp-production-readiness/examples/production-node-server/docker-multi-stage.md
#	libs/skills/catalog/frontmcp-production-readiness/examples/production-vercel/vercel-edge-config.md
#	libs/skills/catalog/frontmcp-testing/examples/test-cli-binary/binary-startup-test.md
@github-actions
Copy link
Copy Markdown
Contributor

Performance Test Results

Status: ✅ All tests passed

Summary

Project Tests Passed Warnings Failed Leaks
✅ demo-e2e-agents 4 4 0 0 0
✅ demo-e2e-cache 11 11 0 0 0
✅ demo-e2e-codecall 4 4 0 0 0
✅ demo-e2e-config 4 4 0 0 0
✅ demo-e2e-direct 3 3 0 0 0
✅ demo-e2e-elicitation 1 1 0 0 0
✅ demo-e2e-errors 4 4 0 0 0
✅ demo-e2e-hooks 3 3 0 0 0
✅ demo-e2e-multiapp 4 4 0 0 0
✅ demo-e2e-notifications 3 3 0 0 0
✅ demo-e2e-openapi 2 2 0 0 0
✅ demo-e2e-providers 4 4 0 0 0
✅ demo-e2e-public 4 4 0 0 0
✅ demo-e2e-redis 15 15 0 0 0
✅ demo-e2e-remember 4 4 0 0 0
✅ demo-e2e-remote 5 5 0 0 0
✅ demo-e2e-serverless 2 2 0 0 0
✅ demo-e2e-skills 15 15 0 0 0
✅ demo-e2e-standalone 2 2 0 0 0
✅ demo-e2e-transport-recreation 3 3 0 0 0
✅ demo-e2e-ui 4 4 0 0 0

Total: 101 tests across 21 projects

📊 View full report in workflow run


Generated at: 2026-03-31T03:40:53.834Z
Commit: a7404192

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant