@invect/nextjs
v0.0.12
Published
Next.js integration for Invect
Downloads
123
Maintainers
Readme
Add Invect to any Next.js app with a single catch-all API route. Handles all endpoints — flows, executions, credentials, agent tools, and OAuth2.
For production deployments on Vercel, add one dedicated Invect cron route as well. That single route runs Invect maintenance work for the app: batch polling, paused-flow resumption, stale-run cleanup, and Invect cron triggers.
Install
npx invect-cli initOr install manually:
npm install @invect/core @invect/nextjsUsage
Create a catch-all route in your Next.js App Router:
// app/api/invect/[...invect]/route.ts
import { createInvectHandler } from '@invect/nextjs';
const handler = createInvectHandler({
database: {
type: 'sqlite',
connectionString: process.env.DATABASE_URL || 'file:./dev.db',
},
encryptionKey: process.env.INVECT_ENCRYPTION_KEY, // npx invect-cli secret
});
export const GET = handler.GET;
export const POST = handler.POST;
export const PUT = handler.PUT;
export const PATCH = handler.PATCH;
export const DELETE = handler.DELETE;All Invect API endpoints are now available under /api/invect/.
Vercel Cron
Create a dedicated maintenance route for production cron jobs:
// app/api/invect/cron/route.ts
import { createInvectCronHandler } from '@invect/nextjs';
const handleCron = createInvectCronHandler({
database: {
type: 'sqlite',
connectionString: process.env.DATABASE_URL || 'file:./dev.db',
},
encryptionKey: process.env.INVECT_ENCRYPTION_KEY,
triggers: {
cronEnabled: true,
webhookBaseUrl: 'https://your-app.com/api/invect',
},
});
export const GET = handleCron;Then configure one Vercel cron in vercel.json:
{
"crons": [{ "path": "/api/invect/cron", "schedule": "* * * * *" }]
}This single Invect cron is the fan-out point for background work in the app.
Frontend
Add the flow editor to any page:
// app/invect/[[...slug]]/page.tsx
import { Invect } from '@invect/ui';
import '@invect/ui/styles';
export default function InvectPage() {
return <Invect apiBaseUrl="/api/invect" basePath="/invect" />;
}