Unable to build my nextjs app

When ever I try to build the nextjs webapp it shows the following error.
@bappyasif

Error:
Type error: Type ‘OmitWithTag<HomeProps, keyof PageProps, “default”>’ does not satisfy the constraint ‘{ [x: string]: never; }’.
Property ‘session’ is incompatible with index signature.
Type ‘Session’ is not assignable to type ‘never’.

// Check the prop type of the entry function
checkFields<Diff<PageProps, FirstArg<TEntry[‘default’]>, ‘default’>>()
^
// Check the arguments and return type of the generateMetadata function
if (‘generateMetadata’ in entry) {

'use client'

import Modal from '@/components/Modal'
import Header from '@/components/layout/Header'

import { FC } from 'react'
import { SessionProvider } from 'next-auth/react'
import { Session } from 'next-auth'
import Form from '@/components/Form'
import PostFeed from '@/components/Posts/PostFeed'

interface HomeProps {
  session: Session
}

const Home: FC<HomeProps> = ({ session }) => {
  return (
    <>
      <SessionProvider session={session}>
        <Header label='Home' />
        <Form placeholder='Whats Happening?' />
        <PostFeed />
      </SessionProvider>
    </>
  )
}

export default Home


i’ve started learning about typescript recently, so cant really tell exactly what should be return type for that function!!

but i would say, error message is “very descriptive enough to spot that”, can you trace them back to your “code”?!

  • what version of react are you using for this app?

I am using 18.2.0 version on this app.

Any update on this? I have the same error, let me know your solution incase you’re able to fix it.

I was getting the same error.
First, I managed to fix the provider problem by following the first answer here:

After that, I had a type problem with the type of the provider’s return. It seems to be a well known problem using typescript in react.
Not exaclty the same problem as here, but almost the same.

I got it working by not returning a React.ReactNode from my provider and set it to any.
Certainly not the best solution to the problem, but at least it made it work.

i just gave a “never” type to session

export default function RootLayout({
children,
session,
}: {
children: React.ReactNode;
session: never;
}

And it’s working now

1 Like