gulpfile.js

'use strict'

const { parallel, series, watch } = require('gulp')
const createTask = require('./gulp.d/lib/create-task')
const exportTasks = require('./gulp.d/lib/export-tasks')
const log = require('fancy-log')
const { exec, execSync } = require('child_process')
const path = require('path')

const bundleName = 'ui'
const buildDir = 'build'
const previewSrcDir = 'preview-src'
const previewDestDir = 'public'
const srcDir = 'src'
const destDir = `${previewDestDir}/_`

const { reload: livereload } = process.env.LIVERELOAD === 'true' ? require('gulp-connect') : {}
const serverConfig = { host: '0.0.0.0', port: 5252, livereload }

const task = require('./gulp.d/tasks')
const generateBloblangGrammar = require('./gulp.d/tasks/generate-bloblang-grammar')
const generatePrism = require('./gulp.d/tasks/generate-prism')
const glob = {
  all: [srcDir, previewSrcDir],
  css: `${srcDir}/css/**/*.css`,
  js: ['gulpfile.js', 'gulp.d/**/*.js', `${srcDir}/{helpers,js}/**/*.js`],
}

/**
 * Compiles Handlebars partial templates by executing a Node.js script for each specified partial.
 *
 * @param {Function} cb - Callback to signal task completion or failure.
 *
 * @throws {Error} If any partial compilation fails, the callback is invoked with an error.
 */
function compileWidgets (cb) {
  const partialsToCompile = [
    // The header widget wraps the same header-content partial as docs pages, so
    // the docs-account markup (sign in / user menu) ships with it — but it
    // renders hidden and only comes alive via its JS. Bundle the account
    // control, the dropdown handler it delegates to, and the signed-in
    // pageview beacon so Bump API pages get the same login + lead capture as
    // the rest of the docs (the styles are already in header-bump.css).
    { name: 'header', context: 'context/header.json', scripts: ['25-topbar-dropdown.js', '26-docs-account.js', '27-docs-activity.js'] },
    { name: 'footer', context: 'context/footer.json', scripts: ['05-mobile-navbar.js'] },
    { name: 'head-bump', context: 'context/head.json' },
    { name: 'chat-panel-bump', context: 'context/chat-panel.json' },
  ]

  try {
    for (const { name, context, scripts } of partialsToCompile) {
      const jsArg = scripts ? ` --jsScripts='${JSON.stringify(scripts)}'` : ''
      const ctxArg = context ? `${context}` : ''
      const cmd = `node compile-partial.js ${name} ${ctxArg}${jsArg}`.trim()
      execSync(cmd, { stdio: 'inherit' })
    }
    cb()
  } catch (err) {
    cb(new Error(`Failed to compile Handlebars partials: ${err.message}`))
  }
}

const cleanTask = createTask({
  name: 'clean',
  desc: 'Clean files and folders generated by build',
  call: task.remove(['build', 'public']),
})

const bundleReactTask = createTask({
  name: 'bundle:react',
  desc: 'Compile every React module under src/js/react',
  call: task.bundleReact({
    srcDir: path.join(__dirname, srcDir, 'js', 'react'),
    destDir: path.join(__dirname, srcDir, 'static', 'js'),
  }),
})

const lintCssTask = createTask({
  name: 'lint:css',
  desc: 'Lint the CSS source files using stylelint (standard config)',
  call: task.lintCss(glob.css),
})

const lintJsTask = createTask({
  name: 'lint:js',
  desc: 'Lint the JavaScript source files using eslint (JavaScript Standard Style)',
  call: task.lintJs(glob.js),
})

const lintTask = createTask({
  name: 'lint',
  desc: 'Lint the CSS and JavaScript source files',
  call: parallel(lintCssTask, lintJsTask),
})

const formatTask = createTask({
  name: 'format',
  desc: 'Format the JavaScript source files using prettify (JavaScript Standard Style)',
  call: task.format(glob.js),
})

const buildTask = createTask({
  name: 'build',
  desc: 'Build and stage the UI assets for bundling',
  call: task.build(
    srcDir,
    destDir,
    process.argv.slice(2).some((name) => name.startsWith('preview'))
  ),
})

const generateBloblangGrammarTask = createTask({
  name: 'generate:bloblang-grammar',
  desc: 'Generate Prism Bloblang grammar from Connect JSON',
  call: generateBloblangGrammar(path.join(__dirname, srcDir, 'js', 'vendor', 'prism', 'prism-bloblang.js')),
})

const generatePrismTask = createTask({
  name: 'generate:prism',
  desc: 'Assemble the trimmed Prism build (core + grammars in gulp.d/prism-languages.js + keep-markup) from prismjs',
  call: generatePrism(path.join(__dirname, srcDir, 'js', 'vendor', 'prism', 'prism-core.js')),
})

