I'm trying to generate static pages for each user with Clerk Auth, and I'm having trouble fetching data from each users respective user object to populate the page.

This is my current code which generates a static page:

export async function generateStaticParams(){
    const users = await clerkClient.users.getUserList();

    return users.map((user) => ({
        user: user.username,
        id: user.id,
      }))
    }
  
 
    
    export default function Page({params}: {params: {user: string, id: string}}){
        
        return (
            <div>
                <h1>My Post: {params.user}</h1>
                {/* <img src={params.userImg} alt="profile image" className="w-10 h-10 rounded-full" /> */}
            </div>
        )
    }

How would you go about fetching the data and populating each static page respectively?