- return if pipeline_has_errors

.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')
    %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
        = _('Needs')
    %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')
        = gl_badge_tag @pipeline.total_size, { size: :sm }, { class: 'js-builds-counter' }
    - 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')
          = gl_badge_tag @pipeline.failed_builds.count, { size: :sm }, { class: 'js-failures-counter' }
    %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')
        = gl_badge_tag @pipeline.test_report_summary.total[:count], { size: :sm }, { class: 'js-test-report-badge-counter' }
    = render_if_exists "projects/pipelines/tabs_holder", pipeline: @pipeline, project: @project

.tab-content
  #js-tab-pipeline.tab-pane.gl-w-full
    #js-pipeline-graph-vue

  #js-tab-builds.tab-pane
    - if stages.present?
      #js-pipeline-jobs-vue{ data: { full_path: @project.full_path, pipeline_iid: @pipeline.iid } }

  - if @pipeline.failed_builds.present?
    #js-tab-failures.tab-pane
      #js-pipeline-failed-jobs-vue{ data: { full_path: @project.full_path, pipeline_iid: @pipeline.iid, failed_jobs_summary_data: prepare_failed_jobs_summary_data(@pipeline.failed_builds) } }

  #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'), about_dag_doc_path: help_page_path('ci/directed_acyclic_graph/index.md'), dag_doc_path: help_page_path('ci/yaml/index.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', format: :json),
      blob_path: project_blob_path(@project, @pipeline.sha),
      has_test_report: @pipeline.complete_and_has_reports?(Ci::JobArtifact.of_report_type(:test)).to_s,
      empty_state_image_path: image_path('illustrations/empty-state/empty-test-cases-lg.svg'),
      artifacts_expired_image_path: image_path('illustrations/pipeline.svg') } }
  = render_if_exists "projects/pipelines/tabs_content", pipeline: @pipeline, project: @project