I have an authentication page, that uses a button component, implemented with a server action as follows.

async function LoginBtn({ identity }: { identity: Identity }) {
  return <form action={async () => {
    "use server";
    identity.redirectUser();
  }}>
    <input type="submit" value={`Log In with ${identity.provider}`} />
  </form>
}

Identity follows the following interface

export type Provider = 'GitHub' | 'Google';

export type SessionInfo = {
  username: string,
  email: string,
  provider_access_token: string,
  provider_refresh_token: string
}

export type Identity = {
  readonly provider: Provider;
  redirectUser(): void,
  performExchange(req: NextRequest): Promise<SessionInfo>,
  checkAccessToken(access_token: string): Promise<boolean>,
  refreshToken(refresh_token: string, email: string): Promise<boolean>
}

The error I’m getting is as follows:

Error: Functions cannot be passed directly to Client Components unless you explicitly expose it by marking it
with "use server". Or maybe you meant to call this function rather than return it.
 [function redirectUser]

I don’t understand where I could be using a client component. Furthermore, the page renders and behaves fine, even though I get this output in the console. I also tried to mark the functions in the concrete implementations of Identity as “use server”, but that had no effect.

Is this is a bug, or am I missing something? I’m using NextJS 14.2.3 with the app router.