import { defineConfig } from "vite";
import { sentryVitePlugin } from "@sentry/vite-plugin";

import vue from "@vitejs/plugin-vue";
import gql from "@rollup/plugin-graphql";
import path from "path";

const getFlavorConfig = () => {
  switch (process.env.APP_FLAVOR) {
    case "my-kv":
      return require("./config/prod-my-kv.env.js").default;
    case "my-dhf":
      return require("./config/prod-dhf.env.js").default;
    case "my-dha":
      return require("./config/prod-dha.env.js").default;
  }
  return {};
};

function resolve(dir: string) {
  return path.join(__dirname, dir);
}

const define = {
  "import.meta.env.HEP_URL": JSON.stringify(process.env.HEP_URL),
  "import.meta.env.MATOMO_HOST": JSON.stringify(process.env.MATOMO_HOST),
  "import.meta.env.MATOMO_SITE_ID": JSON.stringify(process.env.MATOMO_SITE_ID),
  "import.meta.env.LOGOUT_REDIRECT_URL": JSON.stringify(
    process.env.LOGOUT_REDIRECT_URL
  ),
  "import.meta.env.VUE_APP_FLAVOR": JSON.stringify(process.env.APP_FLAVOR),
  "import.meta.env.SENTRY_DSN": JSON.stringify(
    process.env.SENTRY_JAVASCRIPT_DSN
  ),
  "import.meta.env.SENTRY_ENVIRONMENT": JSON.stringify(process.env.SENTRY_ENV),
  /*
   * ENV variables used in JS code need to be stringyfied, as they will be replaced (in place) in the code,
   * and JS needs quotes around strings
   * see https://cli.vuejs.org/guide/mode-and-env.html#using-env-variables-in-client-side-code
   */
  "import.meta.env.VUE_APP_ENABLE_SPELLCHECK": !!process.env.TASKBASE_BASEURL,
};

const flavorConfig = getFlavorConfig();

const htmlPlugin = () => {
  return {
    name: "html-transform",
    transformIndexHtml(html: string) {
      return html
        .replace(/_APP_TITLE_/, flavorConfig.VUE_APP_TITLE || "mySkillbox")
        .replace(
          /_FAVICON_16_/,
          flavorConfig.VUE_APP_FAVICON_16 || "/static/favicon-16x16.png"
        )
        .replace(
          /_FAVICON_32_/,
          flavorConfig.VUE_APP_FAVICON_32 || "/static/favicon-32x32.png"
        );
    },
  };
};

const disableSentryPlugin = !process.env.SENTRY_AUTH_TOKEN; // disable the plugin when we're not in an environment that is connected to sentry

// https://vitejs.dev/config/
export default defineConfig({
  build: {
    assetsDir: "static",
    sourcemap: true, // Source map generation must be turned on
  },
  css: {
    preprocessorOptions: {
      scss: {
        additionalData: process.env.THEME
          ? `@import "styles/themes/_${process.env.THEME}.scss";`
          : "",
      },
    },
    devSourcemap: true,
  },
  resolve: {
    alias: {
      "@": resolve("./src"),
      styles: resolve("./src/styles"),
      gql: resolve("./src/graphql/gql"),
    },
  },
  server: {
    port: 8080,
    hmr: {
      clientPort: 8080,
    },
  },
  plugins: [
    gql(),
    vue(),
    htmlPlugin(),
    sentryVitePlugin({
      authToken: process.env.SENTRY_AUTH_TOKEN,
      org: "iterativ",
      disable: disableSentryPlugin,
      project: "skillbox-vue",
    }),
  ],
  define,
});