const buildWasmTask = createTask({
  name: 'build:wasm',
  desc: 'Build the WebAssembly (.wasm) file using Go and the go.mod in blobl-editor/wasm',
  call: (done) => {
    const wasmDir = path.join(__dirname, 'blobl-editor', 'wasm')
    // Absolute path for the output file (go build -o requires a file path).
    const wasmOutputPath = path.join(__dirname, srcDir, 'static', 'blobl.wasm')

    const envVars = {
      ...process.env,
      GOOS: 'js',
      GOARCH: 'wasm',
    }

    const command = `go build -o "${wasmOutputPath}" .`

    exec(command, { cwd: wasmDir, env: envVars }, (err, stdout, stderr) => {
      if (err) {
        log.error('Error building WASM:', stderr)
        done(err)
        return
      }
      log.info('WebAssembly built successfully:', stdout)
      done()
    })
  },
})

const bundleBuildTask = createTask({
  name: 'bundle:build',
  call: series(
    cleanTask,
    lintTask,
    generateBloblangGrammarTask,
    generatePrismTask,
    buildWasmTask,
    bundleReactTask,
    compileWidgets,
    buildTask
  ),
})

const bundlePackTask = createTask({
  name: 'bundle:pack',
  desc: 'Create a bundle of the staged UI assets for publishing',
  call: task.pack(
    destDir,
    buildDir,
    bundleName,
    (bundlePath) => !process.env.CI && log(`Antora option: --ui-bundle-url=${bundlePath}`)
  ),
})

const bundleTask = createTask({
  name: 'bundle',
  desc: 'Clean, lint, build, and bundle the UI for publishing',
  call: series(bundleBuildTask, bundlePackTask),
})

const packTask = createTask({
  name: 'pack',
  desc: '(deprecated; use bundle instead)',
  call: series(bundleTask),
})

const buildPreviewPagesTask = createTask({
  name: 'preview:build-pages',
  call: task.buildPreviewPages(srcDir, previewSrcDir, previewDestDir, livereload),
})

const compileWidgetsTask = createTask({
  name: 'compile:widgets',
  desc: 'Compile standalone widget partials (header, footer, chat-panel, etc.)',
  call: compileWidgets,
})

const previewBuildTask = createTask({
  name: 'preview:build',
  desc: 'Process and stage the UI assets and generate pages for the preview',
  call: series(generatePrismTask, buildWasmTask, bundleReactTask, compileWidgetsTask, buildTask, buildPreviewPagesTask),
})

const previewServeTask = createTask({
  name: 'preview:serve',
  call: task.serve(previewDestDir, serverConfig, () => {
    // Main UI watch - excludes static files (widgets are handled separately)
    watch([`${srcDir}/**/*`, `${previewSrcDir}/**/*`, `!${srcDir}/static/**`], previewBuildTask)

    // Widget-specific watch - recompile widgets when bump-related files change
    // This includes partials, CSS, and context files used by widgets
    // Note: Watch source CSS (src/css/*-bump.css), NOT output (src/static/assets/widgets/css/*-bump.css)
    // to avoid recursive rebuilds when compile-partial.js copies CSS to output dir
    const widgetSources = [
      `${srcDir}/partials/*-bump.hbs`,
      `${srcDir}/partials/header-content.hbs`,
      `${srcDir}/partials/footer*.hbs`,
      `${srcDir}/partials/head-*.hbs`,
      `${srcDir}/css/*-bump.css`,
      'context/*.json',
    ]
    watch(widgetSources, series(compileWidgetsTask, buildTask))
  }),
})

const previewTask = createTask({
  name: 'preview',
  desc: 'Generate a preview site and launch a server to view it',
  call: series(previewBuildTask, previewServeTask),
})

const testTask = createTask({
  name: 'test',
  desc: 'Run Bloblang playground tests (build WASM + run tests)',
  call: (done) => {
    const { spawn } = require('child_process')
    const testProcess = spawn('node', ['tests/bloblang-playground/test-runner.js'], { stdio: 'inherit' })
    testProcess.on('close', (code) => {
      if (code === 0) {
        log.info('✅ All tests passed!')
        done()
      } else {
        done(new Error(`Tests failed with exit code ${code}`))
      }
    })
  },
})

// generate:prism first: the interactive test page loads
// src/js/vendor/prism/prism-core.js from disk, and that file is generated,
// not tracked (see generatePrismTask).
const testBuildTask = createTask({
  name: 'test:build',
  desc: 'Generate Prism, build WASM and run playground tests',
  call: series(generatePrismTask, buildWasmTask, testTask),
})

const testQuickTask = createTask({
  name: 'test:quick',
  desc: 'Run playground tests with existing WASM (development)',
  call: series(generatePrismTask, testTask),
})

module.exports = exportTasks(
  bundleTask,
  cleanTask,
  lintTask,
  formatTask,
  generateBloblangGrammarTask,
  generatePrismTask,
  buildWasmTask,
  bundleReactTask,
  compileWidgetsTask,
  buildTask,
  bundlePackTask,
  previewTask,
  previewBuildTask,
  packTask,
  testTask,
  testBuildTask,
  testQuickTask
)