/**
 * @license
 * Copyright 2023 Google LLC
 * SPDX-License-Identifier: Apache-2.0
 */

const litPlugin = require('@lit-labs/eleventy-plugin-lit');
const inlineCss = require('./eleventy-helpers/shortcodes/inline-css.cjs');
const inlineJS = require('./eleventy-helpers/shortcodes/inline-js.cjs');
const playgroundExample = require('./eleventy-helpers/shortcodes/playground-example.cjs');
const minifyHTML = require('./eleventy-helpers/transforms/minify-html.cjs');
const syntaxHighlight = require('@11ty/eleventy-plugin-syntaxhighlight');
const pluginTOC = require('eleventy-plugin-nesting-toc');
const permalinks = require('./eleventy-helpers/plugins/permalinks.cjs');
const filterToc = require('./eleventy-helpers/filters/filter-toc.cjs');
const filterSort = require('./eleventy-helpers/filters/filter-sort.cjs');
const mdMarkdown = require('./eleventy-helpers/filters/md-markdown.cjs');
const copyCodeButtonPlugin = require('./eleventy-helpers/plugins/copy-code-button.cjs');
const markdownIt = require('markdown-it');
const { compress } = require('eleventy-plugin-compress');

// dev mode build
const DEV = process.env.NODE_ENV === 'DEV';
// where the JS files are outputted
const jsDir = DEV ? 'lib' : 'build';
// where to output 11ty output
const outputFolder = DEV ? '_dev' : '_prod';

module.exports = function (eleventyConfig) {
  // copy folders to the 11ty output folder
  eleventyConfig
    .addPassthroughCopy({ [`${jsDir}/`]: 'js/' })
    .addPassthroughCopy('site/css')
    .addPassthroughCopy('site/fonts')
    .addPassthroughCopy('site/images')
    // Most of the stories files are generated by the wireit script that copies
    // the stories files in the source to this directory
    .addPassthroughCopy({ 'stories/': 'assets/stories/' })
    // These images are generated by the docs copy step in wireit
    .addPassthroughCopy('site/components/images')
    .addPassthroughCopy('site/theming/images')
    .addPassthroughCopy('site/about/images');

  // add the lit-ssr plugin
  eleventyConfig.addPlugin(litPlugin, {
    mode: 'worker',
    componentModules: [`./${jsDir}/ssr.js`],
  });

  // Add this for 11ty's --watch flag
  eleventyConfig.addWatchTarget(`./${jsDir}/**/*.js`);

  // install shortcodes
  inlineCss(eleventyConfig, DEV);
  inlineJS(eleventyConfig, DEV, { jsDir });
  playgroundExample(eleventyConfig);

  // install filters
  filterSort(eleventyConfig);
  filterToc(eleventyConfig);
  // list of our transforms that we want to apply to markdown links.
  mdMarkdown(eleventyConfig, [
    ['../theming/README.md', '/theming/material-theming/'],
    ['./list', '/components/list'],
    [/theming\/README/, '/theming/'],
    [/^typography\.md/, '/theming/typography/'],
    [/^color\.md/, '/theming/color/'],
    [/^color\.md/, '/theming/color/'],
    [/^components\//, '/components/button/'],
  ]);

  // install transforms
  minifyHTML(eleventyConfig, DEV);

  // install code syntax highlighting
  eleventyConfig.addPlugin(syntaxHighlight);

  const md = markdownIt({
    html: true,
    breaks: false, // 2 newlines for paragraph break instead of 1
    linkify: true,
  });

  // permalink markdown plugin
  permalinks(md);

  // copy code button plugin
  copyCodeButtonPlugin(md);

  eleventyConfig.setLibrary('md', md);

  // Add a TOC plugin (implementation is wip for now)
  eleventyConfig.addPlugin(pluginTOC, {
    tags: ['h2', 'h3', 'h4'],
    wrapper: 'div',
  });

  eleventyConfig.addPlugin(compress, {
    enabled: !DEV,
  });

  // set output folders and use nunjucks for html templating engine. see
  // nunjucks docs and 11ty docs for more info on nunjucks templating
  return {
    htmlTemplateEngine: 'njk',
    markdownTemplateEngine: 'njk',
    dir: {
      input: 'site',
      output: outputFolder,
    },
  };
};