리액트에서 map이 아닌 반복문으로 랜딩하기

import { Client } from '@notionhq/client'
 
// 노션 API 활성화
const notion = new Client({ auth: process.env.NOTION_SECRET_KEY })
 
// 피드 목록 가져오기
async function getList() {
  const data = (await notion.databases.query({
    database_id: '498cea7e5c4b44ba8b2b13c6a7f9e3d1',
    sorts: [{ property: '생성일', direction: 'descending' }],
    page_size: 5
  })) as unknown as FeedList
  return data
}
 
// 한 페이지의 모든 블록 가져오기
async function getData(id: string) {
  let isFirst = true
  let nextCursor: string
  let data: BlockObjectResponse[] = []
 
  while (isFirst || nextCursor) {
    const { results, next_cursor } = await notion.blocks.children.list({
      block_id: id,
      start_cursor: nextCursor
    })
    nextCursor = next_cursor
    if (isFirst) isFirst = false
 
    data.push(...(results as BlockObjectResponse[]))
  }
 
  return data
}
 
export default async function Page() {
  const { results, next_cursor } = getList()
  return (
    <ul className="grid gap-6 xl:gap-10">
      {results.map(async (page) => {
        const render = async () => {
          let items = []
          let orderedList = []
          const list = await getData(page.id)
          for (const block of list) {
            if (block.type === 'numbered_list_item') {
              orderedList.push(<li>블록</li>)
            } else if (orderedList.length) {
              items.push(<ol key={'ol' + block.id}>{orderedList}</ol>)
              orderedList = []
            }
          }
          return <>{items}</>
        }
        return <>{await render()}</>
      })}
    </ul>
  )
}