import react from '@vitejs/plugin-react';
import { promises as fsPromises } from 'fs';
import { createRequire } from 'module';
import * as path from 'path';
import * as url from 'url';
import { defineConfig } from 'vite';
import { ViteEjsPlugin } from 'vite-plugin-ejs';
//import CompressionPlugin from 'vite-plugin-compression';
import { VitePWA } from 'vite-plugin-pwa';
import InstanceRenderManager from './src/utils/instanceRenderMgr';

process.env.VITE_APP_GIT_SHA_DATE = new Date().toLocaleString('en-US', {
  timeZone: 'America/Los_Angeles',
});

const WRONG_CODE = `import { bpfrpt_proptype_WindowScroller } from "../WindowScroller.js";`;
function reactVirtualized() {
  return {
    name: 'flat:react-virtualized',
    configResolved: async () => {
      const require = createRequire(import.meta.url);
      const reactVirtualizedPath = require.resolve('react-virtualized');
      const { pathname: reactVirtualizedFilePath } = new url.URL(
        reactVirtualizedPath,
        import.meta.url
      );
      const file = reactVirtualizedFilePath.replace(
        path.join('dist', 'commonjs', 'index.js'),
        path.join('dist', 'es', 'WindowScroller', 'utils', 'onScroll.js')
      );
      const code = await fsPromises.readFile(file, 'utf-8');
      const modified = code.replace(WRONG_CODE, '');
      await fsPromises.writeFile(file, modified);
    },
  };
}

export default defineConfig({
  base: '/',
  plugins: [
    ViteEjsPlugin((viteConfig) => {
      // viteConfig is the current Vite resolved config
      return { env: viteConfig.env };
    }),
    VitePWA({
      injectRegister: 'auto',
      registerType: 'prompt',
      manifest: {
        short_name: InstanceRenderManager({
          instance: process.env.VITE_APP_INSTANCE,
          imex: 'ImEX Online',
          rome: 'Rome Online',
          promanager: 'ProManager',
        }),
        name: InstanceRenderManager({
          instance: process.env.VITE_APP_INSTANCE,
          imex: 'ImEX Online',
          rome: 'Rome Online',
          promanager: 'ProManager',
        }),
        description: 'The ultimate bodyshop management system.',
        icons: [
          { //TODO:AIO Ensure that these are correct for Rome and IO.
            src: InstanceRenderManager({
              instance: process.env.VITE_APP_INSTANCE,
              imex: 'favicon.png',
              rome: 'ro-favicon.png',
              promanager: '/pm/pm-favicon.ico',
            }),
            sizes: '64x64 32x32 24x24 16x16',
            type: 'image/x-icon',
          },
          {
            src: InstanceRenderManager({
              instance: process.env.VITE_APP_INSTANCE,
              imex: 'logo192.png',
              rome: 'logo192.png',
              promanager: '/pm/pm-icon-192.png',
            }),
            type: 'image/png',
            sizes: '192x192',
          },
          {
            src: InstanceRenderManager({
              instance: process.env.VITE_APP_INSTANCE,
              imex: 'logo512.png',
              rome: 'ro-favicon.png',
              promanager: '/pm/pm-icon-512.png',
            }),
            type: 'image/png',
            sizes: '512x512',
          },
        ],
        theme_color: InstanceRenderManager({
          instance: process.env.VITE_APP_INSTANCE,
          imex: '#1890ff',
          rome: '#fff',
          promanager: '#1d69a6',
        }),
        background_color: '#fff',
        gcm_sender_id: '103953800507',
      },
    }),
    reactVirtualized(),
    react(),
   // CompressionPlugin(), //Cloudfront already compresses assets, so not needed. 
  ],
  define:{
    "APP_VERSION":  JSON.stringify(process.env.npm_package_version)
  },
  server: {
    host: true,
    port: 3000,
    open: true,
  },
  build: {
    rollupOptions: {
      output: {
        manualChunks: {
          antd: ['antd'],
          'react-redux': ['react-redux'],
          redux: ['redux'],
        },
      },
    },
  },
  optimizeDeps: {
    include: ['react', 'react-dom', 'antd', '@apollo/client', '@reduxjs/toolkit', 'axios'],
    esbuildOptions: {
      loader: {
        '.js': 'jsx',
      },
    },
  },
});