diff --git a/app/courrier/page.tsx b/app/courrier/page.tsx
index 0aad9307..6dd07193 100644
--- a/app/courrier/page.tsx
+++ b/app/courrier/page.tsx
@@ -850,17 +850,23 @@ export default function CourrierPage() {
                             
                             console.log('Connection test successful:', testResult);
                             
-                            // If connection test is successful, save the account
+                            // Only declare realAccounts once before using for color assignment
                             const realAccounts = accounts.filter(a => a.id !== 'loading-account');
-                            const newAccountObj = {
-                              id: `account-${Date.now()}`,
-                              name: formValues.display_name,
-                              email: formValues.email,
-                              color: colorPalette[realAccounts.length % colorPalette.length],
-                              folders: testResult.details.sampleFolders || ['INBOX', 'Sent', 'Drafts', 'Trash']
-                            };
-                            
-                            setAccounts(prev => [...prev, newAccountObj]);
+                            const saveResponse = await fetch('/api/courrier/account', {
+                              method: 'POST',
+                              headers: {
+                                'Content-Type': 'application/json'
+                              },
+                              body: JSON.stringify(formValues)
+                            });
+                            const saveResult = await saveResponse.json();
+                            if (!saveResponse.ok) {
+                              throw new Error(saveResult.error || 'Failed to add account');
+                            }
+                            const realAccount = saveResult.account;
+                            realAccount.color = colorPalette[realAccounts.length % colorPalette.length];
+                            realAccount.folders = testResult.details.sampleFolders || ['INBOX', 'Sent', 'Drafts', 'Trash'];
+                            setAccounts(prev => [...prev, realAccount]);
                             setShowAddAccountForm(false);
                             toast({
                               title: "Account added successfully",