This is a comprehensive testing reference project for the @trigger.dev/react-hooks package. It demonstrates all the realtime hooks available in useRealtime.ts.
This project includes examples for:
- ✅
useRealtimeRun- Subscribe to a single task run - ✅
useRealtimeRunWithStreams- Subscribe to a run with stream data - ✅
useRealtimeRunsWithTag- Subscribe to multiple runs by tag - ✅
useRealtimeBatch- Subscribe to a batch of runs - ✅
useRealtimeStream- Subscribe to a specific stream
From the repository root:
pnpm installCreate a .env.local file:
TRIGGER_SECRET_KEY=your_secret_key
TRIGGER_PROJECT_REF=your_project_ref
NEXT_PUBLIC_TRIGGER_PUBLIC_KEY=your_public_key
NEXT_PUBLIC_TRIGGER_API_URL=http://localhost:3030In one terminal, run the Trigger.dev dev server:
pnpm run dev:triggerIn another terminal, run the Next.js dev server:
pnpm run devVisit http://localhost:3000 to see the examples.
src/
├── app/
│ ├── page.tsx # Home page with navigation
│ ├── actions.ts # Server actions for triggering tasks
│ ├── run/[id]/page.tsx # useRealtimeRun example
│ ├── run-with-streams/[id]/page.tsx # useRealtimeRunWithStreams example
│ ├── runs-with-tag/[tag]/page.tsx # useRealtimeRunsWithTag example
│ ├── batch/[id]/page.tsx # useRealtimeBatch example
│ └── stream/[id]/page.tsx # useRealtimeStream example
├── components/
│ ├── run-viewer.tsx # Component using useRealtimeRun
│ ├── run-with-streams-viewer.tsx # Component using useRealtimeRunWithStreams
│ ├── runs-with-tag-viewer.tsx # Component using useRealtimeRunsWithTag
│ ├── batch-viewer.tsx # Component using useRealtimeBatch
│ └── stream-viewer.tsx # Component using useRealtimeStream
└── trigger/
├── simple-task.ts # Simple task for useRealtimeRun
├── stream-task.ts # Task with streams for useRealtimeRunWithStreams
├── tagged-task.ts # Tasks that use tags
└── batch-task.ts # Tasks for batch operations
Each page demonstrates different aspects of the hooks:
- Basic subscription to a single run
- onComplete callback
- stopOnCompletion option
- Error handling
- Subscribe to run updates and multiple streams
- Throttling stream updates
- Type-safe stream data
- Subscribe to multiple runs by tag
- Real-time updates as new runs are created
- createdAt filtering
- Subscribe to all runs in a batch
- Track batch progress
- Individual run statuses
- Subscribe to a specific stream
- Start from specific index
- onData callback for each chunk
- Timeout handling