text: import queryGraphql from '../shared/query-graphql'
  
  export default function UserProfile({ user }) {
    if (!user) {
      return <h1>User Not Found</h1>
    }
    return (
      <h1>
        {user.username} is {user.name}
      </h1>
    )
  }
  
  export async function getStaticProps(context) {
    const { params } = context
    const { username } = params
    const { user = null } = await queryGraphql(
      `
      query($username: String) {
        user(username: $username) {
          name
          username
        }
      }
    `,
      { username }
    )
    return { props: { user } }
  }
  
  export async function getStaticPaths() {
    const { users } = await queryGraphql(`
      query {
        users {
          username
        }
      }
    `)
    return {
      paths: users.map(({ username }) => ({
        params: { username },
      })),
      fallback: true,
    }
  }
  