Add SEO fields to Tasks model, improve content generation response handling, and enhance progress bar animation

- Added primary_keyword, secondary_keywords, tags, and categories fields to Tasks model
- Updated generate_content function to handle full JSON response with all SEO fields
- Improved progress bar animation: smooth 1% increments every 300ms
- Enhanced step detection for content generation vs clustering vs ideas
- Fixed progress modal to show correct messages for each function type
- Added comprehensive logging to Keywords and Tasks pages for AI functions
- Fixed error handling to show meaningful error messages instead of generic failures

frontend/vite.config.ts

@@ -21,17 +21,131 @@ export default defineConfig(({ mode }) => {
     // Optimize dependency pre-bundling
     optimizeDeps: {
       include: [
-        'react-apexcharts',
-        'apexcharts',
+        // Only pre-bundle frequently used, small dependencies
         'clsx',
         'tailwind-merge',
+        'zustand',
+      ],
+      // Exclude heavy dependencies that are only used in specific pages
+      // They will be lazy-loaded when needed
+      exclude: [
+        '@fullcalendar/core',
+        '@fullcalendar/daygrid',
+        '@fullcalendar/interaction',
+        '@fullcalendar/list',
+        '@fullcalendar/react',
+        '@fullcalendar/timegrid',
+        'apexcharts',
+        'react-apexcharts',
+        '@react-jvectormap/core',
+        '@react-jvectormap/world',
+        'react-dnd',
+        'react-dnd-html5-backend',
+        'swiper',
       ],
-      exclude: [], // Don't exclude anything
       esbuildOptions: {
-        // Increase timeout for large dependencies
         target: 'es2020',
       },
     },
+    // Build configuration for code splitting
+    build: {
+      // Enable minification (esbuild is faster than terser)
+      minify: 'esbuild',
+      // Enable CSS code splitting
+      cssCodeSplit: true,
+      // Optimize chunk size
+      rollupOptions: {
+        output: {
+          // Manual chunk splitting for better code splitting
+          manualChunks: (id) => {
+            // Vendor chunks - separate large dependencies for better caching
+            if (id.includes('node_modules')) {
+              // React core (most critical, always needed)
+              if (id.includes('react/') || id.includes('react-dom/')) {
+                return 'vendor-react-core';
+              }
+              // React Router (separate chunk - only loads on navigation)
+              if (id.includes('react-router')) {
+                return 'vendor-react-router';
+              }
+              // Heavy chart libraries (only used in specific pages)
+              if (id.includes('apexcharts') || id.includes('react-apexcharts')) {
+                return 'vendor-charts';
+              }
+              // Calendar libraries (only used in Calendar page)
+              if (id.includes('@fullcalendar')) {
+                return 'vendor-calendar';
+              }
+              // Map libraries (only used in specific pages)
+              if (id.includes('@react-jvectormap')) {
+                return 'vendor-maps';
+              }
+              // Drag and drop (only used in specific pages)
+              if (id.includes('react-dnd')) {
+                return 'vendor-dnd';
+              }
+              // Swiper (only used in specific pages)
+              if (id.includes('swiper')) {
+                return 'vendor-swiper';
+              }
+              // UI libraries (Radix UI, etc.)
+              if (id.includes('@radix-ui') || id.includes('framer-motion')) {
+                return 'vendor-ui';
+              }
+              // Zustand (state management - used everywhere)
+              if (id.includes('zustand')) {
+                return 'vendor-state';
+              }
+              // React Helmet (SEO)
+              if (id.includes('react-helmet')) {
+                return 'vendor-helmet';
+              }
+              // Other vendors (smaller libraries)
+              return 'vendor-other';
+            }
+            // Page chunks - each page gets its own chunk
+            if (id.includes('/pages/')) {
+              const match = id.match(/\/pages\/([^/]+)/);
+              if (match) {
+                const pageName = match[1];
+                // Group by module for better caching
+                if (pageName === 'Planner' || id.includes('/Planner/')) {
+                  return 'pages-planner';
+                }
+                if (pageName === 'Writer' || id.includes('/Writer/')) {
+                  return 'pages-writer';
+                }
+                if (pageName === 'Thinker' || id.includes('/Thinker/')) {
+                  return 'pages-thinker';
+                }
+                if (pageName === 'Settings' || id.includes('/Settings/')) {
+                  return 'pages-settings';
+                }
+                if (pageName === 'Billing' || id.includes('/Billing/')) {
+                  return 'pages-billing';
+                }
+                // Individual page chunks for others
+                return `page-${pageName.toLowerCase()}`;
+              }
+            }
+            // Split icons into separate chunk (lazy load)
+            if (id.includes('/icons/') && id.endsWith('.svg')) {
+              return 'icons';
+            }
+          },
+          // Optimize chunk file names
+          chunkFileNames: 'assets/js/[name]-[hash].js',
+          entryFileNames: 'assets/js/[name]-[hash].js',
+          assetFileNames: 'assets/[ext]/[name]-[hash].[ext]',
+        },
+      },
+      // Increase chunk size warning limit (default is 500kb)
+      chunkSizeWarningLimit: 600,
+      // Enable source maps in dev only
+      sourcemap: isDev,
+      // Report compressed sizes
+      reportCompressedSize: true,
+    },
     // Only configure server and HMR in development mode
     ...(isDev && {
       server: {