{{define "app_instances"}}{{template "top" .}}
{{if .Flash}}<p class="banner">{{.Flash}}</p>{{end}}
{{if .FlashErr}}<p class="banner error">{{.FlashErr}}</p>{{end}}
{{template "appnav" .}}

<h2>Instances</h2>
{{if .CanRestartApp}}<form method="post" action="{{.Base}}/apps/{{.AppName}}/restart" class="inline">
  <input type="hidden" name="csrf" value="{{.CSRF}}">
  <button type="submit" class="btn-sm">{{.BrowserRestartCopy.Button}}</button>
</form>{{end}}
{{if or .InstanceRows .InstanceQuery.Q .InstanceQuery.Health .InstanceQuery.Channel}}
<form method="get" class="listctl">
  <input type="search" name="q" value="{{.InstanceQuery.Q}}" placeholder="Filter addresses" aria-label="Filter addresses">
  {{if .InstanceQuery.Health}}<input type="hidden" name="health" value="{{healthSlug .InstanceQuery.Health}}">{{end}}
  <label class="visually-hidden" for="instance-channel">Channel</label>
  <select id="instance-channel" name="channel">
    <option value=""{{if not .InstanceQuery.Channel}} selected{{end}}>{{.InstanceCopy.AllChannels}}</option>
    {{if .InstanceUnknownChannel}}<option value="{{.InstanceQuery.Channel}}" selected>{{.InstanceQuery.Channel}}</option>{{end}}
    {{range .InstanceChannels}}<option value="{{.}}"{{if eq . $.InstanceQuery.Channel}} selected{{end}}>{{.}}</option>{{end}}
  </select>
  <label><input type="checkbox" name="group" value="channel"{{if .InstanceQuery.Group}} checked{{end}}> {{.InstanceCopy.GroupChannel}}</label>
  <button>Filter</button>
</form>
<p class="small">
  <a href="{{.InstanceAllURL}}"{{if not .InstanceQuery.Health}} aria-current="true"{{end}}>All</a>
  {{range .InstancePage.Links}}
  · <a href="{{.URL}}"{{if .Active}} aria-current="true"{{end}}>{{.Word}} {{.Count}}</a>
  {{end}}
</p>
{{end}}
{{if .InstanceRows}}
<div class="tablewrap">
<table class="instances">
  <thead><tr><th scope="col">Address</th><th scope="col">Health</th><th scope="col">Version</th><th scope="col">Channel</th><th scope="col">CPU</th><th scope="col">Memory</th></tr></thead>
  {{if .InstanceQuery.Group}}
  {{range .InstanceGroups}}
  <tbody>
    <tr class="instance-group"><th colspan="6" scope="rowgroup"><code>{{.Channel}}</code> <span class="small">{{$.InstanceCopy.Target}}: {{if .TargetErr}}—{{else if .TargetVersion}}<code>{{.TargetVersion}}</code>{{else}}—{{end}} · Instances: {{len .Rows}} / {{.Total}}</span></th></tr>
    {{range .Rows}}{{template "instance_row" (instanceRowPage $ .)}}{{end}}
  </tbody>
  {{end}}
  {{else}}
  <tbody>{{range .InstanceRows}}{{template "instance_row" (instanceRowPage $ .)}}{{end}}</tbody>
  {{end}}
</table>
</div>
<p class="small">Version is what each copy reports it is running — a dash means
it hasn't reported yet. Charts cover the last 48 hours; the memory line is drawn
against that copy's own peak.</p>
{{if .InstancePage.NextURL}}<p class="small"><a href="{{.InstancePage.NextURL}}">Next {{len .InstanceRows}} shown of {{.InstancePage.Total}} →</a></p>{{end}}
{{else if or .InstanceQuery.Q .InstanceQuery.Health .InstanceQuery.Channel}}
<p>No addresses match.</p>
{{else}}
<p>Nothing running yet. Publish a version, then give it a web address:</p>
{{if .AttachEnable}}<pre><code>{{.AttachEnable}}
{{.AttachCmd}}</code></pre>{{else if .AttachCmd}}<pre><code>{{.AttachCmd}}</code></pre>{{end}}
<p class="small">The address comes live within a couple of minutes.</p>
{{end}}

