{{define "body"}}<section class="card">
  <h1>{{.Project.Name}}</h1>
  <p class="muted">Working dir: <code>{{.Project.WorkingDir}}</code>{{if .Project.ConfigFiles}} · compose file: <code>{{.Project.ConfigFiles}}</code>{{end}} · last refresh: {{fmtTime .LastAt}}</p>

  {{if .ActionMessage}}
  <p class="{{if .ActionOK}}muted{{else}}muted{{end}}">{{if .ActionOK}}✓{{else}}⚠{{end}} {{.ActionMessage}}</p>
  {{end}}

  <h2>Project actions</h2>
  <div class="cards">
    <form action="/compose/{{.Project.Name}}/up" method="post"><input type="hidden" name="csrf_token" value="{{.CSRFToken}}"><button type="submit">Up</button></form>
    <form action="/compose/{{.Project.Name}}/restart" method="post"><input type="hidden" name="csrf_token" value="{{.CSRFToken}}"><button type="submit">Restart</button></form>
    <form action="/compose/{{.Project.Name}}/pull" method="post"><input type="hidden" name="csrf_token" value="{{.CSRFToken}}"><button type="submit">Pull</button></form>
    <form action="/compose/{{.Project.Name}}/stop" method="post"><input type="hidden" name="csrf_token" value="{{.CSRFToken}}"><button type="submit">Stop</button></form>
    <form action="/compose/{{.Project.Name}}/down" method="post"><input type="hidden" name="csrf_token" value="{{.CSRFToken}}"><button type="submit">Down</button></form>
    <a href="/compose/{{.Project.Name}}/logs"><button type="button">Logs</button></a>
  </div>

  <h2>Services ({{.Project.ServiceCount}})</h2>
  <table>
    <thead><tr><th>Service</th><th>Container</th><th>Image</th><th>State</th><th>Status</th><th>Health</th><th>PID</th><th>Ports</th><th>Actions</th></tr></thead>
    <tbody>
      {{$root := .}}
      {{range .Project.Services}}
      <tr>
        <td>{{.Name}}</td>
        <td>{{range .Containers}}{{.Name}}<br>{{end}}</td>
        <td>{{range .Containers}}{{.Image}}<br>{{end}}</td>
        <td>{{range .Containers}}{{.State}}<br>{{end}}</td>
        <td>{{range .Containers}}{{.Status}}<br>{{end}}</td>
        <td>{{range .Containers}}{{.Health}}<br>{{end}}</td>
        <td>{{range .Containers}}{{.PID}}<br>{{end}}</td>
        <td>{{range .Containers}}{{range .Ports}}{{.HostPort}}<br>{{end}}{{end}}</td>
        <td>
          <form action="/compose/{{$root.Project.Name}}/service/{{.Name}}/up" method="post" style="display:inline"><input type="hidden" name="csrf_token" value="{{$root.CSRFToken}}"><button type="submit">up</button></form>
          <form action="/compose/{{$root.Project.Name}}/service/{{.Name}}/restart" method="post" style="display:inline"><input type="hidden" name="csrf_token" value="{{$root.CSRFToken}}"><button type="submit">restart</button></form>
          <form action="/compose/{{$root.Project.Name}}/service/{{.Name}}/stop" method="post" style="display:inline"><input type="hidden" name="csrf_token" value="{{$root.CSRFToken}}"><button type="submit">stop</button></form>
        </td>
      </tr>
      {{else}}
      <tr><td colspan="9" class="muted">No services discovered for this project.</td></tr>
      {{end}}
    </tbody>
  </table>

  {{if .Project.GroupedMounts}}
  <h2>Mounts</h2>
  <table>
    <thead><tr><th>Source</th><th>Destination</th><th>Type</th><th>Used by</th></tr></thead>
    <tbody>
      {{range .Project.GroupedMounts}}
      <tr>
        <td>{{.Source}}</td>
        <td>{{.Destination}}</td>
        <td>{{.Type}}</td>
        <td>{{.SharedMountSummary}}</td>
      </tr>
      {{end}}
    </tbody>
  </table>
  {{end}}

  {{if .Project.AllTraefikRoutes}}
  <h2>Traefik routes</h2>
  <table>
    <thead><tr><th>Router</th><th>Service</th><th>Container</th><th>Hostnames</th><th>Prefixes</th><th>Rule</th></tr></thead>
    <tbody>
      {{range .Project.AllTraefikRoutes}}
      <tr>
        <td>{{.RouterName}}</td>
        <td>{{.Service}}</td>
        <td>{{.Container}}</td>
        <td>{{range .Hostnames}}{{.}}<br>{{end}}</td>
        <td>{{range .PathPrefixes}}{{.}}<br>{{end}}</td>
        <td><code>{{.Rule}}</code></td>
      </tr>
      {{end}}
    </tbody>
  </table>
  {{end}}
</section>{{end}}