How to use the @bundle-stats/utils.addMetricsData function in @bundle-stats/utils

withProps(({ jobs }) => {
    const runs = jobs.map((job) => ({ meta: job }));
    const jobsAssets = jobs.map((job) => {
      const { assets } = assetsWebpackTransform(get(job, 'rawData.webpack.stats'));
      return assets;
    });

    const items = addMetricsData(mergeRunsById(jobsAssets), METRIC_TYPE_FILE_SIZE);

    return {
      runs,
      items,
    };
  }),

export const BundleAssetsTotalsTable = ({ className, jobs }) => {
  const runs = jobs.map(getRun);
  const items = addMetricsData(mergeRunsById(
    map(jobs, (job) => getStatsByMetrics(get(job, 'stats', {}), METRICS)),
  ));

  return (
    
  );
};

withProps(({ jobs }) => {
    const runs = jobs.map((job) => ({ meta: job }));
    const jobsPackages = jobs.map((job) => {
      const bundle = modulesWebpackTransform(get(job, 'rawData.webpack.stats'));
      const res = packagesModulesBundleTransform(bundle);
      return res.packages;
    });

    const duplicatePackages = uniq(flatten(jobs.map((job) => {
      const data = get(job, 'warnings.duplicatePackages', {});
      return flatten(Object.values(data));
    })));

    const items = addDuplicateTag(
      addMetricsData(mergeRunsById(jobsPackages), METRIC_TYPE_FILE_SIZE),
      duplicatePackages,
    );

    return {
      runs,
      items,
    };
  }),

withProps(({ jobs }) => {
    const runs = jobs.map((job) => ({
      meta: job,
      browsertime: getBrowsertimeMetrics(get(job, 'rawData.browsertime')),
    }));

    const items = addMetricsData(mergeRunsById(map(runs, 'browsertime')));

    return {
      runs,
      items,
    };
  }),
);

withProps(({ jobs }) => {
    const runs = jobs.map((job) => ({
      meta: job,
      lighthouse: getLighthouseMetrics(get(job, 'rawData.lighthouse')),
    }));

    const items = addMetricsData(mergeRunsById(map(runs, 'lighthouse')));

    return {
      runs,
      items,
    };
  }),
);

export const BundleAssetsTotalsChartBars = ({ className, jobs }) => {
  const rootClassName = cx(css.root, className);

  const items = addMetricsData(mergeRunsById(
    map(jobs, (job) => getStatsByMetrics(get(job, 'stats', {}), METRICS)),
  ));

  const dataGraphs = [];

  items.forEach(({ runs }) => {
    runs.forEach(({ value }, runIndex) => {
      dataGraphs[runIndex] = [
        ...dataGraphs[runIndex] || [],
        value,
      ];
    });
  });

  const maxValues = max(map(dataGraphs, (values) => sum(values)));
  const maxValue = max(maxValues);