feat(site): API link on workflow hub cards by nav-tej · Pull Request #1156 · Comfy-Org/workflow_templates

nav-tej · 2026-08-18T18:25:31Z

Adds a quiet API link next to Try now on every workflow card, deep-linking to the #api section that #1149 adds to detail pages. Surfaces run-from-code before a card is even opened and gives crawlers an internal-link path from the hub to the API-intent sections.

Stacked on feat(site): API payload section on workflow detail pages #1149 (base is nav/workflow-api-payload); merge that first, then retarget or merge this
Plain anchor so it works in both the Vue island grid and SSR-rendered cards; @click.stop keeps the card click intact
#api targets already have scroll-mt; section renders on every detail page, so the link is never dead

Validation: build clean, lint clean, 553/553 unit tests, SSR output on /workflows/ carries the anchors (href="/workflows/{slug}/#api").

🤖 Generated with Claude Code

Every /workflows/[slug] page gets an #api section: the workflow's JSON graph lazy-fetched from the existing download endpoint, the canonical GET URL for scripting against it, copy/download buttons, and the cloud share deep link (utm_term=api). No new endpoints; English strings fall back for other locales until the translation pipeline fills them. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

Adds the documented run-from-code path under the payload: comfy-sdk / @comfyorg/sdk install lines and the Python quickstart from docs.comfy.org/development/api-development/sdks, with the API-format export note and links to the SDK docs and API-key page. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

coderabbitai · 2026-08-18T18:25:41Z

Important

Review skipped

Auto reviews are disabled on base/target branches other than the default branch.

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.

⚙️ Run configuration

Configuration used: Organization UI

Review profile: ASSERTIVE

Plan: Pro Plus

Run ID: 3ec691e3-7a3f-4241-a686-6ed1c477cd45

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

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.}

github-actions · 2026-08-18T18:38:54Z

🚀 Preview deployed: https://workflow-templates-a8rpmycof-comfyui.vercel.app

mobeenabdullah

