gulpfile.js

/**
 * Copyright (c) Forward Email LLC
 * SPDX-License-Identifier: BUSL-1.1
 */

const process = require('node:process');
const path = require('node:path');
const crypto = require('node:crypto');
const fs = require('node:fs');

// Disable watching and persistence of I18N files in build processes. Locale
// changes must come from an explicit, reviewed extraction workflow.
process.env.I18N_SYNC_FILES = false;
process.env.I18N_AUTO_RELOAD = false;
process.env.I18N_UPDATE_FILES = false;

// eslint-disable-next-line import/no-unassigned-import
require('#config/env');

// eslint-disable-next-line import/no-unassigned-import
require('#config/mongoose');

// const Graceful = require('@ladjs/graceful');
// const Mandarin = require('mandarin');
const RevAll = require('gulp-rev-all');
const babel = require('gulp-babel');
const browserify = require('browserify');
const concat = require('gulp-concat');
const cssnano = require('cssnano');
const del = require('del');
const discardFonts = require('postcss-discard-font-face');
const discardUnused = require('postcss-discard-unused');
const comments = require('postcss-discard-comments');
const cssVariables = require('postcss-css-variables');
const envify = require('@ladjs/gulp-envify');
const filter = require('gulp-filter');
const getStream = require('get-stream');
const globby = require('globby');
const gulpRemark = require('gulp-remark');
const gulpXo = require('gulp-xo');
// const isCI = require('is-ci');
const lr = require('gulp-livereload');
const makeDir = require('make-dir');
// const ms = require('ms');
const nested = require('postcss-nested');
const order = require('gulp-order');
const postcss = require('gulp-postcss');
const postcss100VHFix = require('postcss-100vh-fix');
const postcssInlineBase64 = require('postcss-inline-base64');
const postcssPresetEnv = require('postcss-preset-env');
const postcssViewportHeightCorrection = require('postcss-viewport-height-correction');
const postcssStripFontFace = require('postcss-strip-font-face');
const prettier = require('gulp-prettier');
const pruneVar = require('postcss-prune-var');
const pugLinter = require('gulp-pug-linter');
const pump = require('pump');
const purgeFromPug = require('purgecss-from-pug');
const purgecss = require('gulp-purgecss');
// const pWaitFor = require('p-wait-for');
const rename = require('gulp-rename');
const reporter = require('postcss-reporter');
const rev = require('gulp-rev');
const revSri = require('gulp-rev-sri');
const sass = require('gulp-sass')(require('node-sass'));
const sourcemaps = require('gulp-sourcemaps');
const stylelint = require('@ronilaukkarinen/gulp-stylelint');
const terser = require('gulp-terser');
const subsetFont = require('subset-font');
const through2 = require('through2');
const unassert = require('gulp-unassert');
const { lastRun, watch, series, parallel, src, dest } = require('gulp');

const env = require('#config/env');
const config = require('#config');
const findIconFontOverrides = require('#helpers/find-icon-font-overrides');
const logger = require('#helpers/logger');
// const i18n = require('#helpers/i18n');
const { developerDocs } = require('#config/utilities');

const PROD = config.env === 'production';
const DEV = config.env === 'development';
const TEST = config.env === 'test';

// // dynamically import file-type
// let imagemin;
//
// import('gulp-imagemin').then((obj) => {
//   imagemin = obj.default;
// });

// inspired by postcss-remove-selectors
function removeClasses(regex) {
  return {
    postcssPlugin: 'remove-classes',
    prepare() {
      return {
        AtRule(atrule) {
          const str = atrule.toString().split('{')[0];
          if (regex.test(str)) {
            atrule.remove();
          }
        },
        Rule(rule) {
          const str = rule.toString().split('{')[0];
          if (regex.test(str)) {
            rule.remove();
          }
        }
      };
    }
  };
}

const developerDocsIcons = [
  ...new Set(
    developerDocs
      .filter((doc) => doc.icon)
      .flatMap((doc) => doc.icon.split(' '))
  )
];

// The two halves that concatenate into css/app.css. They are intermediate:
// css() pulls them out of the stream before anything is written, so they
// never land in build/ (nothing serves them; only app.css is referenced).
// Paths are relative to the assets base the stream carries.
const CONCAT_CSS_ORDER = ['css/app-light.css', 'css/app-dark.css'];
const CONCAT_CSS_GLOBS = CONCAT_CSS_ORDER.map(
  (p) => `${config.assetsBase}/${p}`
);

