1

I need some suggestions related to the implementation of the following use case in NextJS.

After the user has logged in, I am saving all the details including the token in a session (next-auth session). And now I have a sidebar that I want to render on the server side. But its content will be dynamic as it can be changed based on which user has logged in. For this I thought to go with getServerSideProps but, it isn't working. Not even logging the message.

//File path : src/app/components/Sidebar/index.tsx
import { options } from '@/app/api/auth/[...nextauth]/options';
import { getServerSession } from 'next-auth/next';
import React from 'react';

async function index(props: any) {
    console.log('this is props', props);
    return <div>This is Sidebar</div>;
}

export default index;

export async function getServerSideProps() {
    //Can't even see this log in terminal or browser's console
    console.log('Control is in getServerSideProps');
    const session = await getServerSession(options);
    //based on session I can make api call 
    //need to pass token into header for that api call

    return {
        props: {
            session,
    },
    };
}

What am I doing wrong? Whatever I'm trying, is it even good or possible?

Folder structure:

enter image description here

Joy Gupta
  • 122
  • 6

0 Answers0