import React from 'react';

import { ErrorMessage } from '@digigov/ui/form/ErrorMessage';
import {
  FieldContainer,
  Fieldset,
  FieldsetLegend,
} from '@digigov/ui/form/FieldContainer';

import { FileUpload } from '@digigov/ui/form/FileUpload';
import { Hint } from '@digigov/ui/typography/Hint';
import { VisuallyHidden } from '@digigov/ui/utils/VisuallyHidden';

export const WithErrorMessage = (_: any) => (
  <FieldContainer error>
    <Fieldset>
      <FieldsetLegend size="md">Λογότυπο επιχείρησης</FieldsetLegend>
      <Hint id="file-hint">Το αρχείο μπορεί να είναι png ή jpeg.</Hint>
      <ErrorMessage>
        <VisuallyHidden>Λάθος:</VisuallyHidden> Το επιλεγμένο αρχείο πρέπει να
        είναι μικρότερο από 2MB.
      </ErrorMessage>
      <FileUpload aria-describedby="file-hint">Επιλογή αρχείου</FileUpload>
    </Fieldset>
  </FieldContainer>
);

export default WithErrorMessage;