{% import "components.html" as c with context %}
{# the question before an agent is let go: a box over the page #}
<div class="veil" id="agent-remove" x-data="dialog(true)" x-bind="dialog" x-cloak @click.self="open = false">
  <form x-trap.inert.noscroll="open" role="dialog" aria-modal="true" aria-labelledby="agent_remove-title" tabindex="-1" class="dialog danger" hx-delete="/agents/{{ ref(selected.computer_id) }}/{{ ref(selected.id) }}" hx-target="#main" hx-swap="innerHTML">
    <h3 id="agent_remove-title">{{ t.text("agents.remove_ask", {"name": selected.name}) }}</h3>
    <p class="st">{{ t.text("agents.remove_hint") }}</p>
    {% if failed %}<p class="err">{{ t.text("agents." ~ failed.partition(":")[0], {"code": failed.partition(":")[2] or none}) }}</p>{% endif %}
    <button class="btn danger" type="submit">{{ c.icon("trash-2") }} {{ t.text("agents.remove_yes") }}</button>
    <button class="btn" type="button" @click="open = false">{{ t.text("computers.cancel") }}</button>
  </form>
</div>