Do you have any code to show?

this is my component and layout comp.

export default function Index({ data }: {data:typeProduct[]}) {
  console.log(data[0].title);
  
  return (
    <div className="flex flex-col self-center items-center p-2 rounded-md border">
      <h1>List of products</h1>
      <ul className='flex'>
      {data.map((ele, index)=>{
          return(
            <li key={index}>
              <AdminProduct />
              <AdminProduct />
              <AdminProduct />
              <AdminProduct />
            </li>
          )
        })}
      </ul>
    </div>
  )
}

export const getServerSideProps: GetServerSideProps = (async (context) => {
  const res = await fetch(`http://localhost:5000/products/phones`)
  const data: typeProduct[] = await res.json()
  
  return { props: {data} }
})


-----------------------------
**this is layout Component**

export default function AdminLayout({children}: {children: React.ReactNode;}) {
  return (
    <>
      <AdminNavbar/>
      <main className="flex flex-col pr-8 pl-8">{children}</main>
    </>
  );
}

Where is the Index Component being used since the Semicolon isn't being displayed in it

It's being displayed in the parent (where it's used/rendered)

the route is /admin/products

and structure looks like this

its absolutely weird there is no semicolon in there

found it

Nice lol