// dashboard.tsx
async function DashboardPage(params) {
  const pageNo = await (params).page;
  // no data loading here, but still server comp
  return <Table>
    <Suspense fallback={<TableDataMock />}>
      <TableDataRows page={page} />
    </Suspense>
  </Table>
}


// TableData.tsx
async function TableDataRows({page}) {
  // We get data here
  const data = await getMeData(page)
  return data.map(item => <tr key={item.id}>
    <td>{item.name}</td>
    ...
  </tr>)
}

// dashboard.tsx
async function DashboardPage(params) {
  const pageNo = await (params).page;
  // no data loading here, but still server comp
  return <Table>
    <Suspense fallback={<TableDataMock />}>
      <TableDataRows page={page} />
    </Suspense>
  </Table>
}


// TableData.tsx
async function TableDataRows({page}) {
  // We get data here
  const data = await getMeData(page)
  return data.map(item => <tr key={item.id}>
    <td>{item.name}</td>
    ...
  </tr>)
}

// dashboard.tsx
async function DashboardPage(params) {
  const pageNo = await (params).page;
  // no data loading here, but still server comp
  return <Suspense fallback={<TableMock />}>
    <Table page={page} />
  </Suspense>
}

async function Table({page}) {
  const data = await getMeData(page);
  return <table>
    <TableHead />
    {data.map(item => <tr>...</tr>)}
  </table>
}

// tablehead.tsx
function TableHead() {
  return <thead>
    ...
  </thead>
}

// tablemock.tsx
function TableMock() {
  return <table>
    <TableHead />
    <tr><td>Loading...</td></tr>
  </table>
}

// dashboard.tsx
async function DashboardPage(params) {
  const pageNo = await (params).page;
  // no data loading here, but still server comp
  return <Suspense fallback={<TableMock />}>
    <Table page={page} />
  </Suspense>
}

async function Table({page}) {
  const data = await getMeData(page);
  return <table>
    <TableHead />
    {data.map(item => <tr>...</tr>)}
  </table>
}

// tablehead.tsx
function TableHead() {
  return <thead>
    ...
  </thead>
}

// tablemock.tsx
function TableMock() {
  return <table>
    <TableHead />
    <tr><td>Loading...</td></tr>
  </table>
}