Axios предотвращает выполнение других методов

У меня есть модальная форма, которую я хочу закрыть сразу после отправки. Форма работает отлично, и ввод данных из формы отражается в базе данных, но остальные действия в том же методе по какой-то причине не запускаются.

Я хочу, чтобы форма выполнялась при нажатии кнопки отправки:

1) измените loading на true через `setLoading (true)

2) опубликовать входные данные

3) закрыть модальное окно

В настоящее время 1) и 3) не выполняются. closeModal отлично работает, если я закомментирую axios.

Ниже приводится модальное:

const Form = ({ closeModal }) => {
    const [email, setEmail] = useState('')
    const [firstName, setFirstName] = useState('')
    const [lastName, setLastName] = useState('')
    const [loading, setLoading] = useState(false)

    const handleSubmit = async e => {
        setLoading(true)                
        e.preventDefault()    
        try {
            await axios.post(`${ROOT_URL}/createEmailList`, {
                email,
                firstName,
                lastName
            })
        } catch (err) {
            console.log(err)
        } finally {
            setLoading(false)
            closeModal()                        
        }
    }

    return (
        <form 
            className="form"
            onSubmit={handleSubmit}
        >
            <div className="label">Name *</div>
            <div className="desc">What is your name?</div> 
            <div className="input-container">
                <label className="label">
                    <input 
                        className="input" 
                        type="text" 
                        value={firstName} 
                        onChange={e => setFirstName(e.target.value)} 
                    />
                    <div className="desc">First Name</div>
                </label>
                <label className="label">
                    <input 
                        className="input"
                        type="text" 
                        value={lastName} 
                        onChange={e => setLastName(e.target.value)} 
                    />
                    <div className="desc">Last Name</div>
                </label>
            </div>
            <div className="label">Email Address *</div>
            <div className="input-container">
                <label className="label">
                    <input 
                        className="input2" 
                        type="email" 
                        value={email} 
                        onChange={e => setEmail(e.target.value)} 
                        required
                    />
                </label>
            </div>
            <button className="button">
                {loading ? "Loading..." : "Submit"}
            </button>
        </form>
    )
}

Кроме того, я использую функции Google (Firebase) в качестве серверной части.

Обновлять:

const handleSubmit = async e => {
    setLoading(true)                
    e.preventDefault()    
    try {
        await axios.post(`${ROOT_URL}/createEmailList`, {
            email,
            firstName,
            lastName
        })
    setLoading(false)
    closeModal() 
    } catch (err) {
        console.log(err)
    }
}