// Shared by css() and cssDev(): the transforms every bundle needs.
function cssPostcssPlugins() {
  return [
    postcss100VHFix(),
    postcssViewportHeightCorrection(),
    postcssInlineBase64(),
    postcssPresetEnv()
  ];
}

const staticAssets = [
  'assets/**/*',
  '!assets/css/**/*',
  '!assets/img/**/*',
  '!assets/js/**/*'
];

// we have a modified version for emails
const purgeCssOptions = {
  // <https://github.com/FullHuman/purgecss/blob/55c26d2790b8502f115180cfe02aba5720c84b7b/docs/configuration.md>
  defaultExtractor: (content) => content.match(/[\w-/:]+(?<!:)/g) || [],
  extractors: [
    {
      extractor: purgeFromPug,
      extensions: ['pug']
    }
  ],
  sourceMap: false,
  // (since this does not detect variable-based class names in pug files)
  // the following list was filtered from:
  // `rg "class=" app`
  // `rg "class=" config`
  safelist: [
    ...new Set([
      ...developerDocsIcons,
      'active',
      'alert-danger',
      'alert-success',
      'alert-link',
      'alert-warning',
      'align-middle',
      'anchor',
      'badge-danger',
      'badge-primary',
      'badge-success',
      'badge-warning',
      'bg-danger',
      'bg-dark',
      'bg-secondary',
      'bg-success',
      'bg-warning',
      'bg-white',
      'border-dark',
      'border-md-top',
      'border-themed',
      'border-top',
      'btn',
      'btn-block',
      'btn-link',
      'btn-success',
      'close',
      'col',
      'col-12',
      'col-6',
      'col-lg-6',
      'col-md-3',
      'col-md-6',
      'col-md-8',
      'col-md-9',
      'col-sm-12',
      'collapse',
      'confirm-prompt',
      'container',
      'container-fluid',
      'd-block',
      'd-inline-block',
      'd-md-inline-block',
      'd-none',
      'd-print-block',
      'd-sm-block',
      'disabled',
      'dropdown-toggle',
      'fa',
      'fas',
      'fa-brain',
      'fa-cloud-download-alt',
      'fa-plug',
      'fa-angle-right',
      'fa-check',
      'fa-search',
      'fa-sort',
      'fa-sort-down',
      'fa-sort-up',
      'fa-times',
      'fa-bell',
      'fa-graduation-cap',
      'fa-history',
      'fa-envelope-open-text',
      'fa-flag-usa',
      'fade',
      // The fe design system: every fe-* rule is hand-written for a page that
      // exists, so there is nothing to purge, and several fe classes are built
      // from expressions (tone modifiers, state classes added by JS) that the
      // pug extractor cannot see. One pattern keeps them all.
      /^fe-/,
      'fixed-bottom',
      'flex-grow-1',
      'floating-label',
      'font-weight-bold',
      'h4',
      'lazyframe',
      'list-inline',
      'list-inline-item',
      'markdown-body',
      /markdown-alert/,
      'mb-0',
      'mb-3',
      'ml-0',
      'ml-4',
      'modal',
      'modal-body',
      'modal-content',
      'modal-dialog',
      'modal-header',
      'modal-lg',
      'mr-0',
      'mt-3',
      'mt-md-0',
      'navbar-dark',
      'navbar-light',
      'navbar-themed',
      'no-js',
      'octicon',
      'octicon-link',
      'offset-lg-3',
      'offset-md-2',
      'p-0',
      'pl-0',
      'p-2',
      'py-3',
      'px-3',
      'row',
      'table-danger',
      'table-primary',
      'table-warning',
      'table-success',
      'text-center',
      'text-danger',
      'text-dark',
      'text-decoration-underline',
      'text-left',
      'text-muted',
      'text-success',
      'text-themed',
      'text-warning',
      'text-white',
      'text-wrap',
      /-themed$/,
      /-themed-/,
      /^hljs/,
      /^language-/,
      /^progress-bar/,
      'collapse',
      'navbar-collapse',
      'list-inline',
      'navbar-nav',
      'ml-auto',
      'mt-2',
      'mt-md-0',
      'navbar-dark',
      'bg-dark',
      'navbar-themed',
      'bg-themed',
      'navbar-expand-lg',
      'fixed-top',
      'card-columns-2',
      /swal2/,
      'component-frame',
      // bootstrap-table icons for bs4
      'fa-minus',
      'fa-plus',
      'fa-sort',
      'pt-md-5',
      // reduced navbar for certain locales
      // (manually curated, see `app/views/_nav.pug`)
      'navbar-small',
      // eyebrow glyphs on the secondary page headers. _fe-page-header.pug
      // renders the icon from an option (`i(class=opts.icon)`), which the
      // pug extractor cannot see, so each icon a page passes is listed here
      'fa-filter',
      'fa-mail-bulk',
      'fa-user-lock',
      'fa-server',
      'fa-toolbox',
      'fa-code',
      'fa-book',
      // added by assets/js/download.js when a checksum is copied
      'is-copied',
      // side rail and table of contents (config/filters.js renders these
      // outside the purge content, and core.js / faq-search.js toggle them)
      /^sidebar/,
      /^fe-rail/,
      'fe-surface-light',
      'fe-label',
      // email-only classes (assets/css/_email.scss) are used in emails/**/*.pug
      // which the app purge does not scan, the email purge then trims them
      /^email-/,
      'nav',
      'nav-link',
      'nav-pills',
      'flex-column'
    ])
  ]
};

