[BUG] Using params directly does break action

[enisze]

Are you using the latest version of this library?

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

Is there an existing issue for this?

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

Describe the bug

Hey I found out that using params of a page directly in an action does not work with next-safe action.

Reproduction steps

Reproduction:

const action = action(
    z.object({
        test: z.number(),
    }),
    async ({ test }) => {
        console.log(test)
    },
)

❌ Does not work, the action is not running nor the middleware.

export default async function Page({
    params: { test },
}: {
    params: { test: number }
}) {
    return (
        <div>
            <form
                action={async () => {
                    'use server'

                       await action({test})     
        }}
            >
                <button type='submit'>test</button>
            </form>
        </div>
    )
}

✅ Does work when instantiating it

export default async function Page({
    params: { test },
}: {
    params: { test: number }
}) {
const testInstance = test
    return (
        <div>
            <form
                action={async () => {
                    'use server'

                       await action({test:testInstance})        
        }}
            >
                <button type='submit'>test</button>
            </form>
        </div>
    )
}

Expected behavior

both should work

Minimal reproduction example

see reproduction steps

Operating System

macOs

Library version

6.2.0

Next.js version

14.2.3

Additional context

No response

[TheEdoRan]

Why are you inlining "use server" inside form's action prop? Why does the action action have the same name as the action client? I need a link to a minimal reproduction example, as the issue template requests, to investigate this, thanks.

[enisze]

@TheEdoRan my bad:

Hope this is better:

❌

import { z } from 'zod'
import { action } from '~/server/save-actions'

const someAction = action(z.string(), async (test) => {
    'use server'
    console.log(test)
})

const Page = ({ test }: { test: string }) => {
    return (
        <div>
            <form
                action={async () => {
                    'use server'

                    someAction(test)
                }}
            >
                <button type='submit'>test</button>
            </form>
        </div>
    )
}

export default Page

✅

import { z } from 'zod'
import { action } from '~/server/save-actions'

const someAction = action(z.string(), async (test) => {
    'use server'
    console.log(test)
})

const Page = ({ test }: { test: string }) => {
const testInstance = test
    return (
        <div>
            <form
                action={async () => {
                    'use server'

                    someAction(testInstance)
                }}
            >
                <button type='submit'>test</button>
            </form>
        </div>
    )
}

export default Page