{{define "title"}}{{.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}}
{{if .OK}}<div class="alert alert-success">{{.OK}}</div>{{end}}

<div class="row row-cards">
  <!-- Left column -->
  <div class="col-lg-8">
    <div class="card">
      <div class="card-header">
        <h2 class="card-title">Details</h2>
      </div>
      <div class="card-body">
        <div class="datagrid">
          <div class="datagrid-item">
            <div class="datagrid-title">Status</div>
            <div class="datagrid-content">
              {{if .Repeater.Confirmed}}
                {{if .Repeater.Corroborated}}<span class="badge bg-success-lt" title="Independently reached by {{range $i, $n := .Repeater.Corroborators}}{{if $i}}, {{end}}{{$n}}{{end}}">Corroborated</span>
                {{else if .Repeater.SelfConfirmed}}<span class="badge bg-azure-lt" title="You reached it from your own modem; no one else has corroborated yet">Self-confirmed</span>
                {{else}}<span class="badge bg-success-lt">Confirmed</span>{{end}}
              {{else}}<span class="badge bg-yellow-lt" title="No one has reached this repeater through MeshTender yet">Unconfirmed</span>{{end}}
            </div>
          </div>
          <div class="datagrid-item">
            <div class="datagrid-title">Access level</div>
            <div class="datagrid-content">
              {{if .Repeater.AccessKnown}}{{if .Repeater.IsAdmin}}<span class="badge bg-success-lt">admin</span>{{else}}<span class="badge bg-warning-lt">guest only</span>{{end}}{{else}}<span class="text-secondary">unknown</span>{{end}}
            </div>
          </div>
          {{if not .IsOwner}}
          <div class="datagrid-item">
            <div class="datagrid-title">Owner</div>
            <div class="datagrid-content">{{.Repeater.OwnerName}}</div>
          </div>
          {{end}}
          <div class="datagrid-item">
            <div class="datagrid-title">Added</div>
            <div class="datagrid-content">{{ts .Repeater.CreatedAt "date"}}</div>
          </div>
        </div>

        <div class="mt-3">
          <div class="form-label">Radio settings</div>
          <div class="font-monospace">{{.Radio}}</div>
        </div>

        {{if and .IsOwner .Repeater.Confirmed .Repeater.AccessKnown (not .Repeater.IsAdmin)}}
        <div class="alert alert-warning mt-3 mb-0">
          <div>
            MeshTender only has <strong>guest</strong> access here. Guest is available to anyone with a blank password, so there's no point operating at this level — re-run <code>setperm &lt;your key&gt; 3</code> on the repeater to grant admin, then re-test.
          </div>
        </div>
        {{end}}
      </div>
    </div>

    {{if .IsOwner}}
    <div class="card mt-3">
      <div class="card-header">
        <h2 class="card-title">Organizations</h2>
        <div class="card-actions"><a href="/repeaters/{{.Repeater.PublicID}}/share" class="btn btn-sm">Manage</a></div>
      </div>
      {{if .Orgs}}
      <div class="list-group list-group-flush">
        {{range .Orgs}}
        <div class="list-group-item d-flex align-items-center gap-2">
          <span class="text-secondary">{{template "icon-world" ""}}</span>
          <div class="flex-fill text-truncate">
            <a class="fw-bold text-reset" href="/orgs/{{.OrgSlug}}">{{.OrgName}}</a>
          </div>
          <div class="btn-list flex-nowrap">
            <a class="btn btn-sm" href="/orgs/{{.OrgSlug}}/config{{if $.Repeater.Latitude}}?lat={{$.Repeater.Latitude}}&lon={{$.Repeater.Longitude}}{{end}}" title="This organization's recommended config for this repeater">{{template "icon-settings" "me-1"}}Config</a>
          </div>
        </div>
        {{end}}
      </div>
      {{else}}
      <div class="card-body"><p class="text-secondary mb-0">Not shared with any organization.</p></div>
      {{end}}
    </div>

    {{end}}
  </div>

  <!-- Right column -->
  <div class="col-lg-4">
    <div class="card">
      <div class="card-header"><h2 class="card-title">Identity</h2></div>
      <div class="card-body">
        <div class="form-label">Public key</div>
        <div class="d-flex align-items-start gap-2">
          <code class="pk flex-fill">{{.Repeater.PublicKeyHex}}</code>
          <button type="button" class="btn btn-icon btn-ghost-secondary" title="Copy public key" aria-label="Copy public key" data-copy="{{.Repeater.PublicKeyHex}}">{{template "icon-copy" ""}}</button>
        </div>
        {{if .ContactQR}}
        <hr class="my-3">
        <button class="btn btn-sm w-100" type="button" data-bs-toggle="collapse" data-bs-target="#contact-qr" aria-expanded="false" aria-controls="contact-qr">{{template "icon-qrcode" "me-1"}}<span class="collapse-show">Show</span><span class="collapse-hide">Hide</span>&nbsp;contact QR code</button>
        <div class="collapse" id="contact-qr">
          <div class="text-center mt-3">
            <img src="{{.ContactQR}}" width="200" height="200" class="img-fluid" style="max-width:200px" alt="MeshCore contact QR code for {{.Repeater.Name}}">
            <p class="text-secondary small mt-2 mb-0">Scan with the MeshCore app to add this repeater as a contact.</p>
          </div>
        </div>
        {{end}}
      </div>
    </div>

    {{if .IsOwner}}
    <div class="card mt-3">
      <div class="card-header"><h2 class="card-title">Public page</h2></div>
      <div class="card-body">
        {{if and .Repeater.ExposePublicPage .PublicPageURL}}
        <p class="text-secondary small">Anyone with this link sees the public documentation and stewards.</p>
        <div class="input-group mb-2">
          <code class="form-control font-monospace" id="public-url">{{.PublicPageURL}}</code>
          <button type="button" class="btn" data-copy-target="#public-url">{{template "icon-copy" ""}}</button>
        </div>
        {{if .PublicPageQR}}
        <button class="btn btn-sm w-100" type="button" data-bs-toggle="collapse" data-bs-target="#public-qr" aria-expanded="false" aria-controls="public-qr">{{template "icon-qrcode" "me-1"}}<span class="collapse-show">Show</span><span class="collapse-hide">Hide</span>&nbsp;QR code</button>
        <div class="collapse" id="public-qr">
          <div class="text-center mt-3">
            <img src="{{.PublicPageQR}}" width="200" height="200" class="img-fluid" style="max-width:200px" alt="Public page QR code for {{.Repeater.Name}}">
            <p class="text-secondary small mt-2 mb-0">Scanning it opens this repeater's public page.</p>
          </div>
        </div>
        {{end}}
        {{else if not .Repeater.ExposePublicPage}}
        <p class="text-secondary small mb-0">{{template "icon-world" "me-1"}}No public page. Enable one in <a href="/repeaters/{{.Repeater.PublicID}}/edit">Edit details</a> to get a link and QR code.</p>
        {{end}}
      </div>
    </div>
    {{end}}

    {{if .Repeater.Latitude}}
    <div class="card mt-3">
      <div class="card-header"><h2 class="card-title">Location</h2></div>
      <div class="card-body p-2">
        {{template "map-styles"}}
        <div id="map" style="height:240px" role="region" aria-label="Map of this repeater's location"></div>
        {{template "map-scripts"}}
        <script src="{{ asset "/static/meshmap.js" }}"></script>
        <script nonce="{{.Nonce}}">
          meshMap('map', [{name: {{.Repeater.Name}}, lat: {{.Repeater.Latitude}}, lon: {{.Repeater.Longitude}}}]);
        </script>
        <div class="text-secondary small mt-2 text-center">{{template "icon-map-pin" "me-1"}}<span class="font-monospace">{{.Repeater.Latitude}}, {{.Repeater.Longitude}}</span></div>
      </div>
    </div>
    {{end}}
  </div>
</div>

<a class="back-link mt-3" href="/repeaters">{{template "icon-arrow-left" "me-1"}}All repeaters</a>
{{end}}