{% extends "ui/_layout.html" %}
{% block title %}{{ m.mac }} - bty-web{% endblock %}
{% block content %}
<nav aria-label="breadcrumb">
    <ol class="breadcrumb">
        <li class="breadcrumb-item"><a href="/ui/machines">Machines</a></li>
        <li class="breadcrumb-item active"><code>{{ m.mac }}</code></li>
    </ol>
</nav>

<div class="card mb-4">
    <div class="card-body">
        <h1 class="h4 mb-3"><code>{{ m.mac }}</code></h1>
        <dl class="row mb-0">
            <dt class="col-sm-3">Discovered</dt>
            <dd class="col-sm-9">{{ m.discovered_at or "-" }}</dd>
            <dt class="col-sm-3">Last seen</dt>
            <dd class="col-sm-9">{{ m.last_seen_at or "-" }}{% if m.last_seen_ip %} from <a class="text-decoration-none" href="/ui/events?source_ip={{ m.last_seen_ip|urlencode }}" title="Show every event from this IP"><code>{{ m.last_seen_ip }}</code></a>{% endif %}</dd>
            <dt class="col-sm-3">Last flashed</dt>
            <dd class="col-sm-9">{{ m.last_flashed_at or "-" }}</dd>
            <dt class="col-sm-3">Last task</dt>
            <dd class="col-sm-9">
                {% if m.last_task_status %}
                {# Badge mapping: running=info (in flight), completed=
                   success (rc=0), cancelled=warning (operator abort),
                   failed=danger (rc!=0 / timeout). Same vocabulary as
                   the other manager-driven jobs (hashes, downloads,
                   release-fetches). #}
                {% set badge_map = {
                    'running': 'bg-info',
                    'completed': 'bg-success',
                    'cancelled': 'bg-warning text-dark',
                    'failed': 'bg-danger',
                } %}
                {% set badge = badge_map.get(m.last_task_status, 'bg-light text-dark border') %}
                <span class="badge {{ badge }}">{{ m.last_task_status }}</span>
                <small class="text-muted">at {{ m.last_task_run_at }}</small>
                {% if m.last_task_output_path %}
                <div class="small text-muted">output: <code>{{ m.last_task_output_path }}</code></div>
                {% endif %}
                {# Cancel button when a task is in flight. Hits
                   ``DELETE /tasks/{mac}``; the manager's cancel()
                   sets the per-task threading.Event and SIGTERMs
                   the cijoe subprocess. #}
                {% if m.last_task_status == 'running' %}
                <button type="button" class="btn btn-sm btn-outline-warning mt-2 bty-cancel-task-btn"
                        data-mac="{{ m.mac }}">
                    <i class="bi bi-stop-circle me-1"></i>Cancel running task
                </button>
                <script>
                (function () {
                    document.querySelectorAll(".bty-cancel-task-btn").forEach(function (btn) {
                        btn.addEventListener("click", function () {
                            if (!confirm("Cancel the running cijoe task on " + btn.dataset.mac + "?")) return;
                            btn.disabled = true;
                            fetch("/tasks/" + encodeURIComponent(btn.dataset.mac), {
                                method: "DELETE",
                                credentials: "same-origin",
                            }).then(function () { window.location.reload(); })
                              .catch(function () { btn.disabled = false; });
                        });
                    });
                })();
                </script>
                {% endif %}
                {% else %}
                -
                {% endif %}
            </dd>
            <dt class="col-sm-3">Created</dt>
            <dd class="col-sm-9">{{ m.created_at }}</dd>
            <dt class="col-sm-3">Updated</dt>
            <dd class="col-sm-9">{{ m.updated_at }}</dd>
        </dl>
    </div>
</div>

<div class="card">
    <div class="card-body">
        <h2 class="h5 mb-3">Assignment</h2>
        <form action="/ui/machines/{{ m.mac }}" method="post">
            <div class="mb-3">
                <label class="form-label" for="image_sha256">Image</label>
                <select name="image_sha256" id="image_sha256" class="form-select">
                    <option value="">- none (discovered, will boot from local disk) -</option>
                    {% for img in images %}
                    {# img is bty.images.UnifiedImage: SHA-keyed,
                       with names[] (filenames + manifest names) and
                       a list of sources. Show the first name as the
                       primary label and the short SHA so operators
                       can disambiguate same-named entries. #}
                    <option value="{{ img.sha256 }}" {% if img.sha256 == m.image_sha256 %}selected{% endif %}>
                        {{ img.names[0] }} ({{ img.format or "?" }}, ref:{{ img.sha256[:12] }})
                    </option>
                    {% endfor %}
                </select>
            </div>
            <div class="mb-3">
                <label class="form-label" for="provisioning_mode">Provisioning mode</label>
                <select name="provisioning_mode" id="provisioning_mode" class="form-select">
                    {% for mode in provisioning_modes %}
                    <option value="{{ mode }}" {% if mode == m.provisioning_mode %}selected{% endif %}>{{ mode }}</option>
                    {% endfor %}
                </select>
            </div>
            <div class="mb-3">
                <label class="form-label" for="hostname">Hostname</label>
                <input type="text" name="hostname" id="hostname" class="form-control"
                       value="{{ m.hostname or '' }}" placeholder="(optional)">
            </div>
            <div class="mb-3">
                <label class="form-label" for="cijoe_task_ref">CIJOE task ref</label>
                <input type="text" name="cijoe_task_ref" id="cijoe_task_ref"
                       class="form-control" value="{{ m.cijoe_task_ref or '' }}"
                       placeholder="path/to/post-flash.yaml (only used when provisioning is cijoe-task)">
                <div class="form-text small">
                    Light post-flash scripting only. Each step uses a
                    cijoe built-in script or an inline command;
                    bty-web does not install third-party cijoe script
                    packages. The intent is "set hostname / trigger
                    reboot / drop one config file" - not configuration
                    management. If you need more, bake it into the
                    image instead.
                </div>
            </div>
            <div class="mb-3">
                <label class="form-label" for="boot_policy">Boot policy</label>
                <select name="boot_policy" id="boot_policy" class="form-select">
                    {% for policy in boot_policies %}
                    <option value="{{ policy }}" {% if policy == m.boot_policy %}selected{% endif %}>{{ policy }}</option>
                    {% endfor %}
                </select>
                <div class="form-text">
                    <code>local</code>: PXE boots return sanboot (production / stable).
                    <code>flash</code>: PXE boots chain into the live env so the box
                    re-flashes the assigned image every time (per-job CI cadence).
                    <code>tui</code>: PXE boots chain into the live env in interactive
                    mode (<code>bty-tui</code> on tty1) so the operator picks an image
                    from the server's catalog by hand. The auto-discovery default for
                    unknown MACs is <code>tui</code>; you can flip a known machine
                    here. Completion (<code>POST /pxe/{mac}/done</code>) updates
                    <em>last flashed</em> but never flips the policy - the operator
                    flips back to <code>local</code> when they want the box to stop
                    reflashing.
                </div>
            </div>
            <div class="d-flex justify-content-between">
                <button type="submit" class="btn btn-primary">Save</button>
                <button type="submit" formaction="/ui/machines/{{ m.mac }}/delete"
                        class="btn btn-outline-danger"
                        onclick="return confirm('Delete machine record for {{ m.mac }}?');">
                    Delete record
                </button>
            </div>
        </form>
    </div>
</div>

{# Per-MAC event slice. Filtered to ``subject_kind=machine`` +
   ``subject_id=this MAC`` server-side; the link forwards the
   same filter to /ui/events for drill-down. #}
{% with events=machine_events,
        title="Recent activity for this machine",
        link_to_full="/ui/events?subject_kind=machine&subject_id=" + m.mac %}
{% include "ui/_events_card.html" %}
{% endwith %}
{% endblock %}