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

/* global module */
import { storiesOf } from '@storybook/react';
import { createJobs } from '@bundle-stats/utils';

/* eslint-disable */
import currentData from 'Fixtures/job.current.json'; // eslint-disable-line
import baselineData from 'Fixtures/job.baseline.json'; // eslint-disable-line
/* eslint-enable */
import StandaloneApp from '.';

const JOBS = createJobs([
  { webpack: { stats: currentData.rawData.webpack.stats } },
  { webpack: { stats: baselineData.rawData.webpack.stats } },
  {
    webpack: {
      stats: {
        ...baselineData.rawData.webpack.stats,
        assets: baselineData.rawData.webpack.stats.assets.filter((asset) => asset.name.match(/.(css|js)$/)),
        modules: baselineData.rawData.webpack.stats.modules.slice(0, 100),
      },
    },
  },
]);
const [CURRENT_JOB, BASELINE_JOB] = JOBS;

const stories = storiesOf('StandaloneApp', module);

: console;

  const baselineFilepath = getBaselineStatsFilepath(outputPath);
  let baselineStats = null;

  try {
    if (compare) {
      baselineStats = await readBaseline();
      baselineStats = extractDataFromWebpackStats(baselineStats);
      logger.info(`Read baseline from ${baselineFilepath}`);
    }
  } catch (err) {
    logger.warn(TEXT.PLUGIN_BASELINE_MISSING_WARN);
  }

  const artifacts = createJobs([
    { webpack: { stats: data } },
    ...compare ? [{ webpack: { stats: baselineStats } }] : [],
  ]);

  let reports = [];

  try {
    reports = await createReports(artifacts, { html, json });

    reports.forEach(({ filename, output }) => {
      const filepath = path.join(outDir, filename);

      // eslint-disable-next-line no-param-reassign
      compilation.assets[filepath] = {
        size: () => 0,
        source: () => output,

task: (ctx) => {
        ctx.initialData = createJobs(ctx.artifacts);
      },
    },

const logger = compilation.getInfrastructureLogger
    ? compilation.getInfrastructureLogger('BundleStats')
    : console;

  const baselineFilepath = getBaselineStatesFilepath(outputPath);
  let baselineStats = null;

  try {
    if (compare) {
      baselineStats = await readBaseline();
    }
  } catch (err) {
    logger.warn(TEXT.PLUGIN_BASELINE_MISSING_WARN);
  }

  const artifacts = createJobs([
    {
      builtAt: data.builtAt && (new Date(data.builtAt)).toISOString(),
      hash: data.hash,
      webpack: { stats: data },
    },
    ...compare ? [
      {
        ...baselineStats ? {
          builtAt: baselineStats.builtAt && (new Date(baselineStats.builtAt)).toISOString(),
          hash: baselineStats.hash,
        } : {},
        webpack: { stats: baselineStats },
      },
    ] : [],
  ]);

import { Header, Footer } from '../layout';
import { JobsHeader } from '../components/jobs-header';
import { BundleAssets } from '../components/bundle-assets';
import { BundleAssetsTotalsTable } from '../components/bundle-assets-totals-table';
import { BundleAssetsTotalsChartBars } from '../components/bundle-assets-totals-chart-bars';
import { BundleModules } from '../components/bundle-modules';
import { BundlePackages } from '../components/bundle-packages';
import { Summary } from '../components/summary';
import { DuplicatePackagesWarning } from '../components/duplicate-packages-warning';
import { getWrapperDecorator } from '../stories';
import css from './bundle-page.module.css';

const stories = storiesOf('Prototypes/BundlePage', module);
stories.addDecorator(getWrapperDecorator());

const JOBS = createJobs([
  { webpack: { stats: currentData } },
  { webpack: { stats: baselineData } },
]);
const [currentJob] = JOBS;

const PageHeader = () => (
  <header> (
      <div>
        
        
      </div>
    )}
  /&gt;
);</header>