const PURGE_APP = {
  ...purgeCssOptions,
  // assets/js is read from source as well as from build/: css() runs in
  // parallel with bundle(), so build/js can still be missing or stale when
  // the purge reads it, which dropped classes only scripts add (the
  // show-password toggle's fa-eye-slash, for one) from some builds
  content: [
    'assets/js/**/*.js',
    'build/**/*.js',
    'app/views/**/*.md',
    'app/views/**/*.pug'
  ]
};

//
// add a logger pre-hook to always ignore_hook so post-hooks don't fire
// (but only for development and testing environments)
//
if (!PROD) {
  for (const level of logger.config.levels) {
    logger.pre(level, function (err, message, meta) {
      meta.ignore_hook = true;
      return [err, message, meta];
    });
  }
}

function pug() {
  let stream = src(['app/views/**/*.pug', 'emails/**/*.pug'], {
    since: lastRun(pug)
  })
    .pipe(prettier())
    .pipe(pugLinter({ reporter: 'default', failAfterError: true }));

  if (DEV) stream = stream.pipe(lr(config.livereload));

  return stream;
}

async function img() {
  // if (!imagemin)
  //   await pWaitFor(() => Boolean(imagemin), { timeout: ms('15s') });
  let stream = src('assets/img/**/*', {
    base: config.assetsBase,
    since: lastRun(img)
  })
    // .pipe(
    //   // <https://github.com/sindresorhus/gulp-imagemin/tree/main#custom-plugin-options>
    //   // progressive: true,
    //   // svgoPlugins: [{ removeViewBox: false }, { cleanupIDs: false }],
    //   imagemin()
    // )
    // .pipe(dest(config.assetsBase));
    .pipe(dest(config.buildBase));

  // if (DEV) stream = stream.pipe(lr(config.livereload));

  // convert to conventional stream
  stream = stream.pipe(through2.obj((chunk, enc, cb) => cb()));

  await getStream(stream);
}

function fonts() {
  return src('assets/fonts/**/*', {
    base: config.assetsBase,
    since: lastRun(fonts)
  }).pipe(dest(config.buildBase));
}

function faFonts() {
  return src(['node_modules/@fortawesome/fontawesome-free/webfonts/**/*']).pipe(
    dest(path.join(config.buildBase, 'fonts'))
  );
}

//
// Font Awesome ships every icon (about 1,600) in each font, 158 KB of woff2
// for the solid and brand fonts that every page downloads before first
// paint. The built stylesheets only keep the `.fa-*:before` rules that
// PurgeCSS found in use, and an icon without its rule cannot render, so the
// woff2 fonts are cut down to exactly the codepoints those rules reference.
// The .woff/.ttf/.eot files (only for browsers without woff2) stay complete.
//
// /fonts/ is not revisioned and is cached for a year (by browsers, and in
// production by koa-cash), so each subset gets its own content-hashed file
// name and the built stylesheets are pointed at it (before sri() revisions
// them). The original unhashed woff2 stays complete, for pages cached from an
// earlier build and for the development stylesheet, which is not purged.
//
const FA_WOFF2_FONTS = [
  'fa-solid-900.woff2',
  'fa-regular-400.woff2',
  'fa-brands-400.woff2'
];

