'use client'

import { useController } from 'react-hook-form'

import { Select } from '../../Select'

import { SelectProps } from '../../Select/types'

export function FormSelect({ label, items, name }: SelectProps) {
  const { field, fieldState } = useController({
    name,
  })
  return (
    <Select
      items={items}
      label={label}
      isInvalid={fieldState.invalid}
      name={name}
      onBlur={field.onBlur}
      onSelectionChange={(c) => field.onChange(c ?? '')}
      selectedKey={field.value}
      data-testid={name}
    />
  )
}