const path = require('path');
const webpack = require('webpack');
const CopyWebpackPlugin = require('copy-webpack-plugin');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const { BundleAnalyzerPlugin } = require('webpack-bundle-analyzer');
const CleanWebpackPlugin = require('clean-webpack-plugin');

const mergeWebpack = require('webpack-merge');
const mergeObject = require('deepmerge');

/**
 * App parameters for first generation of React apps.
 * @typedef {object} AppParametersReactV1
 *
 * @param {string} publicPath The path where the frontend will be exposed
 * @param {boolean} prod Whether we are building the production bundle
 * @param {boolean} analyze Whether to run the bundle analyzer
 * @param {object} globals An object containing global variable definitions. Used by webpack's DefinePlugin
 */
const defaultAppParameters = {
  publicPath: '',
  prod: false,
  analyze: false,
};

const generateReactV1WebpackConfig = ({ publicPath, prod, analyze, globals }) => ({
  entry: ['./src/client', prod ? null : 'webpack-hot-middleware/client?reload=true'].filter(entry => entry),
  devtool: 'source-map',
  output: {
    path: path.resolve('dist'),
    filename: prod ? '[name].bundle.[contenthash].js' : '[name].bundle.js',
    chunkFilename: prod ? '[name].bundle.[contenthash].js' : '[name].bundle.js',
    publicPath: `/${publicPath}/assets/`,
  },
  mode: prod ? 'production' : 'development',
  resolve: {
    alias: {
      'react-redux': path.resolve('./node_modules/react-redux'),
      'redux-saga': path.resolve('./node_modules/redux-saga'),
      'react-dom': path.resolve('./node_modules/react-dom'),
      react: path.resolve('./node_modules/react'),
    },
    modules: ['node_modules'],
  },
  optimization: {
    minimize: prod,
  },
  plugins: [
    prod ? null : new webpack.HotModuleReplacementPlugin(),
    analyze
      ? new BundleAnalyzerPlugin({
          generateStatsFile: true,
        })
      : null,
    new CopyWebpackPlugin([
      {
        from: `node_modules/@doodle/components/assets`,
        to: `assets`,
      },
      {
        from: `node_modules/@doodle/components/views/assets`,
      },
    ]),
    new webpack.NamedModulesPlugin(),
    new webpack.DefinePlugin(globals),
    new CleanWebpackPlugin(),
    new HtmlWebpackPlugin({
      templateContent: '',
      filename: 'resources.ejs',
    }),
  ].filter(plugin => plugin !== null),
  module: {
    rules: [
      {
        test: /\.js$/,
        loader: 'babel-loader',
        include: path.resolve('src'),
      },
      {
        test: /\.css$/,
        include: path.resolve('src'),
        use: [
          {
            loader: 'style-loader',
          },
          {
            loader: 'css-loader',
            options: {
              importLoaders: 1, // 1 loader before css-loader: style-loader
              modules: false,
            },
          },
          {
            loader: 'postcss-loader',
            options: {
              config: {
                path: process.cwd(),
              },
            },
          },
        ],
      },
      {
        test: /\.svg/,
        loader: 'svg-react-loader',
      },
    ],
  },
});

/**
 * Default configuration for first version of react frontends (e.g. web-settings, web-auth, web-billing).
 * It should eventually be deprecated in favour of the latest configuration.
 * @todo WORK IN PROGRESS – This file cannot be used alone because it still relies on the gulp pipeline.
 */
module.exports = {
  /**
   * @param {object} customWebpackOptions Custom webpack options to merge to the default configuration
   * @param {AppParametersReactV1} appParameters The custom app parameters
   * @param {=Function} mergeFn Allows providing a custom merge function, e.g. mergeWebpack.smart
   */
  generateWebpackConfig: ({ customWebpackOptions, appParameters, mergeFn = mergeWebpack }) => {
    const mergedAppParameters = mergeObject(defaultAppParameters, appParameters);

    return mergeFn(
      generateReactV1WebpackConfig({
        ...mergedAppParameters,
      }),
      customWebpackOptions
    );
  },
};