- return if pipeline_has_errors
- dag_pipeline_tab_enabled = Feature.enabled?(:dag_pipeline_tab, @project, default_enabled: true)

.tabs-holder
  %ul.pipelines-tabs.nav-links.no-top.no-bottom.mobile-separator.nav.nav-tabs
    %li.js-pipeline-tab-link
      = link_to project_pipeline_path(@project, @pipeline), data: { target: '#js-tab-pipeline', action: 'pipelines', toggle: 'tab' }, class: 'pipeline-tab' do
        = _('Pipeline')
    - if dag_pipeline_tab_enabled
      %li.js-dag-tab-link
        = link_to dag_project_pipeline_path(@project, @pipeline), data: { target: '#js-tab-dag', action: 'dag', toggle: 'tab' }, class: 'dag-tab' do
          = _('DAG')
    %li.js-builds-tab-link
      = link_to builds_project_pipeline_path(@project, @pipeline), data: { target: '#js-tab-builds', action: 'builds', toggle: 'tab' }, class: 'builds-tab' do
        = _('Jobs')
        %span.badge.badge-pill.js-builds-counter= pipeline.total_size
    - if @pipeline.failed_builds.present?
      %li.js-failures-tab-link
        = link_to failures_project_pipeline_path(@project, @pipeline), data: { target: '#js-tab-failures', action: 'failures', toggle: 'tab' }, class: 'failures-tab' do
          = _('Failed Jobs')
          %span.badge.badge-pill.js-failures-counter= @pipeline.failed_builds.count
    %li.js-tests-tab-link
      = link_to test_report_project_pipeline_path(@project, @pipeline), data: { target: '#js-tab-tests', action: 'test_report', toggle: 'tab' }, class: 'test-tab' do
        = s_('TestReports|Tests')
        %span.badge.badge-pill.js-test-report-badge-counter= @pipeline.test_report_summary.total[:count]
    = render_if_exists "projects/pipelines/tabs_holder", pipeline: @pipeline, project: @project

.tab-content
  #js-tab-pipeline.tab-pane.position-absolute.position-left-0.w-100
    #js-pipeline-graph-vue

  #js-tab-builds.tab-pane
    - if pipeline.legacy_stages.present?
      .table-holder.pipeline-holder
        %table.table.ci-table.pipeline
          %thead
            %tr
              %th= _('Status')
              %th= _('Job ID')
              %th= _('Name')
              %th
              %th= _('Coverage')
              %th
          = render partial: "projects/stage/stage", collection: pipeline.legacy_stages, as: :stage

  - if @pipeline.failed_builds.present?
    #js-tab-failures.build-failures.tab-pane.build-page
      %table.table.responsive-table.ci-table.responsive-table-sm-rounded
        %thead
          %th.table-th-transparent
          %th.table-th-transparent= _('Name')
          %th.table-th-transparent= _('Stage')
          %th.table-th-transparent= _('Failure')

        %tbody
          - @pipeline.failed_builds.each_with_index do |build, index|
            - job = build.present(current_user: current_user)
            %tr.build-state.responsive-table-border-start
              %td.responsive-table-cell.ci-status-icon-failed{ data: { column: _('Status')} }
                .d-none.d-md-block.build-icon
                  = custom_icon("icon_status_#{build.status}")
                .d-md-none.build-badge
                  = render "ci/status/badge", link: false, status: job.detailed_status(current_user)
              %td.responsive-table-cell.build-name{ data: { column: _('Name')} }
                = link_to build.name, pipeline_job_url(pipeline, build)
              %td.responsive-table-cell.build-stage{ data: { column: _('Stage')} }
                = build.stage.titleize
              %td.responsive-table-cell.build-failure{ data: { column: _('Failure')} }
                = build.present.callout_failure_message
              %td.responsive-table-cell.build-actions
                - if can?(current_user, :update_build, job)
                  = link_to retry_project_job_path(build.project, build, return_to: request.original_url), method: :post, title: _('Retry'), class: 'btn btn-build gl-button btn-icon btn-default' do
                    = sprite_icon('repeat', css_class: 'gl-icon')
            - if can?(current_user, :read_build, job)
              %tr.build-trace-row.responsive-table-border-end
                %td
                %td.responsive-table-cell.build-trace-container{ colspan: 4 }
                  %pre.build-trace.build-trace-rounded
                    %code.bash.js-build-output
                      = build_summary(build)

  - if dag_pipeline_tab_enabled
    #js-tab-dag.tab-pane
      #js-pipeline-dag-vue{ data: { pipeline_project_path: @project.full_path, pipeline_iid: @pipeline.iid, empty_svg_path: image_path('illustrations/empty-state/empty-dag-md.svg'), dag_doc_path: help_page_path('ci/yaml/README.md', anchor: 'needs')} }

  #js-tab-tests.tab-pane
    #js-pipeline-tests-detail{ data: { summary_endpoint: summary_project_pipeline_tests_path(@project, @pipeline, format: :json),
      suite_endpoint: project_pipeline_test_path(@project, @pipeline, suite_name: ':suite_name', format: :json) } }
  = render_if_exists "projects/pipelines/tabs_content", pipeline: @pipeline, project: @project