{% extends 'generic/_base.html' %}
{% load helpers %}
{% load i18n %}

{% block title %}{% trans "Tasks" %}{% endblock %}

{% block subtitle %}
  <div class="text-secondary fs-5">
    {% blocktrans %}The building blocks a workflow composes{% endblocktrans %}
  </div>
{% endblock %}

{% block content %}

{% if custom_tasks_enabled %}
<div class="alert alert-warning d-flex align-items-start gap-2" role="alert">
  <i class="mdi mdi-shield-alert-outline fs-5 mt-1 flex-shrink-0" aria-hidden="true"></i>
  <div>
    <strong>{% trans "Custom task imports are enabled" %}</strong>
    {% trans "Python files in a source's tasks/ directory are imported and run inside NetBox. Anyone who can write to a source can run code here." %}
    <a href="{% url 'plugins:netbox_orchestrator:settings' %}">{% trans "Review the setting" %}</a>.
  </div>
</div>
{% endif %}

<div class="card">
  <div class="card-header d-flex flex-wrap justify-content-between align-items-center gap-3">
    <h2 class="mb-0">{% trans "All tasks" %}</h2>
    <div class="d-flex align-items-center gap-2">
      <label class="form-label mb-0 text-nowrap" for="task-filter">{% trans "Filter" %}</label>
      <input type="search"
             id="task-filter"
             class="form-control"
             style="min-width: 16rem;"
             autocomplete="off"
             placeholder="{% trans 'Name, key or description' %}"
             aria-describedby="task-filter-status">
    </div>
  </div>

  <div class="table-responsive">
    <table class="table table-hover mb-0" id="task-table">
      <caption class="visually-hidden">
        {% trans "Every task available to a workflow, with its inputs, effect, origin, usage and retry settings." %}
      </caption>
      <thead>
        <tr>
          <th scope="col">{% trans "Task" %}</th>
          <th scope="col">{% trans "Inputs" %}</th>
          <th scope="col">{% trans "Effect" %}</th>
          <th scope="col">{% trans "Origin" %}</th>
          <th scope="col">{% trans "Used by" %}</th>
          <th scope="col"><span class="visually-hidden">{% trans "Settings" %}</span></th>
        </tr>
      </thead>
      <tbody>
        {% for entry in entries %}
        <tr data-search="{{ entry.name|lower }} {{ entry.key|lower }} {{ entry.description|lower }}">
          <td>
            <a href="{% url 'plugins:netbox_orchestrator:task_detail' entry.key %}">{{ entry.name }}</a>
            <div><code class="text-muted small">{{ entry.key }}</code></div>
          </td>
          <td>
            {% for input in entry.declarable %}
              <code class="small">{{ input }}</code>{% if not forloop.last %} {% endif %}
            {% empty %}
              <span class="text-muted">{% trans "None" %}</span>
            {% endfor %}
          </td>
          <td>
            {% if entry.mutates_config %}
              <span class="badge bg-warning-subtle text-warning-emphasis border border-warning-subtle">{% trans "Writes config" %}</span>
            {% else %}
              <span class="badge bg-success-subtle text-success-emphasis border border-success-subtle">{% trans "Read only" %}</span>
            {% endif %}
          </td>
          <td>
            {% if entry.is_custom %}
              <span class="badge bg-danger-subtle text-danger-emphasis border border-danger-subtle">{% trans "Custom" %}</span>
              {% if entry.source %}{{ entry.source|linkify }}{% endif %}
              {% if not entry.available %}
                <div class="text-danger-emphasis small">{% trans "Disabled in settings" %}</div>
              {% endif %}
            {% else %}
              <span class="badge bg-secondary-subtle text-secondary-emphasis border border-secondary-subtle">{% trans "Built in" %}</span>
            {% endif %}
          </td>
          <td>
            {% if entry.workflows %}
              {% for workflow in entry.workflows %}
                {{ workflow|linkify }}{% if not forloop.last %}, {% endif %}
              {% endfor %}
            {% else %}
              <span class="text-muted">{% trans "No workflows" %}</span>
            {% endif %}
          </td>
          <td class="text-end">
            {% if perms.netbox_orchestrator.add_tasksetting and perms.netbox_orchestrator.change_tasksetting %}
              <a href="{% url 'plugins:netbox_orchestrator:task_setting_edit' entry.key %}"
                 class="btn btn-sm btn-outline-secondary"
                 aria-label="{% blocktrans with task=entry.name %}Settings for {{ task }}{% endblocktrans %}">
                <i class="mdi mdi-cog-outline" aria-hidden="true"></i>
              </a>
            {% endif %}
            <div class="text-muted small text-nowrap">
              {% blocktrans count counter=entry.retries %}{{ counter }} retry{% plural %}{{ counter }} retries{% endblocktrans %},
              {{ entry.retry_delay }}s
              {% if entry.override %}<span class="text-body-emphasis">{% trans "(overridden)" %}</span>{% endif %}
            </div>
          </td>
        </tr>
        {% empty %}
        <tr>
          <td colspan="6" class="text-center text-muted py-4">{% trans "No tasks registered." %}</td>
        </tr>
        {% endfor %}
        <tr id="task-no-match" hidden>
          <td colspan="6" class="text-center text-muted py-4">{% trans "No task matches the filter." %}</td>
        </tr>
      </tbody>
    </table>
  </div>

  <div class="card-footer text-muted small d-flex justify-content-between">
    <span id="task-filter-status" role="status">
      {% blocktrans count counter=builtin_count %}{{ counter }} built-in task{% plural %}{{ counter }} built-in tasks{% endblocktrans %},
      {% blocktrans count counter=custom_count %}{{ counter }} custom task{% plural %}{{ counter }} custom tasks{% endblocktrans %}
    </span>
    <a href="{% url 'plugins:netbox_orchestrator:settings' %}">{% trans "Custom task settings" %}</a>
  </div>
</div>

<script>
(function () {
  'use strict';

  const input  = document.getElementById('task-filter');
  const table  = document.getElementById('task-table');
  const status = document.getElementById('task-filter-status');
  if (!input || !table || !status) return;

  const rows = Array.from(table.tBodies[0].rows).filter(row => row.dataset.search);
  const noMatch = document.getElementById('task-no-match');
  const initialStatus = status.textContent.trim();

  function apply() {
    const needle = input.value.trim().toLowerCase();
    let shown = 0;
    rows.forEach(row => {
      const hit = !needle || row.dataset.search.includes(needle);
      row.hidden = !hit;
      if (hit) shown += 1;
    });
    if (noMatch) noMatch.hidden = shown !== 0 || rows.length === 0;
    status.textContent = needle
      ? `${shown} of ${rows.length} tasks match "${input.value.trim()}"`
      : initialStatus;
  }

  input.addEventListener('input', apply);
})();
</script>

{% endblock content %}