Theo's Typesafe Cult•12mo ago

Could not find module (shadcn Component) in the React Client Manifest

Working on NextJS 14.1.0 to build a portfolio project and came across this error trying to build a server component that utilizes a server action. Seen other posts with similar issue, but none of the solutions worked for me. Remove "use server" presents a different error pointing to my User schema, but thinking I need to keep this as I'm using getServerSession. Not sure how to go about a solution, so any help would be great if anyone's encountered this before.

"use server"

import {
  Avatar,
  AvatarFallback,
  AvatarImage,
} from "../../components/ui/avatar";
import { getServerSession } from "next-auth";
import { authOptions } from "@/app/api/auth/[...nextauth]/route";

const handleGetDiscussion = async (id: string) => {
  const res = await fetch(`http://localhost:3000/api/discussions/${id}`, {
    method: "GET",
  });

  const data = await res.json();

  return { discussion: data };
};

const DiscussionContent = async ({params}) => {
  const session = await getServerSession(authOptions);
  
  if (!session) {
    return;
  }

  const { discussion } = await handleGetDiscussion(params?.id as string);
  
  return (
    <Avatar className="w-10 h-10 border">
      <AvatarImage alt="@shadcn" src="/placeholder-user.jpg" />
      <AvatarFallback>AC</AvatarFallback>
    </Avatar>
  )
}

"use server"

import {
  Avatar,
  AvatarFallback,
  AvatarImage,
} from "../../components/ui/avatar";
import { getServerSession } from "next-auth";
import { authOptions } from "@/app/api/auth/[...nextauth]/route";

const handleGetDiscussion = async (id: string) => {
  const res = await fetch(`http://localhost:3000/api/discussions/${id}`, {
    method: "GET",
  });

  const data = await res.json();

  return { discussion: data };
};

const DiscussionContent = async ({params}) => {
  const session = await getServerSession(authOptions);
  
  if (!session) {
    return;
  }

  const { discussion } = await handleGetDiscussion(params?.id as string);
  
  return (
    <Avatar className="w-10 h-10 border">
      <AvatarImage alt="@shadcn" src="/placeholder-user.jpg" />
      <AvatarFallback>AC</AvatarFallback>
    </Avatar>
  )
}

1 Reply

JulieCezar•12mo ago

Try using T3 to initialize a new project with NextAuth because your imports look kind of sus... For example, this is from T3

import { getServerAuthSession } from "~/server/auth";

import { getServerAuthSession } from "~/server/auth";

Gaming

Programming

Could not find module (shadcn Component) in the React Client Manifest