import tailwindcss from '@tailwindcss/vite';
import react from '@vitejs/plugin-react';
import laravel from 'laravel-vite-plugin';
import { resolve } from 'node:path';
import { defineConfig, loadEnv } from 'vite';

export default defineConfig(({ mode }) => {
    const env = loadEnv(mode, process.cwd(), '');

    return {
        plugins: [
            laravel({
                input: ['resources/css/app.css', 'resources/js/app.tsx'],
                refresh: true,
            }),
            react(),
            tailwindcss(),
        ],
        esbuild: {
            jsx: 'automatic',
            drop: mode === 'production' ? ['console', 'debugger'] : [],
        },
        resolve: {
            alias: {
                'ziggy-js': resolve(__dirname, 'vendor/tightenco/ziggy'),
            },
        },
        build: {
            target: 'es2020',
            rollupOptions: {
                output: {
                    manualChunks: {
                        'react-vendor': ['react', 'react-dom', 'react-dom/client'],
                        inertia: ['@inertiajs/react'],
                        'radix-core': ['@radix-ui/react-slot', '@radix-ui/react-separator', '@radix-ui/react-label'],
                        'radix-overlay': [
                            '@radix-ui/react-dialog',
                            '@radix-ui/react-alert-dialog',
                            '@radix-ui/react-popover',
                            '@radix-ui/react-tooltip',
                            '@radix-ui/react-select',
                        ],
                        'radix-forms': [
                            '@radix-ui/react-checkbox',
                            '@radix-ui/react-switch',
                            '@radix-ui/react-radio-group',
                            '@radix-ui/react-slider',
                        ],
                        'radix-nav': [
                            '@radix-ui/react-dropdown-menu',
                            '@radix-ui/react-navigation-menu',
                            '@radix-ui/react-context-menu',
                            '@radix-ui/react-tabs',
                            '@radix-ui/react-toggle',
                            '@radix-ui/react-toggle-group',
                        ],
                        'radix-other': [
                            '@radix-ui/react-avatar',
                            '@radix-ui/react-collapsible',
                            '@radix-ui/react-progress',
                            '@radix-ui/react-scroll-area',
                        ],
                        'framer-motion': ['framer-motion', 'motion'],
                        'date-fns': ['date-fns'],
                        zod: ['zod'],
                        echarts: ['echarts', 'echarts-for-react'],
                        tiptap: [
                            '@tiptap/react',
                            '@tiptap/starter-kit',
                            '@tiptap/extension-color',
                            '@tiptap/extension-highlight',
                            '@tiptap/extension-link',
                            '@tiptap/extension-table',
                            '@tiptap/extension-table-cell',
                            '@tiptap/extension-table-header',
                            '@tiptap/extension-table-row',
                            '@tiptap/extension-text-align',
                            '@tiptap/extension-text-style',
                            '@tiptap/extension-underline',
                        ],
                        'tanstack-table': ['@tanstack/react-table'],
                        'react-hook-form': ['react-hook-form', '@hookform/resolvers'],
                        sonner: ['sonner'],
                    },
                    chunkFileNames: (chunkInfo) => {
                        const prefix =
                            chunkInfo.name.includes('vendor') || chunkInfo.name.includes('react') || chunkInfo.name.includes('inertia')
                                ? 'vendors'
                                : 'chunks';
                        return `assets/${prefix}/[name]-[hash].js`;
                    },
                    entryFileNames: 'assets/[name]-[hash].js',
                    assetFileNames: (assetInfo) => {
                        const info = assetInfo.name || '';
                        if (info.endsWith('.css')) {
                            return 'assets/css/[name]-[hash][extname]';
                        }
                        if (info.endsWith('.woff') || info.endsWith('.woff2') || info.endsWith('.ttf') || info.endsWith('.otf')) {
                            return 'assets/fonts/[name]-[hash][extname]';
                        }
                        if (
                            info.endsWith('.png') ||
                            info.endsWith('.jpg') ||
                            info.endsWith('.jpeg') ||
                            info.endsWith('.webp') ||
                            info.endsWith('.gif') ||
                            info.endsWith('.svg')
                        ) {
                            return 'assets/images/[name]-[hash][extname]';
                        }
                        return 'assets/[name]-[hash][extname]';
                    },
                },
            },
            minify: 'esbuild',
            cssMinify: true,
            modulePreload: {
                polyfill: false,
                resolveDependencies: (url, deps, _context) => {
                    return deps.filter((dep) => dep.includes('react-vendor') || dep.includes('inertia'));
                },
            },
            chunkSizeWarningLimit: 500,
            sourcemap: mode !== 'production',
            cssCodeSplit: true,
            assetsInlineLimit: 4096,
        },
        css: {
            devSourcemap: mode !== 'production',
        },
        define: {
            __TURNSTILE_SITE_KEY__: JSON.stringify(env.TURNSTILE_SITE_KEY || ''),
            'global.__TURNSTILE_SITE_KEY__': JSON.stringify(env.TURNSTILE_SITE_KEY || ''),
        },
        optimizeDeps: {
            include: ['react', 'react-dom', 'react-dom/client', '@inertiajs/react'],
        },
    };
});