Is there a reason i cannot use "use server" inside buttons anymore like the example shows.
× It is not allowed to define inline "use server" annotated Server Actions in Client Components.
│ To use Server Actions in a Client Component, you can either export them from a separate file with "use server" at the top, or pass them down through props from a Server Component.
5 Replies
You can do it like in this example, but it must be a server component. React bundler just doesn't support mixing "use server" and "use client" in one file. You can just move your server action to another file with "use server" on top
Do you know how to disable the rule or when this came about. The latest t3 uses
T3turbo
This is a server component
You cannot disable this.
It was like this from the start
Thanks. Almost got it now. Any idea maybe why all my client_id's are null when trying to redirect to github or google or discord.
client_id=undefined&redirect_uri=http%3A%2F%2Flocalhost%3A3000%2Fapi%2Fauth%2Fcallback%2Fgithub&code_challenge=VtLtrZoi7gkXpSxD-po66Fy7Rdi7qT5wT_u0tFzE77U&code_challenge_method=S256
Sorry I am busy refactoring moving to the new template a bit lost.
Never mind I got it. Thanks for the assistance.
I got stuck on this part:
import type {
DefaultSession,
NextAuthConfig,
Session as NextAuthSession,
} from "next-auth";
import { skipCSRFCheck } from "@auth/core";
import { DrizzleAdapter } from "@auth/drizzle-adapter";
import Discord from "next-auth/providers/discord";
import { db } from "@acme/db/client";
import { Account, Session, User } from "@acme/db/schema";
import { env } from "../env";
declare module "next-auth" {
interface Session {
user: {
id: string;
} & DefaultSession["user"];
}
}
const adapter = DrizzleAdapter(db, {
usersTable: User,
accountsTable: Account,
sessionsTable: Session,
});
export const isSecureContext = env.NODE_ENV !== "development";
export const authConfig = {
adapter,
// In development, we need to skip checks to allow Expo to work
...(!isSecureContext
? {
skipCSRFCheck: skipCSRFCheck,
trustHost: true,
}
: {}),
secret: env.AUTH_SECRET,
providers: [Discord],
callbacks: {
session: (opts) => {
if (!("user" in opts))
throw new Error("unreachable with session strategy");
return {
...opts.session,
user: {
...opts.session.user,
id: opts.user.id,
},
};
},
},
} satisfies NextAuthConfig;
export const validateToken = async (
token: string,
): Promise<NextAuthSession | null> => {
const sessionToken = token.slice("Bearer ".length);
const session = await adapter.getSessionAndUser?.(sessionToken);
return session
? {
user: {
...session.user,
},
expires: session.session.expires.toISOString(),
}
: null;
};
export const invalidateSessionToken = async (token: string) => {
await adapter.deleteSession?.(token);
};
For anyone searching for future reference on Auth with t3 turbo. I had to pass the client and secret here into the provider option.
The example doesn't have it which confused me.