import React from 'react';
import {
  ComponentType,
  DynamicFormComponent,
  PdfInputValueLayout,
  TextComponent,
} from '@shared/dynamicForms/interfaces';
import {getFieldName, parseAutocompleteAnswer} from '@shared/dynamicForms';

import PdfTextInput from './components/PdfTextInput';
import ValueContainer from './components/ValueContainer';
import PdfNumberInput from './components/PdfNumberInput';
import PdfCheckbox from './components/PdfCheckbox';
import PdfRadioButton from './components/PdfRadioButton';
import PdfDateTime from './components/PdfDateTime';
import PdfSignature from './components/PdfSignature';
import PdfDropdown from './components/PdfDropdown';

interface Props {
  layout: PdfInputValueLayout;
  component: DynamicFormComponent;
  section: string;
}

function PdfFormInput({layout, component, section}: Props) {
  const name = getFieldName(section, component.nameId);

  switch (component.type) {
    case ComponentType.Text:
      return (
        <PdfTextInput
          name={name}
          component={component as TextComponent}
          layout={layout}
        />
      );
    case ComponentType.Float:
      return (
        <PdfNumberInput
          name={name}
          component={component}
          layout={layout}
          variant="float"
        />
      );
    case ComponentType.Integer:
      return (
        <PdfNumberInput
          name={name}
          component={component}
          layout={layout}
          variant="integer"
        />
      );
    case ComponentType.Checkbox:
      return <PdfCheckbox component={component} name={name} layout={layout} />;
    case ComponentType.MultipleChoice:
      return (
        <PdfRadioButton component={component} name={name} layout={layout} />
      );
    case ComponentType.Autocomplete:
      return (
        <ValueContainer
          component={component}
          value={parseAutocompleteAnswer(component)}
          layout={layout}
          disabled
        />
      );
    case ComponentType.Date:
      return (
        <PdfDateTime
          component={component as TextComponent}
          name={name}
          layout={layout}
        />
      );
    case ComponentType.Signature:
      return <PdfSignature component={component} name={name} layout={layout} />;
    case ComponentType.Dropdown:
      return <PdfDropdown component={component} name={name} layout={layout} />;
    default:
      return null;
  }
}

export default PdfFormInput;