Skip to content

[BUG] TypeScript complains if i try to pass an action to the form's action prop #372

@denexapp

Description

@denexapp

Are you using the latest version of this library?

  • I verified that the issue exists in the latest next-safe-action release

Is there an existing issue for this?

  • I have searched the existing issues and found nothing that matches

Describe the bug

Hi, I use React Server Components and Next.js

If I pass a next-safe-action action directly to the form action prop, everything seems to work correctly, but typescript complains that the return type of a next-safe-action action is not void.

import { regularAction } from "./regular-action";
import { wrappedAction } from "./wrapped-action";

export default function Home() {
  return (
    <>
      <form action={regularAction}> // error here
        <button type="submit">Regular Action</button>
      </form>
      <form action={wrappedAction}> // no error here
        <button type="submit">Wrapped Action</button>
      </form>
    </>
  );
}

the wrapped action is the same as the regular, but wrapped like this:

export const wrappedAction = async (...args: Parameters<typeof regularAction>) => { await regularAction(...args) }

Reproduction steps

  1. Clone https://github.com/denexapp/next-safe-action-bug-repro
  2. Install dependencies
  3. Open ./app/page.tsx in a code editor and wait for typescript errors to appear

Expected behavior

The types should not complain here

Link to a minimal reproduction of the issue

https://github.com/denexapp/next-safe-action-bug-repro

Operating System

macOS 15.5

Library version

8.0.4

Next.js version

15.3.4

Node.js version

22.16.0

Additional context

No response

Metadata

Metadata

Assignees

No one assigned

    Labels

    bugSomething isn't working

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions