import { type FC } from 'react';

import FormInputClassic from '@material-hu/components/design-system/Inputs/Classic/form';

import useRules from 'src/hooks/useRules';
import { type InputValidations } from 'src/pages/dashboard/serviceManagement/types';
import { useLokaliseTranslation } from 'src/utils/i18n';

import { TEXT_MAX_LENGTH } from '../../servicePortal/serviceItem/pdf/utils/constants';

export type TextInputProps = {
  name: string;
  required?: boolean;
  formFilled?: boolean;
  validations?: InputValidations;
};

export const TextInput: FC<TextInputProps> = ({
  name,
  required,
  formFilled,
  validations,
}) => {
  const { t } = useLokaliseTranslation(['service_management', 'validations']);

  return (
    <FormInputClassic
      name={name}
      rules={useRules({
        requiredWithMessage:
          required && !formFilled ? t('validations:required') : false,
      })}
      inputProps={{
        disabled: formFilled,
        multiline: true,
        minRows: 1,
        hasCounter: false,
        errorText: t('validations:required'),
        placeholder: t('service_management:text_placeholder'),
        maxLength: validations?.maxLength ?? TEXT_MAX_LENGTH,
      }}
    />
  );
};

export default TextInput;