LGTM, verified on the preview build. 30 API links render on desktop and mobile; hrefs are correct and locale-aware (/workflows/{slug}/#api, trailing slash preserved), the #api target exists on detail pages (id="api" + scroll-mt-8 from #1149) so no dead links, and the card root is a div so the inner anchors aren't nested. @click.stop isolates them from the card click. Layout is clean beside the reveal pill.

Only note is merge order: this is stacked on #1149, so #1149 lands first, then retarget this to main.

… CTAs The API section repeated two CTAs the hero already owns (Download JSON, Run on Comfy Cloud). Copy JSON is the only action the payload block adds, so the row is down to that one button and `template.api.runCloud` is gone. The SDK quickstart now speaks each workflow's own graph instead of `<output-node-id>` placeholders: real output node id and type, the prompt node plus the template's own example prompt, a LoadImage input line when the graph has one, and the workflow's title and filename. Graphs come from the repo's templates/ directory at build time (383 pages); the 256 hub-sourced pages have no graph in this repo, so the same pure builder runs in the browser against the payload the section already fetches. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>

…adata Review round on the API section. The interactive part of the section was a 101-line inline script, the largest in the repo and against the house rule that interactive UI below the fold is a Vue island. It is now ApiPayloadPanel.vue mounted with client:visible and a 400px rootMargin, which also replaces the hand-rolled IntersectionObserver and the data-* plumbing the script needed to read its own props. The copy label is reactive state with a reset timer, so a second click inside the 1200ms window no longer strands it on "Copied". Workflow metadata now stays data rather than code in the generated Python: titles, template names, node ids and node types are escaped as Python string literals (JSON string syntax is a valid subset) and generated comments are collapsed to a single line. Node extraction also checks the shape it is handed, since on hub-sourced pages it runs against a fetched payload rather than a graph from this repo. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>

The loader accepted any object with a `nodes` key, so a file shaped `{"nodes": {}}` reached the snippet builder. Extraction already guards the shape, but the loader should not hand that on as a graph in the first place. `loadWorkflowGraph` now requires an array and takes its search directories as an argument so the case is testable without touching cwd. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>

A fetched node with no `id` passed the shape filter and reached the snippet as the literal `"undefined"`. Node selection now requires an id that can actually be addressed through the SDK, so a payload missing ids lands on the documented generic snippet instead. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>

…av/workflow-api-interlinks

Reading graphs from public/workflows/ made the Vercel adapter's file tracer treat them as a runtime dependency of the render function, since it cannot tell the read only happens while pages are prerendered. That took _render from 76MB to 631MB locally and to 1.68GB in CI, past the 250MB function limit, which failed the preview deploy on #1156. The loader now reads only from the repo's templates/ directory. It is the version-controlled source of truth, and it sits outside the site package, so the tracer leaves it alone. Snippet coverage is unchanged: 383 pages built from graphs, the rest filled in client-side. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>

nav-tej · 2026-08-19T00:59:44Z

On hold along with #1149 (its base), pending Uy's version of this surface.

Two notes for whoever picks this up:

The preview link in the bot comment above was stale, and the rebuild I triggered failed at the deploy step rather than the build step: the render function had grown past Vercel's 250MB limit. That is fixed on the base branch (9d97f2e) and merged in here, so CI should produce a fresh preview on this push.
This branch was several commits behind its base, which is why the preview showed none of the API-section work even before that. It is caught up now.

nav-tej and others added 3 commits August 18, 2026 00:17

feat(site): API link on workflow cards

4ad12d2

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

nav-tej requested review from christian-byrne and dante01yoon as code owners August 18, 2026 18:25

nav-tej self-assigned this Aug 18, 2026

mobeenabdullah approved these changes Aug 18, 2026

View reviewed changes

nav-tej and others added 4 commits August 18, 2026 15:31

nav-tej mentioned this pull request Aug 18, 2026

feat(site): API payload section on workflow detail pages #1149

Merged

nav-tej and others added 3 commits August 18, 2026 17:31

Merge remote-tracking branch 'origin/nav/workflow-api-payload' into n…

ccf6075

…av/workflow-api-interlinks

Merge branch 'nav/workflow-api-payload' into nav/workflow-api-interlinks

20575a3

nav-tej marked this pull request as draft August 19, 2026 00:59

mobeenabdullah mentioned this pull request Aug 19, 2026

feat(site): highlight the API code blocks, add a TypeScript tab #1158

Closed

mobeenabdullah deleted the branch main August 19, 2026 10:58

mobeenabdullah closed this Aug 19, 2026

github-actions Bot locked and limited conversation to collaborators Aug 19, 2026

mobeenabdullah reopened this Aug 19, 2026

mobeenabdullah changed the base branch from nav/workflow-api-payload to main August 19, 2026 11:25

Navigation Menu

feat(site): API link on workflow hub cards - #1156

feat(site): API link on workflow hub cards#1156
nav-tej wants to merge 10 commits into
mainfrom
nav/workflow-api-interlinks

nav-tej commented Aug 18, 2026

Uh oh!

coderabbitai Bot commented Aug 18, 2026 •

edited

Loading

Review skipped

Uh oh!

github-actions Bot commented Aug 18, 2026 •

edited

Loading

Uh oh!

mobeenabdullah left a comment

Uh oh!

nav-tej commented Aug 19, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

Conversation

nav-tej commented Aug 18, 2026

Uh oh!

coderabbitai Bot commented Aug 18, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Review skipped

Uh oh!

github-actions Bot commented Aug 18, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

mobeenabdullah left a comment

Choose a reason for hiding this comment

Uh oh!

nav-tej commented Aug 19, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

coderabbitai Bot commented Aug 18, 2026 •

edited

Loading

github-actions Bot commented Aug 18, 2026 •

edited

Loading