Problem with setTimeout when sending Graphql mutation in React

Question

I had this problem. I need to divide the values from one form into two parts and send them to one address.

graphql

mutation calc($applicationRecipientsFilter: ApplicationRecipientsFilterInput) {    
    create(applicationRecipientsFilter: $applicationRecipientsFilter) {
        id
        city {
            id
            name    
        }
        applicationType    
        recipients      
    }
}

hooks

const { mutate } = useMutation(calc);

const addNewNotification = useCallback( 
    async (args) => { 
        try { 
            const { error } = await mutate(args); 
            if (error) { 
                console.log(error)
                return; 
            } 
        } catch (e) { 
            console.log(e)
        } 
    }, 
    [mutate], 
);

component

const handleAddNotification = useCallback(() => { 
    const { city, email, email2 } = values; // values from useFormik();
    const currentCity = citiesOption.find(({ value }) => value === city); 

    const createArguments = (applicationType, recipients) => ({ 
        applicationRecipients: { 
            city: { 
                name: currentCity?.label, 
                id: currentCity?.value, 
            }, 
            applicationType, 
            recipients, 
        }, 
    }); 

    addNewNotification(createArguments(creditTypeOption[0]?.value, email)); 

    setTimeout(() => addNewNotification(createArguments(creditTypeOption[1]?.value, email2)), 1500); 
}, [addNewNotification, creditTypeOption, values, citiesOption]);

Why, if setTimeout is used, everything is successfully sent? If you don't use it, you just get cancelled status and nothing in the response And what other ways are there to rewrite the code without using setTimeout?

addNewNotification(createArguments(creditTypeOption[0]?.value, email)); 
addNewNotification(createArguments(creditTypeOption[1]?.value, email2)),