import { open_database } from "@/misc"
import Set from "src/components/Set"

export default async function Browse() {
    const db = open_database()
    const query = db.selectFrom('sets')
        .selectAll()
        .where('public', '=', 1) // 1 is true

    const result = await query.execute()
    return (
        <>
        <p className='text-5xl text-center'>Browse</p>
        {result.forEach((r) => {
            {console.log(r)}
            <Set db={db} name={r.name} created_by={r.created_by} created_at={r.created_at} cards={r.cards} key={r.id}/>
        })}
        </>
    )
}

Set is a server component and is not being rendered. However, the set is being logged (console.log(r)) in the forEach loop. I am using Kysely query builder. I have multiple sets in my database, and they are being correctly put into result. Why is Set not being rendered?