Woocommerce: Update Mini Cart on Ajax

add-to-cart.js

// Update Mini Cart
$.post(
    woocommerce_params.ajax_url,
    {'action': 'mode_theme_update_mini_cart'},
    function(response) {
		$('#mode-mini-cart').html(response);
    }
);

functions.php

<?php
function mode_theme_update_mini_cart() {
    echo wc_get_template( 'cart/mini-cart.php' );
    die();
}
add_filter( 'wp_ajax_nopriv_mode_theme_update_mini_cart', 'mode_theme_update_mini_cart' );
add_filter( 'wp_ajax_mode_theme_update_mini_cart', 'mode_theme_update_mini_cart' );
?>

Setting a timeout of 1 second on the ajax call works for me. I know it is hacky but...

      $('.single_add_to_cart_button').click(function(){
        "use strict";
        setTimeout(() => {
          $.post({
            url: woocommerce_params.ajax_url, // The AJAX URL
            data: {'action': 'heykate_update_mini_cart'}, // Send our PHP function
            success: function(response){
              $('#heykate-cart').html(response); // Repopulate the specific element with the new content
              console.log(response)
            }
          });
        }, 1000)
      })