import { UserOutlined } from '@ant-design/icons';
import { ProFormText } from '@ant-design/pro-components';
import { FormattedMessage, useIntl } from '@umijs/max';

const ForgotPasswordForm = () => {
  const intl = useIntl();

  return (
    <>
      <ProFormText
        name="email"
        fieldProps={{
          autoComplete: 'email',
          autoFocus: true,
          size: 'large',
          prefix: <UserOutlined className={'prefixIcon'} />,
        }}
        placeholder={intl.formatMessage({
          id: 'master.auth.login.email',
          defaultMessage: 'Email',
        })}
        rules={[
          {
            required: true,
            message: (
              <FormattedMessage
                id="master.auth.validation.email"
                defaultMessage="Email is required"
              />
            ),
          },
          {
            type: 'email',
            message: (
              <FormattedMessage
                id="master.users.email.invalid"
                defaultMessage="Invalid email address"
              />
            ),
          },
        ]}
      />
    </>
  );
};

export default ForgotPasswordForm;
