import { StyledProp } from '@codeleap/styles'
import { FlatListProps, AugmentedRenderItemInfo, ListItem } from '../List'
import { GridComposition } from './styles'

export type GridAugmentedRenderItemInfo<T> =
  AugmentedRenderItemInfo<T> &
  {
    isFirstInRow: boolean
    isLastInRow: boolean
    isOnlyInRow: boolean
  }

/**
 * Changing `numColumns` at runtime requires a `key` change on the FlatList to force a full
 * remount; React Native cannot dynamically update `numColumns` on an existing list.
 */
export type GridProps<T extends ListItem = ListItem> =
  Omit<FlatListProps<T>, 'style' | 'renderItem'> &
  {
    spacing?: number
    itemDimension?: number
    renderItem: (data: GridAugmentedRenderItemInfo<T>) => React.ReactElement
    style?: StyledProp<GridComposition>
  }