import { h, type VNode } from 'vue'
import IvyToggle from '@/views/_components/toggle/IvyToggle.vue'
import type { CellRenderProps } from '@/views/_components/table/IvyCellRendererProps'

export interface ToggleCellOptions<Row> {
  field: keyof Row & string
  onChange: (row: Row, value: boolean) => void | Promise<void>
  ariaLabel?: string
}

export function toggleCellRenderer<Row extends Record<string, unknown>>(
  options: ToggleCellOptions<Row>,
) {
  return (props: CellRenderProps): VNode | null => {
    const row = props.rowData as unknown as Row
    if (!row) return null

    return h(IvyToggle, {
      modelValue: Boolean(row[options.field]),
      size: 's',
      ariaLabel: options.ariaLabel,
      'onUpdate:modelValue': async (value: boolean) => {
        await options.onChange(row, value)
      },
    })
  }
}