<h2>Placement</h2>{{if .RegionLine}}
<p id="app-region-line"{{if .RegionLineWarn}} class="banner error"{{end}}>{{.RegionLine}}</p>{{end}}
{{if .AppPlacementKnown}}
<p>{{if .AppPlacement}}This app runs on your fleet <a href="{{.Nav}}/fleets/{{fleetName .AppPlacement}}"><code>{{fleetName .AppPlacement}}</code></a>.{{else}}This app runs on the shared fleet.{{end}}</p>
{{if and .IsOwner .OwnedFleetNames}}
<form method="post" action="{{.Base}}/apps/{{.AppName}}/place" class="settings-row">
  <input type="hidden" name="csrf" value="{{.CSRF}}">
  <label class="visually-hidden" for="place-target">Where this app runs</label>
  <select id="place-target" name="target">
    <option value=""{{if not .AppPlacement}} selected{{end}}>Shared fleet</option>
    {{range .OwnedFleetNames}}<option value="fleet/{{.}}"{{if eq (printf "fleet/%s" .) $.AppPlacement}} selected{{end}}>fleet/{{.}}</option>{{end}}
  </select>
  <button type="submit" class="btn-sm">Move</button>
</form>
<p class="small">Moving changes where this app <em>serves</em>. Data does not move:
hibernated instance state stays in the old placement's bucket.</p>
{{end}}
{{else}}
<p class="small">Could not read where this app runs.</p>
{{end}}

{{if and .Instances .Instances.Reporting .Instances.Instances}}
<details>
<summary>Reported by the app itself ({{len .Instances.Instances}})</summary>
<p class="small">This app tracks its own internal workers and reports them to the platform.</p>
<div class="tablewrap">
<table>
  <tr><th scope="col">Name</th><th scope="col">Status</th><th scope="col">Region</th><th scope="col">Detail</th></tr>
  {{range .Instances.Instances}}
  <tr>
    <td><code>{{.Slug}}</code></td>
    <td>{{if .Status}}{{.Status}}{{else}}—{{end}}</td>
    <td>{{if .Region}}{{.Region}}{{else}}—{{end}}</td>
    <td>{{if .Detail}}{{.Detail}}{{else}}—{{end}}</td>
  </tr>
  {{end}}
</table>
</div>
</details>
{{end}}
{{template "bottom" .}}{{end}}

{{define "instance_row"}}
<tr>
  <td class="instance-address"><a href="{{.Page.Nav}}/apps/{{.Page.AppName}}/instances/{{.Row.Host}}{{.Page.InstanceQuerySuffix}}">{{.Row.Host}}</a> <a class="instance-open" href="https://{{.Row.Host}}" aria-label="{{.Page.InstanceCopy.Open}} {{.Row.Host}}">{{icon "external-link"}}</a></td>
  <td><span class="chip chip-health-{{healthTone .Row.HealthWord}}">{{.Row.HealthWord}}</span></td>
  <td>{{if .Row.Version}}<code>{{.Row.Version}}</code>{{else}}—{{end}}</td>
  <td><code>{{.Row.Channel}}</code></td>
  {{if .Row.Metrics.Reporting}}
  <td><span class="cell-value">{{pct .Row.Metrics.CPUFrac}}</span>{{if .Row.Metrics.SparkCPU}}<svg class="cellspark" aria-hidden="true" viewBox="0 0 240 40" preserveAspectRatio="none"><polyline fill="none" stroke="currentColor" points="{{.Row.Metrics.SparkCPU}}"/></svg>{{end}}</td>
  <td><span class="cell-value">{{bytesOrDash .Row.Metrics.MemBytes}}</span>{{if .Row.Metrics.SparkMem}}<svg class="cellspark" aria-hidden="true" viewBox="0 0 240 40" preserveAspectRatio="none"><polyline fill="none" stroke="currentColor" points="{{.Row.Metrics.SparkMem}}"/></svg>{{end}}</td>
  {{else}}<td colspan="2"><span class="small">no data</span></td>{{end}}
</tr>
{{end}}