{% extends "relay/base.html" %}
{% block title %}{{ title }}{% endblock %}
{% block content %}
<div class="page-head"><h1>{{ title }}</h1><span class="muted">{{ endpoint.name }}</span></div>
<div class="split">
<form method="post" class="card form">{% csrf_token %}
  {% include "relay/_form.html" %}
  <div class="actions"><button class="btn primary">Save</button><a class="btn" href="{% url 'endpoint_detail' endpoint.pk %}">Cancel</a></div>
</form>
<aside class="card" id="tester" data-expr-url="{% url 'api_expr_test' %}" data-transform-url="{% url 'api_transform_preview' %}">
  <h2>Expression tester</h2>
  <p class="muted">Edits the sample event below (defaults to your latest event). Tests the filter and previews the transform.</p>
  <label>Sample event</label>
  <textarea id="sample" rows="14" spellcheck="false">{{ sample_json }}</textarea>
  <div class="actions"><button type="button" class="btn" id="test-filter">Test filter</button><button type="button" class="btn" id="test-transform">Preview transform</button></div>
  <div id="test-result" class="result" hidden></div>
</aside>
</div>
{% if destination %}
<form method="post" action="{% url 'destination_delete' destination.pk %}" onsubmit="return confirm('Delete destination?')">{% csrf_token %}<button class="btn danger">Delete destination</button></form>
{% endif %}
{% endblock %}
{% block scripts %}{% load static %}<script src="{% static 'relay/tester.js' %}" type="module"></script>{% endblock %}