I have this RevokeButton component:

import { revokeSessionFormAction } from "@/lib/actions/signOut";
import { Button } from "@/components/ui/button";

export function RevokeButton({ sessionToken }: { sessionToken: string }) {
  return (
    <form action={revokeSessionFormAction}>
      <input type="hidden" name="sessionToken" value={sessionToken} />
      <Button
        type="submit"
        variant="outline"
        size="sm"
        className="text-destructive hover:text-destructive hover:bg-destructive/10"
      >
        Revoke
      </Button>
    </form>
  );
}

I am using this component inside a DeviceList component. It is working fine for now, but I want to add some interactivity to this component (onClick event handler). For that, I need to add the "use client" directive at the top of the file, but the moment I do that, I get this error:

Type Error:  can't access property "call", originalFactory is undefined

That's all, no proper traceback.