// webpack.config.js
// Copyright (C) 2022 Rob Colbert @rob@nicecrew.digital
// All Rights Reserved

'use strict';

import path, { dirname } from 'path';
import { fileURLToPath } from 'url';
const __dirname = dirname(fileURLToPath(import.meta.url)); // jshint ignore:line

import MiniCssExtractPlugin from 'mini-css-extract-plugin';
import BrowserSyncPlugin from 'browser-sync-webpack-plugin';

const webpackMode = (process.env.NODE_ENV === 'production') ? 'production' : 'development';

const plugins = [
  new MiniCssExtractPlugin(),
];

if (webpackMode === 'development') {
  plugins.push(
    new BrowserSyncPlugin({
      proxy: {
        target: 'http://dev.tracker.digitaltelepresence.com:3000',
        ws: true,
      },
      host: 'dev.tracker.digitaltelepresence.com',
      open: 'local',
      port: 3333,
      cors: true,
      ui: {
        port: 3400,
      },
      notify: false,
      ghostMode: {
        clicks: false,
        forms: false,
        scroll: true,
      },
      logLevel: 'info',
      files: [
        './dist/*.js',
        './dist/*.css',
        './app/views/**/*',
      ],
    }),
  );
}

export default {
  entry: {
    'app': './client/js/index.js',
    'tracker-light': './client/css/dtp-light.less',
    'tracker-dark': './client/css/dtp-dark.less',
  },
  devtool: 'source-map',
  mode: webpackMode,
  resolve: {
    alias: {
      lib: path.resolve(__dirname, 'lib', 'client', 'js'),
    },
    extensions: ['.js'],
  },
  output: {
    filename: '[name].bundle.js',
    path: path.resolve(__dirname, 'dist'),
    clean: true,
    // publicPath: '/dist',
  },
  performance: {
    hints: 'warning',
    maxEntrypointSize: 2 * 102412 * 1024,
    maxAssetSize: 2 * 102412 * 1024,
  },
  plugins,
  module: {
    rules: [
      {
        test: /\.less$/i,
        use: [
          {
            loader: "style-loader",
          },
          {
            loader: MiniCssExtractPlugin.loader,
            options: {
              esModule: false,
            },
          },
          {
            loader: "css-loader",
            options: {
              sourceMap: true,
            },
          },
          {
            loader: "less-loader",
            options: {
              sourceMap: true,
              lessOptions: {
                strictMath: false,
                paths: [path.resolve(__dirname, "node_modules")],
              },
            },
          },
        ],
      },
    ],
  },
};