update for nextjs 13

[MincePie]

Hi John,

Thank you for making this egghead course. I am a very slow learner.

I am stuck on lesson 4 in your tutorial. I think the issue might have something to do with a change in nextjs v 13. This stackoverflow post has a suggestion, which is to change the Home function into a const with an arrow in it. I tried it as follows but still can't get past this step.

import { supabase } from '../utils/supabase'

const Home = ({lessons}) => {
  
  return (
    <div className="flex min-h-screen flex-col items-center justify-center py-2">
      {lessons.map( lesson => (
        <p key={lesson.id}>{lesson.title}</p>
      ))}
    </div>
  )
}

export default Home;

export const getStaticProps = async () => {
  const { data: lessons } = await supabase.from('lesson').select('*')

  return { props: { lessons } }
}

My error message is in the browser is:

Error: Failed to fetch update manifest Internal Server Error
at http://localhost:3000/_next/static/chunks/webpack.js?ts=1668894571923:1188:37

My error message in the terminal is:

TypeError: Cannot read properties of null (reading 'length')
at eval (webpack-internal:///./node_modules/next/dist/client/dev/error-overlay/hot-dev-client.js:262:55)

Do you have any ideas on how to get past this error?

Thank you