{% set question = request.args.get('question', '') %}

<form method="get">
  <label for="nl2bql-question">Ask a question about your ledger</label>
  <input id="nl2bql-question" name="question" value="{{ question }}"
         placeholder="e.g. how much did I spend on groceries last month?" size="60">
  <button type="submit">Ask</button>
</form>

{% if question %}
  {% set translation = extension.translate(question) %}
  {% if translation.error %}
    <p class="error">{{ translation.error }}</p>
  {% elif translation.bql %}
    <h4>Generated BQL</h4>
    <pre>{{ translation.bql }}</pre>

    <h4>Result</h4>
    {% set result = extension.run_query(translation.bql) %}
    {% if result.t == 'table' %}
      <p>
        Download as
        <a href="{{ url_for('download_query', result_format='csv', query_string=translation.bql) }}" data-remote>CSV</a>{% if config.HAVE_EXCEL %},
        <a href="{{ url_for('download_query', result_format='xlsx', query_string=translation.bql) }}" data-remote>XLSX</a>, or
        <a href="{{ url_for('download_query', result_format='ods', query_string=translation.bql) }}" data-remote>ODS</a>{% endif %}
      </p>
      <svelte-component type="query-table"><script type="application/json">{{ result|tojson }}</script></svelte-component>
    {% else %}
      <pre>{{ result.contents }}</pre>
    {% endif %}
  {% endif %}
{% endif %}