import React, {useCallback} from 'react'
import PropTypes from 'prop-types'
import FailTemplate from 'react-uikit/alert/templates/fail'
import modalTypes from 'containers/modal-manager/modal-types'

const PasswordResetError = ({payload, isShowing, onDismiss, showModal}) => {
    const {reason} = payload.error.errors[0]
    const handleDismiss = useCallback(() => {
        showModal({type: modalTypes.MODAL_PASSWORD_RESET})
        return onDismiss && onDismiss()
    }, [])

    return (
        <FailTemplate
            body={reason}
            header="Something went wrong…"
            iconName={'alert-error'}
            isShowing={isShowing}
            onDismiss={handleDismiss}
        />
    )
}

PasswordResetError.propTypes = {
    ...FailTemplate.propTypes,
    error: PropTypes.object,
}

export default PasswordResetError