{{define "title"}}Maintenance · {{.Repeater.Name}} · MeshTender{{end}}
{{define "header"}}{{template "repeater-header" .Nav}}{{end}}
{{define "content"}}
{{template "repeater-tabs" .Nav}}
{{if .Error}}<div class="alert alert-danger">{{.Error}}</div>{{end}}

<div class="card">
  <div class="card-body">
    <h2 class="card-title">Log maintenance</h2>
    <p class="text-secondary">
      Record physical service work — antenna swaps, battery/solar changes, firmware updates, site visits —
      so the history outlives any one person. Anyone with access can log an entry.
    </p>
    <form method="post" action="/repeaters/{{.Repeater.PublicID}}/maintenance">
      <div class="row g-2">
        <div class="col-12 col-md-3">
          <label class="form-label" for="performed_at">Date</label>
          {{/* value/max are the server's UTC "today" as a no-JS fallback;
               data-local-today lets ui.js reset them to the viewer's local date,
               which can differ from UTC by a day. */}}
          <input type="date" class="form-control" id="performed_at" name="performed_at" value="{{.Today}}" max="{{.Today}}" data-local-today>
        </div>
        <div class="col-12 col-md-9">
          <label class="form-label" for="note">What was done</label>
          <input type="text" class="form-control" id="note" name="note" maxlength="2000" placeholder="e.g. Replaced 12V battery; swapped to 6dBi antenna" required>
        </div>
      </div>
      <div class="btn-list mt-3">
        <button type="submit" class="btn btn-primary">Add entry</button>
      </div>
    </form>
  </div>
</div>

{{if .Entries}}
<ul class="timeline mt-3">
  {{range .Entries}}
  <li class="timeline-event">
    <div class="timeline-event-icon">{{template "icon-settings" ""}}</div>
    <div class="card timeline-event-card">
      <div class="card-body">
        <div class="text-secondary float-end">{{ts .PerformedAt "date"}}</div>
        <div style="white-space: pre-wrap">{{.Note}}</div>
        <div class="text-secondary small mt-2 d-flex align-items-center gap-2">
          <span class="maint-author" data-testid="maint-author">{{if .AuthorName}}{{.AuthorName}}{{else}}(unknown){{end}}</span>
          {{if $.IsOwner}}
          <form method="post" action="/repeaters/{{$.Repeater.PublicID}}/maintenance/delete" class="m-0 ms-auto" data-confirm="Delete this maintenance entry?">
            <input type="hidden" name="entry_id" value="{{.ID}}">
            <button type="submit" class="btn btn-sm btn-ghost-danger">Delete</button>
          </form>
          {{end}}
        </div>
      </div>
    </div>
  </li>
  {{end}}
</ul>
{{else}}
<div class="card mt-3">
  <div class="card-body"><p class="text-secondary mb-0">No maintenance has been logged yet.</p></div>
</div>
{{end}}
{{end}}