<!--
    Copyright 2020 The Go Authors. All rights reserved.
    Use of this source code is governed by a BSD-style
    license that can be found in the LICENSE file.
-->
{{template "layout" .}}

{{define "content"}}
  <section class="Workflows">
    <div class="Workflows-header">
      <h2>Workflows</h2>
      <a href="{{baseLink "/workflows/new"}}" class="Button">New</a>
    </div>
    <ul class="WorkflowList">
      {{range $wfid := .WorkflowIDs}}
        {{$detail := index $.WorkflowDetails $wfid}}
        {{$workflow := $detail.Workflow}}
        <li class="WorkflowList-item">
          <h3 class="WorkflowList-title">
            {{$workflow.Name.String}}
            <span class="WorkflowList-titleTime">
              {{$workflow.CreatedAt.UTC.Format "2006/01/02 15:04 MST"}}
            </span>
            {{if not (or $workflow.Finished $workflow.Error)}}
              <div class="WorkflowList-titleStop">
                <form action="{{baseLink (printf "/workflows/%s/stop" $wfid)}}" method="post">
                  <input type="hidden" id="workflow.id" name="workflow.id" value="{{$wfid}}" />
                  <input name="workflow.stop" class="Button Button--red" type="submit" value="STOP" onclick="return this.form.reportValidity() && confirm('This will stop the workflow and all in-flight tasks.\n\nAre you sure you want to proceed?')" />
                </form>
              </div>
            {{end}}
          </h3>
          <div class="WorkflowList-details">
            <div class="WorkflowList-params">
              <table class="WorkflowList-paramsTable">
                <tbody>
                <tr>
                  <td>State:</td>
                  <td class="WorkflowList-paramData">
                    {{if $workflow.Error}}
                      Error
                      <div class="WorkflowList-workflowStateIcon Workflowlist-workflowStateIcon--error"></div>
                    {{else if $workflow.Finished}}
                      Success
                      <div class="WorkflowList-workflowStateIcon Workflowlist-workflowStateIcon--success"></div>
                    {{else}}
                      Pending
                      <div class="WorkflowList-workflowStateIcon Workflowlist-workflowStateIcon--pending"></div>
                    {{end}}
                  </td>
                </tr>
                <tr>
                  <td>Error:</td>
                  <td class="WorkflowList-paramData">{{$workflow.Error}}</td>
                </tr>
                {{range $name, $value := $.WorkflowParams $workflow}}
                  <tr>
                    <td>{{$name}}:</td>
                    <td class="WorkflowList-paramData">{{$value}}</td>
                  </tr>
                {{end}}
                </tbody>
              </table>
            </div>
            <dl class="WorkflowList-output">
              {{ $resultDetail := unmarshalResultDetail $workflow.Output }}
              {{template "itemResult" $resultDetail}}
            </dl>
          </div>
          <h4 class="WorkflowList-sectionTitle">Tasks</h4>
          {{template "task_list" $detail}}
        </li>
      {{end}}
    </ul>
  </section>
{{end}}