Fetching Sessions results in error

Answered

Northeast Congo Lion posted this in #help-forum

Northeast Congo LionOP

2024-04-06T02:39:43.000Z

Hello! I am trying to fetch users from my database depending on theri session and the email attatched to it. However I have an issue. When I am fetching my users it turns out that i am always catching an error and returning null. The error states that it has something to do with headers but I am unsure what that has to do with finding sessions and the getServerSession functions. the following files are my getSession file which I am using to fetch the session, a getCurrentUser which is what is failing, and a async component Sidebar where I need to fetch the current user from.

import { getServerSession } from "next-auth";
import { authOptions } from "../api/auth/[...nextauth]/route";

export default async function getSession() {
    return await getServerSession(authOptions);
}

import prisma from "../libs/prismadb";
import getSession from "./getSession";

const getCurrentUser = async () => {
    try {
        const session = await getSession();
        if (!session?.user?.email) {
            return null;
        }
        

        const currentUser = await prisma.user.findUnique({
            where: {
                email: session.user.email as string
            }
        });

        if (!currentUser) {
            return null;
        }

        return currentUser;

    } catch (error: any) {
        console.error("An error occurred:", error);
        return null;
    }
}

export default getCurrentUser;

I am attempting to use these actions in my async function called navbar. It is not a client component.

import getCurrentUser from '../../actions/getCurrentUser';
import DesktopSidebar from './sidebar/DesktopSidebar';


export async function MainNav(){
  const currentUser = await getCurrentUser();
  console.log("CURR USER: ", currentUser);

  return (
    <DesktopSidebar currentUser={currentUser!}/>
  );
}

Attempted Solutions:

I have tried putting "use server" at the top, but these are server actions and cant be used with component.

Answered by Ray

"use client";

import { AppShell } from "@mantine/core";
import { useDisclosure } from "@mantine/hooks";
import { MainHeader } from "./header";
import { ReactNode } from "react";

export function CollapseDesktop({
  children,
  mainNav,
}: {
  children: ReactNode;
  mainNav: ReactNode;
}) {
  const [mobileOpened, { toggle: toggleMobile }] = useDisclosure();
  const [desktopOpened, { toggle: toggleDesktop }] = useDisclosure(true);

  return (
    <AppShell
      header={{ height: 60 }}
      navbar={{
        width: 300,
        breakpoint: "sm",
        collapsed: { mobile: !mobileOpened, desktop: !desktopOpened },
      }}
      padding="md"
    >
      <MainHeader
        mobileOpened={mobileOpened}
        toggleMobile={toggleMobile}
        desktopOpened={desktopOpened}
        toggleDesktop={toggleDesktop}
      />

      {mainNav}

      <AppShell.Main>{children}</AppShell.Main>
    </AppShell>
  );
}

// layout.tsx
import { MainNav } from './navbar';

export default function Layout({children}:{children:ReactNode}) {
    return (
        <CollapseDesktop mainNav={<MainNav />}>
            {children}
        </CollapseDesktop>
    )
}

View full answer

62 Replies

@Northeast Congo Lion Hello! I am trying to fetch users from my database depending on theri session and the email attatched to it. However I have an issue. When I am fetching my users it turns out that i am always catching an error and returning null. The error states that it has something to do with headers but I am unsure what that has to do with finding sessions and the getServerSession functions. the following files are my getSession file which I am using to fetch the session, a getCurrentUser which is what is failing, and a async component Sidebar where I need to fetch the current user from. import { getServerSession } from "next-auth"; import { authOptions } from "../api/auth/[...nextauth]/route"; export default async function getSession() { return await getServerSession(authOptions); } import prisma from "../libs/prismadb"; import getSession from "./getSession"; const getCurrentUser = async () => { try { const session = await getSession(); if (!session?.user?.email) { return null; } const currentUser = await prisma.user.findUnique({ where: { email: session.user.email as string } }); if (!currentUser) { return null; } return currentUser; } catch (error: any) { console.error("An error occurred:", error); return null; } } export default getCurrentUser; I am attempting to use these actions in my async function called navbar. It is not a client component. import getCurrentUser from '../../actions/getCurrentUser'; import DesktopSidebar from './sidebar/DesktopSidebar'; export async function MainNav(){ const currentUser = await getCurrentUser(); console.log("CURR USER: ", currentUser); return ( <DesktopSidebar currentUser={currentUser!}/> ); } Attempted Solutions: I have tried putting "use server" at the top, but these are server actions and cant be used with component.