React Bindings Overview

Package Contents

Export	Type	Purpose
`InteractionProvider`	Component	Context provider — wraps the app, sets up the EdgeInteract client
`useInteraction()`	Hook	Send an interaction from a React component, get response as Promise
`useInteractionReceiver()`	Hook	Receive incoming interactions for the current user
`useInteractionCallback(id)`	Hook	Subscribe to the response for a specific interaction
`useInteractionHistory()`	Hook	Completed interactions — for audit / history panels
`useInteractionContext()`	Hook	Raw context access — for advanced use cases

Installation

// Install packages
npm install edge-interact-react edge-interact-ui edge-interact-core

// Or with yarn
yarn add edge-interact-react edge-interact-ui edge-interact-core

Minimal Setup

// App.tsx
import { EdgeStreamProvider } from 'edge-stream-react';
import { InteractionProvider } from 'edge-interact-react';
import { InteractionContainer } from 'edge-interact-ui';

function App() {
  return (
    <EdgeStreamProvider hubUrl="/edge-stream" userId={currentUser.id}>
      <InteractionProvider>
        <InteractionContainer />  {/* renders interactions as they arrive */}
        <RouterOutlet />          {/* your app content */}
      </InteractionProvider>
    </EdgeStreamProvider>
  );
}

TypeScript Generics

All hooks and types support TypeScript generics for type-safe payload and response data:

import {
  InteractionRequest,
  InteractionResponse,
  ApprovalPayload
} from 'edge-interact-core';

// Fully typed request
const request: InteractionRequest<ApprovalPayload> = {
  type: 'approval',
  targetUserId: managerId,
  title: 'Approve this request',
  payload: {
    context: '...',
    fields: [...]
  },
  timeoutMs: 86_400_000
};

// Fully typed response
const response: InteractionResponse<{ comment: string }> = await sendApproval(request);
console.log(response.data?.comment);

EdgeStream Must Come First InteractionProvider must be nested inside EdgeStreamProvider. EdgeInteract uses EdgeStream as its transport — it cannot function without an active EdgeStream connection.

Next: InteractionProvider →