{{define "dashboard_content"}}
<section class="split-grid">
  <div>
    <div class="section-head">
      <h3>Virtual Machines</h3>
      <a class="button" href="/vms/new">Create VM</a>
    </div>
    <table>
      <thead>
        <tr>
          <th>Name</th>
          <th>State</th>
          <th>IP</th>
          <th>Spec</th>
          <th>Created</th>
        </tr>
      </thead>
      <tbody>
        {{range .VMs}}
        <tr>
          <td><a class="table-link" href="/vms/{{.ID}}">{{.Name}}</a></td>
          <td><span class="state-pill {{stateClass .State}}">{{.State}}</span></td>
          <td>{{if .Runtime.GuestIP}}{{.Runtime.GuestIP}}{{else}}-{{end}}</td>
          <td>{{.Spec.VCPUCount}} vCPU / {{.Spec.MemoryMiB}} MiB / {{formatBytes .Spec.WorkDiskSizeBytes}}</td>
          <td>{{relativeTime .CreatedAt}}</td>
        </tr>
        {{else}}
        <tr><td colspan="5" class="muted">No VMs yet.</td></tr>
        {{end}}
      </tbody>
    </table>
  </div>
  <div>
    <div class="section-head">
      <h3>Images</h3>
      <div class="stack-inline">
        <a class="button secondary" href="/images/register">Register</a>
        <a class="button" href="/images/build">Build</a>
      </div>
    </div>
    <table>
      <thead>
        <tr>
          <th>Name</th>
          <th>Managed</th>
          <th>Rootfs</th>
          <th>Created</th>
        </tr>
      </thead>
      <tbody>
        {{range .Images}}
        <tr>
          <td><a class="table-link" href="/images/{{.ID}}">{{.Name}}</a></td>
          <td>{{formatBool .Managed}}</td>
          <td><code>{{.RootfsPath}}</code></td>
          <td>{{relativeTime .CreatedAt}}</td>
        </tr>
        {{else}}
        <tr><td colspan="4" class="muted">No images registered.</td></tr>
        {{end}}
      </tbody>
    </table>
  </div>
</section>
{{end}}