Javascript – why I can't receive the props properly

Note that this question is tagged next.js. Familiarity with Next.js is essential for understanding the relationship between the getStaticProps and Home functions in the code below.

export async function getStaticProps() {
  const dummyData = [
    {
      id: '1',
      name: 'john'
    },
    {
      id: '2',
      name: 'Tom'
    }
  ];
  return {
    props: { data:dummyData }
  };
}

export default function Home({ data }) {
  console.log(data);
  return (
    <ul>
      <li>USER</li>
      {data && data.map((user) => (
        <li key={user.id}>
          {user.name}
        </li>
      ))}
    </ul>
  );
}

I try to send data to the Home function using getStaticProps, but when I console.log it, it shows undefined.

I want to receive the data from getStaticProps().