const {
  override,
  addBabelPlugin,
  addBundleVisualizer,
} = require("customize-cra");

const findSassModuleRule = (config) => {
  let sassModuleRuleIndex;
  const loaders = config.module.rules.find((ruleItem) => {
    if (!ruleItem.oneOf || !ruleItem.oneOf.length) {
      return false;
    }
    sassModuleRuleIndex = ruleItem.oneOf.findIndex(
      (loaderItem) =>
        loaderItem.test &&
        loaderItem.test.toString() === "/\\.module\\.(scss|sass)$/"
    );
    return sassModuleRuleIndex !== -1;
  });

  const sassModuleRule = loaders.oneOf[sassModuleRuleIndex];
  return sassModuleRule;
};

const setCssModuleLocalIdentName = (localIdentName) => (config) => {
  const sassModuleRule = findSassModuleRule(config);
  const cssLoaderOption = (sassModuleRule.use || sassModuleRule.loader).find(
    (loaderItem) =>
      loaderItem.loader && loaderItem.loader.includes("/css-loader/")
  );

  cssLoaderOption.options.modules = { localIdentName };
  return config;
};

const setupReactHotLoader = () => (config) => {
  config = addBabelPlugin("react-hot-loader/babel")(config);
  config.entry = ["react-hot-loader/patch", ...config.entry];

  if (!config.resolve.alias) {
    config.resolve.alias = {};
  }
  config.resolve.alias["react-dom"] = "@hot-loader/react-dom";

  return config;
};

if (process.env.NODE_ENV === "development") {
  module.exports = override(setupReactHotLoader());
} else {
  module.exports = override(
    setCssModuleLocalIdentName("[hash:base64:5]"),
    addBundleVisualizer({}, true)
  );
}