import * as React from 'react'

import { DataGridCellWrapper } from '@components/ui/data-grid/data-grid-cell-wrapper'
import { CellVariantProps } from './cell-variant-types'

export function ReactNodeCell<TData>({
  cell,
  table,
  rowIndex,
  columnId,
  isFocused,
  isSelected,
}: Readonly<CellVariantProps<TData, React.ReactNode>>) {
  const children = cell.getValue()
  const containerRef = React.useRef<HTMLDivElement>(null)

  return (
    <DataGridCellWrapper
      ref={containerRef}
      cell={cell}
      table={table}
      rowIndex={rowIndex}
      columnId={columnId}
      isEditing={false}
      isFocused={isFocused}
      isSelected={isSelected}
      className="flex size-full justify-center"
    >
      {children ?? null}
    </DataGridCellWrapper>
  )
}
