.fr-container.fr-my-4w
  %h1= title
  .fr-grid-row.fr-grid-row--gutters
    - if @usual_traitement_time.present?
      .fr-col-xs-12
        .fr-callout
          %h2.fr-callout__title= t('.usual_processing_time')
          = render Procedure::EstimatedDelayComponent.new(procedure: @procedure)

    .fr-col-xs-12.fr-col-sm-12.fr-col-lg-6
      .fr-callout{ data: { controller: 'chartkick' } }
        %h2.fr-callout__title= t('.processing_time')
        %p.fr-callout__text.fr-text--md= t('.since_procedure_creation')

        .fr-mt-4w
          .chart-procedures-chart{ data: { 'chartkick-target': 'chart' } }
            = column_chart @usual_traitement_time_by_month,
              library: Chartkick.options[:default_library_config],
              ytitle: t('.nb_days'), legend: "bottom", label: t('.processing_time_graph_description')

    .fr-col-xs-12.fr-col-sm-12.fr-col-lg-6
      .fr-callout
        %h2.fr-callout__title= t('.status_evolution')
        %p.fr-callout__text.fr-text--md= t('.status_evolution_details')

        .fr-mt-4w
          .chart
            = area_chart @dossiers_funnel,
              library: Chartkick.options[:default_library_config],
              ytitle: t('.dossiers_count'), label: t('.dossiers_count')

    .fr-col-xs-12.fr-col-sm-12.fr-col-lg-6
      .fr-callout
        %h2.fr-callout__title= t('.acceptance_rate')
        %p.fr-callout__text.fr-text--md= t('.acceptance_rate_details')

        .fr-mt-4w
          .chart
            = pie_chart @termines_states,
              library: Chartkick.options[:default_library_config],
              code: true,
              colors: ["var(--background-flat-success)", "var(--background-flat-error)", "#FAD859" ],
              label: t('.rate'),
              suffix: '%'

    .fr-col-xs-12.fr-col-sm-12.fr-col-lg-6
      .fr-callout
        %h2.fr-callout__title= t('.weekly_distribution')
        %p.fr-callout__text.fr-text--md= t('.weekly_distribution_details')

        .fr-mt-4w
          .chart
            = line_chart @termines_by_week,
              library: Chartkick.options[:default_library_config],
              colors: ["var(--background-flat-success)", "var(--background-flat-error)", "#FAD859" ],
              ytitle: t('.dossiers_count')