{% extends "base.html" %} {% block content %}
<h1>Parse training data</h1>
<form method="post" action="/app/obsidian/parse">
  <div class="form-group">
    <label for="training_data">Place your training here</label>
    <textarea
      class="form-control"
      id="training_data"
      name="training_data"
      rows="10"
      required
    ></textarea>
  </div>
  <button type="submit" class="btn btn-primary">Parse Training</button>
  <div>
    <button class="btn btn-secondary" onclick="fetchData()">Fetch Data</button>
    <div id="result"></div>
  </div>
</form>
{% if result %}
<div class="mt-3">
  <h3>Result:</h3>
  <pre>{{ result }}</pre>
</div>
{% endif %}

<script>
  async function fetchData() {
    try {
      const response = await fetch(
        "/api/v1/trainings/obsidian/",
      );

      if (!response.ok) {
        throw new Error(`HTTP error! status: ${response.status}`);
      }

      const data = await response.json();
      document.getElementById("result").innerHTML = JSON.stringify(
        data,
        null,
        2,
      );
    } catch (error) {
      document.getElementById("result").innerHTML = "Error: " + error.message;
    }
  }
</script>
{% endblock %}