/* eslint-disable @typescript-eslint/no-require-imports */
const path = require('path');
const webpack = require('webpack');
const HtmlWebpackPlugin = require('html-webpack-plugin');
// const ESLintPlugin = require('eslint-webpack-plugin');
// const ForkTsCheckerWebpackPlugin = require('fork-ts-checker-webpack-plugin');
const { parsed } = require('dotenv').config();

const plugins = [
    new HtmlWebpackPlugin({
        title: 'Caching',
    }),
    // new ESLintPlugin({
    //     extensions: ['ts'],
    // }),
    // new ForkTsCheckerWebpackPlugin({
    //     typescript: {
    //         // useTypescriptIncrementalApi: true,
    //         // eslint: true,
    //         memoryLimit: 8192,
    //     },
    //     // tslint: true,
    //     // memoryLimit: 4096,
    //     // useTypescriptIncrementalApi: true,
    //     // tslintAutoFix: true,
    // }),
    new webpack.ProvidePlugin({ Buffer: ['buffer', 'Buffer'] }),
    new webpack.ProvidePlugin({ process: 'process/browser' }),
    new webpack.HotModuleReplacementPlugin(),
];

function transferEnvironmentVariables() {
    const prefix = '_CLIENT_';
    if (!parsed) {
        return;
    }
    const resolvedClientSide = Object.keys(parsed).reduce((mapping, envKey) => {
        if (envKey.startsWith(prefix)) {
            mapping[`process.env.${envKey.replace(prefix, '')}`] = JSON.stringify(parsed[envKey]);
        }
        return mapping;
    }, {});
    plugins.push(new webpack.DefinePlugin(resolvedClientSide));
}

transferEnvironmentVariables();

module.exports = {
    mode: 'development',
    entry: {
        bundle: ['./src/client/views/Main.tsx', 'webpack-hot-middleware/client?reload=true'],
        viewer: ['./src/debug/Viewer.tsx', 'webpack-hot-middleware/client?reload=true'],
        repl: ['./src/debug/Repl.tsx', 'webpack-hot-middleware/client?reload=true'],
        test: ['./src/debug/Test.tsx', 'webpack-hot-middleware/client?reload=true'],
    },
    devtool: 'source-map',
    output: {
        filename: '[name].js',
        path: path.resolve(__dirname, 'build'),
        publicPath: '/',
    },
    resolve: {
        extensions: ['.js', '.jsx', '.ts', '.tsx'],
        fallback: {
            fs: false,
            tls: false,
            net: false,
            zlib: false,
            dns: false,
            crypto: false,
            assert: false,
            os: false,
            querystring: require.resolve('querystring-es3'),
            url: require.resolve('url'),
            path: require.resolve('path-browserify'),
            http: require.resolve('http-browserify'),
            https: require.resolve('https-browserify'),
            stream: require.resolve('stream-browserify'),
            buffer: require.resolve('buffer'),
        },
    },
    module: {
        rules: [
            {
                test: [/\.tsx?$/],
                use: [
                    {
                        loader: 'ts-loader',
                        options: {
                            transpileOnly: true,
                        },
                    },
                ],
            },
            {
                test: /\.jsx$/,
                use: { loader: 'babel-loader' },
                exclude: [/node_modules/, /public/],
            },
            {
                test: /\.m?js/,
                resolve: {
                    fullySpecified: false,
                },
            },
            {
                test: /\.(woff|woff2|ttf|eot|otf|svg)$/,
                use: 'file-loader?name=fonts/[name].[ext]!static',
            },
            {
                test: /\.scss|css$/,
                exclude: /\.module\.scss$/i,
                use: [
                    { loader: 'style-loader' }, //
                    { loader: 'css-loader' },
                    { loader: 'sass-loader' },
                ],
            },
            {
                test: /\.(txt|d)$/i,
                type: 'asset/source',
            },

            // --------
            // SCSS MODULES - all have .module. in their name and can export to .tsx
            {
                test: /\.module\.scss$/i,
                use: [
                    { loader: 'style-loader' }, //
                    { loader: 'css-loader', options: { modules: true } },
                    { loader: 'sass-loader' },
                ],
            },
            {
                test: /\.(jpg|png|pdf)$/,
                use: [
                    {
                        loader: 'file-loader',
                    },
                ],
            },
            {
                test: /\.(png|jpg|gif)$/i,
                use: [
                    {
                        loader: 'url-loader',
                        options: {
                            limit: 8192,
                        },
                    },
                ],
            },
        ],

        noParse: [require.resolve('typescript/lib/typescript.js')],
    },
    plugins,
    externals: ['child_process'],
};