export async function renderRegressionsChart()

in ui/changes/src/common.js [674:882]


export async function renderRegressionsChart(
  chartEl,
  bugSummaries,
  carryover = false
) {
  bugSummaries = bugSummaries.filter((bugSummary) => bugSummary.regression);

  if (bugSummaries.length == 0) {
    return;
  }

  let minDate = getPlainDate(
    bugSummaries.reduce((minSummary, summary) =>
      Temporal.PlainDate.compare(
        getPlainDate(summary.creation_date),
        getPlainDate(minSummary.creation_date)
      ) < 0
        ? summary
        : minSummary
    ).creation_date
  );

  let summaryOpenData = await getSummaryData(
    bugSummaries,
    getOption("grouping"),
    minDate,
    (counterObj, bug) => {
      if (bug.regression) {
        counterObj.regressions += 1;
      }
    },
    null,
    (summary) => summary.creation_date
  );

  let summaryFixData = await getSummaryData(
    bugSummaries.filter((bug) => bug.fixed && !!bug.date),
    getOption("grouping"),
    minDate,
    (counterObj, bug) => {
      const days = getPlainDate(bug.creation_date).until(
        getPlainDate(bug.date),
        {
          largestUnit: "days",
        }
      ).days;

      if (days <= 7) {
        counterObj.fixed_week_regressions += 1;
      } else if (days <= 31) {
        counterObj.fixed_month_regressions += 1;
      } else {
        counterObj.fixed_ancient_regressions += 1;
      }
    },
    null,
    (summary) => summary.date
  );

  const openDates = Object.keys(summaryOpenData);
  const fixDates = Object.keys(summaryFixData);
  const dates = openDates.length >= fixDates.length ? openDates : fixDates;

  let categories = [];
  let regressions = [];
  let fixed_week_regressions = [];
  let fixed_month_regressions = [];
  let fixed_ancient_regressions = [];
  for (const date of dates) {
    categories.push(date);
    if (date in summaryOpenData) {
      regressions.push(summaryOpenData[date].regressions);
    } else {
      regressions.push(0);
    }
    if (date in summaryFixData) {
      fixed_week_regressions.push(summaryFixData[date].fixed_week_regressions);
      fixed_month_regressions.push(
        summaryFixData[date].fixed_month_regressions
      );
      fixed_ancient_regressions.push(
        summaryFixData[date].fixed_ancient_regressions
      );
    } else {
      fixed_week_regressions.push(0);
      fixed_month_regressions.push(0);
      fixed_ancient_regressions.push(0);
    }
  }

  const series = [
    {
      name: "Fixed < 1 week old regressions",
      type: "column",
      data: fixed_week_regressions,
    },
    {
      name: "Fixed < 1 month old regressions",
      type: "column",
      data: fixed_month_regressions,
    },
    {
      name: "Fixed > 1 month old regressions",
      type: "column",
      data: fixed_ancient_regressions,
    },
  ];

  if (carryover) {
    const finalRegressions = await getRegressionCount(getOption("components"));

    const regressions_total = [finalRegressions];
    for (const date of dates.slice(1).reverse()) {
      const new_regressions =
        date in summaryOpenData ? summaryOpenData[date].regressions : 0;
      const fixed_regressions =
        date in summaryFixData
          ? summaryFixData[date].fixed_ancient_regressions +
            summaryFixData[date].fixed_month_regressions +
            summaryFixData[date].fixed_week_regressions
          : 0;
      regressions_total.unshift(
        regressions_total[0] - (new_regressions - fixed_regressions)
      );
    }

    series.push({
      name: "Total regressions",
      type: "line",
      data: regressions_total,
    });
  }

  const options = {
    series: series,
    chart: {
      type: "line",
      height: 350,
      stacked: true,
      toolbar: {
        show: false,
      },
      animations: {
        enabled: false,
      },
    },
    title: {
      text: "Number of new/fixed regressions",
      align: "left",
    },
    plotOptions: {
      bar: {
        borderRadius: 8,
        horizontal: false,
      },
    },
    xaxis: {
      categories: categories,
      title: {
        text: "Date",
      },
    },
    yaxis: [
      {
        seriesName: "Fixed < 1 week old regressions",
        axisTicks: {
          show: true,
        },
        axisBorder: {
          show: true,
        },
        title: {
          text: "New # of bugs",
        },
      },
      {
        seriesName: "Fixed < 1 week old regressions",
        show: false,
      },
      {
        seriesName: "Fixed < 1 week old regressions",
        show: false,
      },
      {
        seriesName: "Total regressions",
        opposite: true,
        axisTicks: {
          show: true,
        },
        axisBorder: {
          show: true,
        },
        title: {
          text: "Total # of bugs",
        },
      },
    ],
    legend: {
      position: "right",
      offsetY: 40,
    },
    fill: {
      opacity: 1,
    },
  };

  let chart = new ApexCharts(chartEl, options);
  chart.render();
}