Docs / integrations / call-http-integration

call-http-integration

recipesince 0.2.8

Use a registered HTTP API integration (notion, slack, linear, or owner-registered) from a built app via the agent

Plane: http_integration · Requires: capability external_integration

Steps: 1. useAgent — With capabilities ['external_integration','data_access'], prompt the agent to call the integration's endpoints and UPSERT results into the integration's declared collection shape. 2. useCollection — Read the synced collection reactively ({ layer: 'shared' }, refreshOnAgentComplete: true); the API is called on sync, never per render.

Examples

End-to-end example
import { useAgent, useCollection } from '@flowstack/sdk';

export function IssueBoard() {
  const { query, isStreaming } = useAgent(undefined, {
    capabilities: ['external_integration', 'data_access'],
  });
  const { documents: issues } = useCollection('linear_issues', {
    layer: 'shared',
    sort: { updated_at: -1 },
    refreshOnAgentComplete: true,
  });

  return (
    <>
      <button
        disabled={isStreaming}
        onClick={() =>
          query(
            'Call the linear integration: fetch open issues and upsert them into ' +
            'linear_issues (dedupe on issue_id), matching its doc schema.'
          )
        }
      >
        Sync issues
      </button>
      <ul>{issues.map(i => <li key={i.issue_id}>{i.identifier}: {i.title}</li>)}</ul>
    </>
  );
}
WarningBuilt-in HTTP integrations use the OWNER's credentials — do not build per-user connect flows for them.
WarningCache API results in a collection and read via useCollection; never call the API per component render.
WarningUpsert on the integration's natural id (issue_id, page_id, message_ts) — never blind-insert.

See also

call-stripe-api · register-custom-api · connect-oauth-service · useAgent · useCollection

Source: sync-recipes.mjs ← https://sage-api.flowstack.fun/recipes.json · Also available in llms-full.txt and registry.json.