{%- macro voila_setup_labextensions(base_url, labextensions) -%}
<script src="{{ page_config['fullStaticUrl'] | e }}/{{ main_js }}"></script>
{%- endmacro %}

{# For backward compatibility #}
{%- macro voila_setup(base_url, nbextensions) -%}
{{ voila_setup_labextensions(base_url, labextensions) }}
{%- endmacro %}

{# Helper functions for updating the loading text #}
{%- macro voila_setup_helper_functions() -%}
<script>
  window.voila_heartbeat = function() {
    console.log('Ok, voila is still executing...');
  }
  window.update_loading_text = function(cell_index, cell_count, text) {
    const spinner = document.getElementById("loading")
    if(spinner && spinner.style.display === "none"){
      spinner.style.display="flex";
    }
    var el = document.getElementById("loading_text");
    let defaultText = `Executing ${cell_index} of ${cell_count}`
    if("{{ progressive_rendering | default("False", true) }}" === "True"){
      defaultText = `Reading ${cell_index} of ${cell_count}`
    }
    innterText = text ?? defaultText
    if(el){
      el.innerHTML = innterText;
    }
  }
  window.display_cells = function() {
    // TODO Apply the same logic to Voici
    if(!window.themeLoaded){
      window.cellLoaded = true;
      return;
    }
    // remove the loading element
    var el = document.getElementById("loading");
    if(el){
      el.parentNode.removeChild(el);
    }
    // show the cell output
    el = document.getElementById("rendered_cells");
    if(el){
      el.style.display = '';
    }
  }

  window.voila_process = {{ voila_process | default("window.update_loading_text") }};
  window.voila_finish = {{ voila_finish | default("window.display_cells") }};
</script>
{%- endmacro %}