import vuetify, { transformAssetUrls } from "vite-plugin-vuetify";

export default defineNuxtConfig({
  compatibilityDate: "2025-05-15",
  devtools: {
    enabled: true,
    timeline: {
      enabled: true,
    },
  },

  app: {
    head: {
      meta: [
        { name: 'viewport', content: 'width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no' },
        { name: 'mobile-web-app-capable', content: 'yes' },
        { name: 'apple-mobile-web-app-capable', content: 'yes' },
        { name: 'apple-mobile-web-app-status-bar-style', content: 'black-translucent' }
      ]
    }
  },

  modules: [
    // "@nuxt/content",
    "@nuxt/eslint",
    "@nuxt/fonts",
    "@nuxt/icon",
    "@nuxt/image",
    "@nuxt/scripts",
    "@nuxt/test-utils",
    "@nuxt/ui",
    "@pinia/nuxt",
    "@vesp/nuxt-fontawesome",
    "@nuxtjs/google-fonts",
    async (_options, nuxt) => {
      nuxt.hooks.hook("vite:extendConfig", async (config) => {
        // @ts-expect-error
        config.plugins.push(vuetify({ autoImport: true }));
        
        // // Add HTTPS plugin
        // try {
        //   // @ts-ignore
        //   const { default: basicSsl } = await import('@vitejs/plugin-basic-ssl');
        //   // @ts-expect-error
        //   config.plugins.push(basicSsl());
        //   // @ts-expect-error
        //   config.server = config.server || {};
        //   // @ts-expect-error
        //   config.server.https = true;
        //   // @ts-expect-error
        //   config.server.host = '10.10.150.175';
        //   // @ts-expect-error
        //   config.server.port = 3001;
        // } catch (e) {
        //   console.warn('Failed to load HTTPS plugin:', e);
        // }
      });
    },
  ],

  fontawesome: {
    icons: {
      solid: ["dna", "user", "home", "gear"],
      regular: ["heart"],
      brands: ["github"],
    },
  },
  googleFonts: {
    families: {
      Inter: [400, 500, 600, 700],
    },
    display: "swap",
  },

  runtimeConfig: {
    authSecret: process.env.NUXT_AUTH_SECRET,
    keycloakClientId: process.env.KEYCLOAK_CLIENT_ID,
    keycloakClientSecret: process.env.KEYCLOAK_CLIENT_SECRET,
    keycloakIssuer: process.env.KEYCLOAK_ISSUER,
    public: {
      authUrl: process.env.AUTH_ORIGIN,
      // authUrl: process.env.AUTH_ORIGIN || "http://10.10.150.175:3001",
      // authUrl: process.env.AUTH_ORIGIN || "http://localhost:3001",
      wsBaseUrl: process.env.WS_BASE_URL || 'ws://10.10.150.100:8084/api/v1/ws',
    },
  },

  build: {
    transpile: ["vuetify"],
  },

  css: [
    "vuetify/lib/styles/main.sass",
    "@mdi/font/css/materialdesignicons.min.css",
    "~/assets/scss/main.scss",
  ],

  devServer: (() => {
    const hostEnv = process.env.HOST || 'localhost';
    
    // Parse HOST if it's a full URL (e.g., "http://10.10.150.175:3000")
    let host = hostEnv;
    let port = 3000;
    
    try {
      const url = new URL(hostEnv);
      host = url.hostname;
      port = url.port ? parseInt(url.port, 10) : 3000;
    } catch {
      // If HOST is not a URL, use it as-is (e.g., "10.10.150.175" or "localhost")
      host = hostEnv;
    }
    
    return {
      port: port,
      host: host
    };
  })(),

  vite: {
    css: {
      preprocessorOptions: {
        scss: {
          additionalData: `
            @use "sass:math";
            @use "sass:map";
            @use "~/assets/scss/_variables.scss" as *;
            @use "~/assets/scss/_colors.scss" as *;
          `,
        },
      },
    },
    ssr: {
      noExternal: ["vuetify"],
    },
  },
});