import { FC } from 'react';
import {
  useFormContext,
  Controller,
  UseControllerProps,
} from 'react-hook-form';

import Rating, { RatingProps } from '@material-hu/mui/Rating';

import { useLokaliseTranslation } from 'src/utils/i18n';

export type FormRatingProps = RatingProps &
  Pick<UseControllerProps, 'name'> & {
    controllerProps?: UseControllerProps;
  };

export const FormRating: FC<FormRatingProps> = props => {
  const { name, controllerProps = {}, ...ratingProps } = props;

  const { control } = useFormContext();
  const { t } = useLokaliseTranslation(['general']);

  return (
    <Controller
      {...controllerProps}
      name={name}
      control={control}
      render={({ field }) => (
        <Rating
          emptyLabelText={t('empty')}
          {...field}
          {...ratingProps}
        />
      )}
    />
  );
};

export default FormRating;