// packages/core/src/components/data-table/data-table-body.tsx
import type { JSX } from "solid-js";
import { For } from "solid-js";
import { useInternalDataTableContext } from "./data-table-context";
import { DataTableRow } from "./data-table-row";

/**
 * Renders the `<tbody>` element, auto-generating one `<tr>` per row
 * in the current page using the row data from context.
 */
export function DataTableBody(): JSX.Element {
  const ctx = useInternalDataTableContext();

  return (
    <tbody>
      <For each={ctx.pageData()}>
        {(row, localIndex) => {
          const pageStart = () => ctx.currentPage() * ctx.pageSize();
          const originalIndex = () => pageStart() + localIndex();
          return (
            <DataTableRow row={row} originalIndex={originalIndex()} />
          );
        }}
      </For>
    </tbody>
  );
}
