feat: enhance RecommendedMcpWizard with icon mapping; improve ExecutionTab accessibility; refine NavGroup path matching; update fetchSkills to include enabled status; add loading and error messages to localization

ccw/frontend/src/main.tsx

@@ -7,10 +7,30 @@ import 'react-resizable/css/styles.css'
 import { initMessages, getInitialLocale, getMessages, type Locale } from './lib/i18n'
 import { logWebVitals } from './lib/webVitals'
 
+/**
+ * Initialize CSRF token by fetching from backend
+ * This ensures the CSRF cookie is set before any mutating API calls
+ */
+async function initCsrfToken() {
+  try {
+    // Fetch CSRF token from backend - this sets the XSRF-TOKEN cookie
+    await fetch('/api/csrf-token', {
+      method: 'GET',
+      credentials: 'same-origin',
+    })
+  } catch (error) {
+    // Log error but don't block app initialization
+    console.error('Failed to initialize CSRF token:', error)
+  }
+}
+
 async function bootstrapApplication() {
   const rootElement = document.getElementById('root')
   if (!rootElement) throw new Error('Failed to find the root element')
 
+  // Initialize CSRF token before any API calls
+  await initCsrfToken()
+
   // Initialize translation messages
   await initMessages()