// Font Awesome 5 icons are in the Private Use Area (U+E000 to U+F8FF)
const REGEX_CSS_CONTENT_CODEPOINT = /content:\s*["']\\([\da-f]{4,5})\s*["']/gi;

async function faSubset() {
  const cssDir = path.join(config.buildBase, 'css');
  const files = await globby('*.css', { cwd: cssDir });
  const codepoints = new Set();
  for (const file of files) {
    const css = await fs.promises.readFile(path.join(cssDir, file), 'utf8');
    for (const [, hex] of css.matchAll(REGEX_CSS_CONTENT_CODEPOINT)) {
      const codepoint = Number.parseInt(hex, 16);
      if (codepoint >= 0xe000 && codepoint <= 0xf8ff) codepoints.add(codepoint);
    }
  }

  // a sanity floor: far fewer means the rules were not found (e.g. the CSS
  // output format changed), and a subset would blank every icon
  if (codepoints.size < 50)
    throw new Error(
      `Font Awesome subset: only ${codepoints.size} icon codepoints found in ${cssDir}`
    );

  const text = String.fromCodePoint(...codepoints);
  const renames = await Promise.all(
    FA_WOFF2_FONTS.map(async (name) => {
      const fontsDir = path.join(config.buildBase, 'fonts');
      const font = await fs.promises.readFile(path.join(fontsDir, name));
      const subset = await subsetFont(font, text, { targetFormat: 'woff2' });
      const hash = crypto
        .createHash('sha256')
        .update(subset)
        .digest('hex')
        .slice(0, 10);
      const hashed = name.replace(/\.woff2$/, `-${hash}.woff2`);
      await fs.promises.writeFile(path.join(fontsDir, hashed), subset);
      logger.info(
        `${hashed}: ${codepoints.size} icons, ${font.length} -> ${subset.length} bytes`
      );
      return [`/fonts/${name}`, `/fonts/${hashed}`];
    })
  );

  for (const file of files) {
    const cssPath = path.join(cssDir, file);

    let css = await fs.promises.readFile(cssPath, 'utf8');
    let changed = false;
    for (const [from, to] of renames) {
      if (!css.includes(from)) continue;
      css = css.split(from).join(to);
      changed = true;
    }

    if (changed) await fs.promises.writeFile(cssPath, css);
  }

  // a build that still loads the complete fonts would not be caught otherwise
  const app = await fs.promises.readFile(path.join(cssDir, 'app.css'), 'utf8');

  // a rule that sets a font on the icon elements below some class outranks
  // `.fa`, so every icon inside draws as a missing-glyph box
  const overrides = findIconFontOverrides(app);
  if (overrides.length > 0)
    throw new Error(
      `Font Awesome icons would lose their font to: ${overrides.join(
        ', '
      )} (leave icons out of such rules, e.g. i:not(.fa):not(.fas):not(.far):not(.fab))`
    );

  for (const [from, to] of renames) {
    if (app.includes(from))
      throw new Error(`Font Awesome subset: app.css still loads ${from}`);
    // (the regular font is only referenced when an `far` icon is in use)
    if (from.includes('fa-solid-900') && !app.includes(to))
      throw new Error(`Font Awesome subset: app.css does not load ${to}`);
  }
}

//
// Development rebuild used by `watch`: everything css() does that changes how
// a page renders (lint, sass, the postcss transforms, the concatenation) and
// nothing that only shrinks the file (purge, cssnano, the email bundle). A
// change shows up in a few seconds instead of most of a minute, and `build`
// still runs the full css() below, so production output is unaffected.
//
function cssDev() {
  const halves = filter(CONCAT_CSS_GLOBS, { restore: true });
  return pump(
    [
      src('assets/css/**/*.scss', {
        base: config.assetsBase
      }),
      stylelint({
        reporters: [{ formatter: 'string', console: true }]
      }),
      sass().on('error', sass.logError),
      postcss([...cssPostcssPlugins(), reporter()]),
      halves,
      order(CONCAT_CSS_ORDER),
      concat('css/app.css'),
      halves.restore,
      dest(config.buildBase),
      ...(DEV ? [lr(config.livereload)] : [])
    ],
    (err) => {
      if (err) throw err;
    }
  );
}

function css() {
  // Holds app-light.css and app-dark.css back while the rest of the stream
  // (codemirror.css) goes on; restored after they have been
  // concatenated into app.css and given their second pass, so the two halves
  // are never written to disk and the other bundles are not processed twice.
  const halves = filter(CONCAT_CSS_GLOBS, { restore: true });
  // dest() above rewrites each file's path to its build location.
  const appOnly = filter(`${config.buildBase}/css/app.css`);
  return pump(
    [
      src('assets/css/**/*.scss', {
        base: config.assetsBase
      }),
      stylelint({
        reporters: [{ formatter: 'string', console: true }]
      }),
      // sourcemaps.init()
      sass().on('error', sass.logError),
      postcss([
        ...cssPostcssPlugins(),
        cssnano({ autoprefixer: false }),
        reporter()
      ]),
      purgecss(PURGE_APP),
      // sourcemaps.write('./')
      halves,
      order(CONCAT_CSS_ORDER),
      concat('css/app.css'),
      // Second pass over the concatenation so cssnano can merge across the
      // light/dark seam.
      postcss([
        ...cssPostcssPlugins(),
        cssnano({ autoprefixer: false }),
        reporter()
      ]),
      halves.restore,
      dest(config.buildBase),
      ...(DEV ? [lr(config.livereload)] : []),
      // purge css for email specifically
      appOnly,
      rename('css/app-email.css'),
      purgecss({
        ...purgeCssOptions,
        variables: true,
        content: [
          'emails/**/*.pug',
          'app/views/my-account/billing/_receipt.pug'
        ],
        fontFace: true,
        keyframes: true,
        // `rg "class=" app/models`
        // `rg "class=" config/index.js`
        safelist: [
          ...new Set([
            ...developerDocsIcons,
            'alert-link',
            'alert-danger',
            'alert-success',
            'alert-link',
            'alert-warning',
            'font-weight-bold',
            'text-decoration-underline',
            'text-monospace',
            'small',
            'code',
            'font-weight-bold',
            'markdown-body',
            'mb-0',
            'mb-3',
            'ml-0',
            'mr-0',
            'mt-3',
            'pre',
            'text-danger',
            'text-left',
            'col-lg-6',
            'col-lg-8',
            'col-lg-9',
            'col-md-9',
            'col-xl-6'
          ])
        ]
      }),
      //
      // NOTE: gmail only supports 16384 bytes in <style>
      // <https://www.caniemail.com/clients/gmail/>
      //
      // Limit on styles (16 KB):
      // <https://github.com/hteumeuleu/email-bugs/issues/90>
      //
      postcss([
        // gmail doesn't support dark mdoe
        // gmail does not support css variables
        // <https://www.caniemail.com/features/css-variables/>
        cssVariables(),
        pruneVar(),
        // gmail does not support inline base64 images
        // <https://www.caniemail.com/features/image-base64/>
        // postcssInlineBase64(),
        // TODO: once a majority of clients support this then add back
        // <https://www.caniemail.com/features/css-at-font-face/>
        discardFonts(() => false),
        // fixes for gmail
        postcssStripFontFace(),
        // fixes for gmail
        comments({ removeAll: true }),
        nested(),
        // gmail does not support attribute nor pseudo selectors
        // <https://stackoverflow.com/a/25104594>
        cssnano({
          autoprefixer: false,
          discardComments: { removeAll: true }
        }),
        removeClasses(/::?/),
        removeClasses(/\[/),
        removeClasses(/@font-face/),
        removeClasses(/@media print/),
        removeClasses(/@import/),
        removeClasses(/@keyframes/),
        removeClasses(/-webkit-device-pixel-ratio/),
        removeClasses(/prefers-color-scheme/),
        removeClasses(/prefers-reduced-motion/),
        discardUnused(),
        cssnano({
          autoprefixer: false,
          discardComments: { removeAll: true }
        }),
        reporter()
      ]),
      dest(config.buildBase)
    ],
    (err) => {
      if (err) throw err;
    }
  );
}

function xo() {
  return src('.', { since: lastRun(xo) })
    .pipe(gulpXo({ quiet: true, fix: true }))
    .pipe(gulpXo.format())
    .pipe(gulpXo.failAfterError());
}

// TODO: in the future use merge-streams and return a stream w/o through2
async function bundle() {
  const since = lastRun(bundle);

  await makeDir(path.join(config.buildBase, 'js'));
  await makeDir(path.join(config.buildBase, 'css'));

  async function getFactorBundle() {
    const paths = await globby('**/*.js', { cwd: 'assets/js' });
    const factorBundle = await new Promise((resolve, reject) => {
      browserify({
        entries: paths.map((string) => `assets/js/${string}`),
        debug: true
      })
        .plugin('bundle-collapser/plugin')
        .plugin('factor-bundle', {
          outputs: paths.map((string) =>
            path.join(config.buildBase, 'js', string)
          )
        })
        .bundle((err, data) => {
          if (err) return reject(err);
          resolve(data);
        });
    });
    await fs.promises.writeFile(
      path.join(config.buildBase, 'js', 'factor-bundle.js'),
      factorBundle
    );
  }

  await Promise.all([
    // babel polyfill
    fs.promises.copyFile(
      path.join(
        __dirname,
        'node_modules',
        '@babel',
        'polyfill',
        'dist',
        'polyfill.js'
      ),
      path.join(config.buildBase, 'js', 'polyfill.js')
    ),

    // ApexCharts, a standalone file (window.ApexCharts) loaded only where a
    // chart is drawn: required from the page scripts it would be factored
    // into build.js, about half of it, on every page
    fs.promises.copyFile(
      path.join(
        __dirname,
        'node_modules',
        'apexcharts',
        'dist',
        'apexcharts.min.js'
      ),
      path.join(config.buildBase, 'js', 'apexcharts.js')
    ),

    // scalar API reference
    fs.promises.copyFile(
      path.join(
        __dirname,
        'node_modules',
        '@scalar',
        'api-reference',
        'dist',
        'browser',
        'standalone.js'
      ),
      path.join(config.buildBase, 'js', 'scalar.js')
    ),

    // ekko-lightbox
    fs.promises.copyFile(
      path.join(
        __dirname,
        'node_modules',
        'ekko-lightbox',
        'dist',
        'ekko-lightbox.min.js'
      ),
      path.join(config.buildBase, 'js', 'ekko-lightbox.js')
    ),
    // bootstrap-table
    fs.promises.copyFile(
      path.join(
        __dirname,
        'node_modules',
        'bootstrap-table',
        'dist',
        'bootstrap-table.min.js'
      ),
      path.join(config.buildBase, 'js', 'bootstrap-table.js')
    ),
    fs.promises.copyFile(
      path.join(
        __dirname,
        'node_modules',
        'bootstrap-table',
        'dist',
        'bootstrap-table.css'
      ),
      path.join(config.buildBase, 'css', 'bootstrap-table.css')
    ),
    fs.promises.copyFile(
      path.join(
        __dirname,
        'node_modules',
        'bootstrap-table',
        'dist',
        'extensions',
        'sticky-header',
        'bootstrap-table-sticky-header.js'
      ),
      path.join(config.buildBase, 'js', 'bootstrap-table-sticky-header.js')
    ),
    fs.promises.copyFile(
      path.join(
        __dirname,
        'node_modules',
        'bootstrap-table',
        'dist',
        'extensions',
        'sticky-header',
        'bootstrap-table-sticky-header.css'
      ),
      path.join(config.buildBase, 'css', 'bootstrap-table-sticky-header.css')
    ),
    // factor bundle
    getFactorBundle()
  ]);

  // concatenate files
  // (polyfill.js is its own nomodule script, see layout.pug)
  await getStream(
    src([
      'build/js/factor-bundle.js',
      'build/js/uncaught.js',
      'build/js/core.js'
    ])
      .pipe(sourcemaps.init({ loadMaps: true }))
      .pipe(concat('build.js'))
      // the maps are only served in development (helpers/block-source-maps.js)
      .pipe(sourcemaps.write('./', { addComment: DEV }))
      .pipe(dest(path.join(config.buildBase, 'js')))
      .pipe(through2.obj((chunk, enc, cb) => cb()))
  );

  let stream = src('build/js/**/*.js', { base: config.buildBase, since })
    .pipe(sourcemaps.init({ loadMaps: true }))
    .pipe(unassert())
    .pipe(envify(env))
    .pipe(babel());

  if (PROD) stream = stream.pipe(terser());

  stream = stream
    .pipe(sourcemaps.write('./', { addComment: DEV }))
    .pipe(dest(config.buildBase));

  if (DEV) stream = stream.pipe(lr(config.livereload));

  stream = stream.pipe(dest(config.buildBase));

  // convert to conventional stream
  stream = stream.pipe(through2.obj((chunk, enc, cb) => cb()));

  await getStream(stream);
}

function remark() {
  return src('.', { since: lastRun(remark) })
    .pipe(
      gulpRemark({
        quiet: true,
        frail: true
      })
    )
    .pipe(dest('.'));
}

function static() {
  return src(staticAssets, {
    base: config.assetsBase,
    allowEmpty: true,
    since: lastRun(static),
    dot: true
  }).pipe(dest(config.buildBase));
}

/*
async function markdown() {
  const mandarin = new Mandarin({
    i18n,
    logger,
    ...(isCI ? { redis: false } : {})
  });
  const graceful = new Graceful({
    ...(isCI ? {} : { redisClients: [mandarin.redisClient] }),
    logger
  });
  graceful.listen();
  await mandarin.markdown();
  await graceful.stopRedisClients();
}
*/

async function sri() {
  await getStream(
    src('build/**/*.{css,js}', { base: config.buildBase })
      .pipe(RevAll.revision())
      .pipe(dest(config.buildBase))
      .pipe(RevAll.manifestFile())
      .pipe(dest(config.buildBase))
      .pipe(revSri({ base: config.buildBase }))
      .pipe(dest(config.buildBase))
      // convert to conventional stream
      .pipe(through2.obj((chunk, enc, cb) => cb()))
  );

  //
  // get all non css and non js files since rev-all ignores others
  // and merge rev-manifest.json with fonts and other non rev-all assets
  //
  // <https://github.com/smysnk/gulp-rev-all/blob/7fc61344df3b4377bf54b70d938cda8771096ebb/revisioner.js#L24
  // <https://github.com/smysnk/gulp-rev-all/issues/106>
  // <https://github.com/smysnk/gulp-rev-all/issues/165#issuecomment-338064409>
  //
  // note that we don't pipe fonts through gulp rev due to binary issues
  //
  await getStream(
    src(
      [
        'build/**/*',
        '!build/rev-manifest.json',
        '!build/sri-manifest.json',
        '!build/**/*.{css,js}',
        '!build/fonts/**/*',
        '!build/robots.txt',
        '!build/llms.txt',
        '!build/browserconfig.xml',
        '!build/opensearch.xml',
        '!build/technical-whitepaper.pdf',
        '!build/pentest-report_forward-email.pdf',
        '!build/api-spec.json'
      ],
      { base: config.buildBase }
    )
      .pipe(rev())
      .pipe(dest(config.buildBase))
      .pipe(
        rev.manifest(config.manifest, {
          merge: true,
          base: config.buildBase
        })
      )
      .pipe(dest(config.buildBase))
      .pipe(revSri({ base: config.buildBase }))
      .pipe(dest(config.buildBase))
      // convert to conventional stream
      .pipe(through2.obj((chunk, enc, cb) => cb()))
  );
}

function clean() {
  return del([config.buildBase]);
}

const build = series(
  clean,
  parallel(
    ...(TEST ? [] : [xo, remark]),
    // series(parallel(img, static, markdown, bundle, fonts, faFonts, css), sri)
    series(parallel(img, static, bundle, fonts, faFonts, css), faSubset, sri)
  )
);

module.exports = {
  clean,
  build,
  bundle,
  sri,
  // markdown,
  watch() {
    lr.listen(config.livereload);
    watch(['**/*.js', '!gulpfile.js', '!assets/js/**/*.js'], xo);
    // watch(Mandarin.DEFAULT_PATTERNS, markdown);
    watch('assets/img/**/*', img);
    watch('assets/fonts/**/*', fonts);
    watch('assets/css/**/*.scss', cssDev);
    watch('assets/js/**/*.js', series(xo, bundle));
    watch(['app/views/**/*.pug', 'emails/**/*.pug'], pug);
    // The startup build purges app.css against the views, so a class a view
    // starts using (a new icon, say) has no rule until the next build. Rebuild
    // the unpurged development bundle when a view changes, as for a .scss one.
    watch('app/views/**/*.pug', cssDev);
    watch(staticAssets, static);
  },
  pug,
  img,
  xo,
  static,
  remark,
  fonts,
  faFonts,
  css,
  cssDev
};

exports.default = build;