Next.js Discord

Discord Forum

Help needed: "use server" directive must be at the top of the file

Unanswered
Philippine Crocodile posted this in #help-forum
Open in Discord
Philippine CrocodileOP
This is really weird and I'm not finding anything online. I have a layout and in the top line I'm adding 'use server', inside the layout component I'm calling drizzle-orm functions.

Here's the related snippet:

"use server";

import { db } from "@/lib/db";
import { users } from "@/lib/db/schema/auth";

export default async function WebsiteTheme({
  children,
}: {
  children: React.ReactNode;
}) {
  const [{ count: userCount }] = await db
    .select({ count: count() })
    .from(users);
  if (userCount === 0) {
    return redirect("/admin/dashboard/setup");
  }

  // ...
}


Might be noteworthy that without the directive the component becomes a client component which is weird since before adding the userCount code it was behaving as a server component.

My next.config.mjs file if it helps:

// @ts-check

/**
 * @type {import('next').NextConfig}
 **/
const nextConfig = {
  webpack: (config) => {
    config.externals.push("@node-rs/argon2", "@node-rs/bcrypt");
    return config;
  },
};

export default nextConfig;

1 Reply