@substreams/react NPM

SubstreamsJS

TypeScript library for consuming Substreams suitable for web browsers, Node.js and alternative runtimes.

import { createGrpcTransport } from "@connectrpc/connect-node";
import {
  createAuthInterceptor,
  createRegistry,
  createRequest,
  fetchSubstream,
  isEmptyMessage,
  streamBlocks,
  unpackMapOutput,
} from "@substreams/core";

const SUBSTREAM = "https://github.com/streamingfast/substreams-uniswap-v3/releases/download/v0.2.7/substreams.spkg";
const MODULE = "map_pools_created";

const substream = await fetchSubstream(SUBSTREAM);
const registry = createRegistry(substream);
const transport = createGrpcTransport({
  baseUrl: "https://mainnet.eth.streamingfast.io",
  httpVersion: "2",
  interceptors: [createAuthInterceptor("<YOUR TOKEN>")],
  jsonOptions: {
    typeRegistry: registry,
  },
});

const request = createRequest({
  substreamPackage: substream,
  outputModule: MODULE,
  productionMode: true,
  stopBlockNum: "+10000",
});

for await (const response of streamBlocks(transport, request)) {
  const output = unpackMapOutput(response.response, registry);
  if (output !== undefined && !isEmptyMessage(output)) {
    console.dir(output.toJson({ typeRegistry: registry }));
  }
}

Installation

Note This library is pure ESM and no longer provides CommonJS (CJS) exports. If your project uses CommonJS, you will have to convert to ESM or use the dynamic import() function. Please don't open issues for questions regarding CommonJS / ESM.

# Using pnpm
pnpm add @substreams/core

# Using yarn
yarn add @substreams/core

# Using npm
npm install @substreams/core

Packages

@substreams/core: Provides all core functionality for interacting with substreams packages and consuming substream modules. (source code).
@substreams/manifest: Parses and validates substreams.yaml manifests and bundles them into substream packages. (source code).
@substreams/mermaid: Generates mermaid graph visualizations of substream module graphs. (source code).
@substreams/react: Lightweight utilities for building React based user interfaces on top of substreams. (source code).