Skip to content

Switch the MCP Apps widgets to the @apify/mcp-widgets package #1369

Description

@MartinKristof

Context

After apify/apify-core#29591 merges and publishes @apify/mcp-widgets, src/web should import the widget components from the package instead of its own copies in src/web/src. The package ships the React components, the WidgetHostProvider contract (openLink, optional requestDisplayMode and maxHeight) and the widget wire types. This server keeps building the single-file HTML for ui://widget/* itself.

Blocked by the merge of the apify-core PR and the first publish of the package.

Tasks

  • Add @apify/mcp-widgets to src/web/package.json and bump @apify/ui-library to the range the package uses (tree-shaking landed in apify-core#28799, the current 1.141.3 bundles the whole library, 1.5 MB minified per widget)
  • src/web/src/utils/init-widget.tsx: wrap the tree in WidgetHostProvider with an adapter from the ext-apps App to WidgetHost (openLink, requestDisplayMode, maxHeight from containerDimensions)
  • src/web/src/widgets/search-actors-widget.tsx: pass toolResult.structuredContent as output to ActorSearchWidget
  • Import Actor, StructuredPricingInfo, ActorDetails and SearchActorsOutput from the package; delete WidgetActor (src/utils/actor_card.ts) and the local StructuredPricingInfo (src/utils/pricing_info.ts)
  • Delete the local copies: components/actor/*, components/layout/*, components/ui/*, pages/ActorSearch/*, hooks/use-widget-props.ts, hooks/use-max-height.ts, utils/cn.ts, the search part of utils/formatting.ts, utils/mock-actor-details.ts
  • Drop Tailwind, PostCSS and autoprefixer from src/web (index.css directives, tailwind.config.js, postcss.config.js, build.js CSS plugin) and pluralize; the package styles readme links to keep the text color, so nothing relies on the preflight reset any more
  • Measure the HTML bundle size before and after and put the numbers in the PR
  • Update src/web/AGENTS.md and the dev loop in DEVELOPMENT.md
  • The Actor run widget stays local until apify/apify-core#29446 moves it; it keeps using WidgetLayout and SkeletonBlock from the package
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

Labels

t-consoleIssues with this label are in the ownership of the console team.

Type

Projects

No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions