.block.due_date
  .title
    Due date
    - if can?(current_user, :admin_issue, @project)
      = icon("spinner spin", class: "block-loading")
      = link_to "Edit", "#", class: "edit-link pull-right"
  .value
    .value-content
      %span.no-value{ "v-if" => "!issue.dueDate" }
        No due date
      %span.bold{ "v-if" => "issue.dueDate" }
        {{ issue.dueDate | due-date }}
      - if can?(current_user, :admin_issue, @project)
        %span.no-value.js-remove-due-date-holder{ "v-if" => "issue.dueDate" }
          \-
          %a.js-remove-due-date{ href: "#", role: "button" }
            remove due date
  - if can?(current_user, :admin_issue, @project)
    .selectbox
      %input{ type: "hidden",
        name: "issue[due_date]",
        ":value" => "issue.dueDate" }
      .dropdown
        %button.dropdown-menu-toggle.js-due-date-select.js-issue-boards-due-date{ type: 'button',
          data: { toggle: 'dropdown', field_name: "issue[due_date]", ability_name: "issue" },
          ":data-issue-update" => "'#{namespace_project_issues_path(@project.namespace, @project)}/' + issue.id + '.json'" }
          %span.dropdown-toggle-text Due date
          = icon('chevron-down')
        .dropdown-menu.dropdown-menu-due-date
          = dropdown_title('Due date')
          = dropdown_content do
            .js-due-date-calendar
