const { resolve } = require("path");
const path = require("path");

module.exports = async ({ config }) => {
  // styles
  config.module.rules.push({
    test: /\.(sass|scss)$/,
    use: ["resolve-url-loader"],
    include: path.resolve(__dirname, "../"),
  });
  // fonts
  config.module.rules.push({
    test: /\.(woff|woff2|eot|ttf)$/,
    use: [
      {
        loader: "file-loader",
        query: {
          name: "[name].[ext]",
        },
      },
    ],
    include: path.resolve(__dirname, "../"),
    resolve: {
      extensions: ["*", ".tsx", ".ts", ".js", ".jsx"],
      alias: {
        assets: path.resolve(__dirname, "./src/assets"),
        icons: path.resolve(__dirname, "./src/assets/icons"),
        context: path.resolve(__dirname, "./src/context"),
        data: path.resolve(__dirname, "./src/data"),
        interfaces: path.resolve(__dirname, "./src/interfaces"),
        "native/atoms": path.resolve(
          __dirname,
          "./src/native/components/atoms"
        ),
        "native/molecules": path.resolve(
          __dirname,
          "./src/native/components/molecules"
        ),
        "native/organisms": path.resolve(
          __dirname,
          "./src/native/components/organisms"
        ),
        "react/atoms": path.resolve(__dirname, "./src/react/components/atoms"),
        "react/molecules": path.resolve(
          __dirname,
          "./src/react/components/molecules"
        ),
        "react/organisms": path.resolve(
          __dirname,
          "./src/react/components/organisms"
        ),
        "stories/native": path.resolve(__dirname, ".src/stories/native"),
        "stories/react": path.resolve(__dirname, ".src/stories/react"),
        hooks: path.resolve(__dirname, ".src/hooks"),
      },
    },
  });

  return config;
};
