convex-js icon indicating copy to clipboard operation
convex-js copied to clipboard

feat(nextjs): add abortsignal support for react 19.2 cachesignal

Open RMNCLDYO opened this issue 1 month ago • 0 comments

Summary

Adds signal parameter to NextjsOptions to support React 19.2's cacheSignal() API for automatic request cancellation.

Motivation

React 19.2 introduced cacheSignal() which returns an AbortSignal that automatically aborts when:

  • Render completes successfully
  • Render is aborted
  • User navigates away
  • Cache lifetime ends

This prevents wasted network requests and enables proper cleanup in Server Components.

Changes

Type Definitions:

  • Added signal?: AbortSignal | null to NextjsOptions in src/nextjs/index.ts
  • Added signal?: AbortSignal to FetchOptions in src/browser/http_client.ts

Runtime:

  • Pass signal from options to client.setFetchOptions() in setupClient()
  • Signal flows through to all fetch() calls automatically

Example Usage

import { cacheSignal } from 'react';
import { fetchQuery } from 'convex/nextjs';
import { api } from '@/convex/_generated/api';

export async function getProducts() {
  'use cache';
  
  return await fetchQuery(
    api.catalog.getProducts,
    {},
    { signal: cacheSignal() }
  );
}

Testing

  • TypeScript compilation passes
  • Build succeeds with signal parameter
  • Backwards compatible (signal is optional)
  • Works with all function types (query/mutation/action)
  • Tested in production Next.js 16 + React 19.2 application

References

RMNCLDYO avatar Oct 12 '25 12:10 RMNCLDYO