Fix: Résolution des problèmes OAuth Google Calendar

Corrections apportées :

1. **redirect_uri_mismatch** :
   - Ajout de la variable APP_URL dans .env.example avec documentation
   - Amélioration de la fonction getOAuth2Client pour accepter une URI personnalisée
   - Gestion plus flexible du redirect_uri (APP_URL ou localhost par défaut)

2. **Choix du compte Google** :
   - Modification du prompt OAuth : 'consent' → 'select_account consent'
   - Force maintenant l'affichage du sélecteur de compte Google

3. **Interface utilisateur** :
   - Ajout d'un encadré d'avertissement visible avec l'URL de redirection exacte
   - Instructions claires pour la configuration dans Google Cloud Console
   - Indication pour configurer APP_URL si nécessaire

4. **Documentation** :
   - Création du fichier OAUTH_SETUP.md avec guide complet
   - Checklist de vérification pour le débogage
   - Exemples de configuration pour local et production

Ces modifications permettent de résoudre l'erreur 400 redirect_uri_mismatch
et d'offrir le choix du compte Google lors de la connexion.

.env.example

@@ -21,3 +21,8 @@ MAX_FILE_SIZE=5242880
 # Limite de taux (requests par fenêtre)
 RATE_LIMIT_MAX=100
 RATE_LIMIT_WINDOW_MS=900000
+
+# URL de l'application (IMPORTANT pour Google OAuth)
+# En local: http://localhost:2222
+# En production: https://votre-domaine.com (sans slash final)
+APP_URL=http://localhost:2222

OAUTH_SETUP.md

@@ -0,0 +1,95 @@
+# Configuration OAuth Google Calendar
+
+Ce guide vous aide à résoudre les erreurs d'authentification OAuth Google.
+
+## Problème : Erreur 400 - redirect_uri_mismatch
+
+Cette erreur se produit quand l'URL de redirection configurée dans votre code ne correspond pas à celle configurée dans Google Cloud Console.
+
+### Solution
+
+#### 1. Identifier votre URL de redirection
+
+Votre application utilise automatiquement :
+```
+{VOTRE_DOMAINE}/api/calendar/oauth-callback
+```
+
+Exemples :
+- En local : `http://localhost:2222/api/calendar/oauth-callback`
+- En production : `https://votredomaine.com/api/calendar/oauth-callback`
+
+#### 2. Configurer la variable d'environnement APP_URL
+
+Si vous utilisez un domaine personnalisé ou une URL différente de `http://localhost:2222` :
+
+1. Créez un fichier `.env` à la racine du projet (copiez depuis `.env.example`) :
+   ```bash
+   cp .env.example .env
+   ```
+
+2. Modifiez la variable `APP_URL` dans le fichier `.env` :
+   ```env
+   # Pour un domaine local
+   APP_URL=http://localhost:2222
+
+   # Pour un domaine en production
+   APP_URL=https://votredomaine.com
+
+   # IMPORTANT : Pas de slash "/" à la fin !
+   ```
+
+3. Redémarrez l'application pour que les changements prennent effet.
+
+#### 3. Configurer Google Cloud Console
+
+1. Allez sur [Google Cloud Console - Credentials](https://console.cloud.google.com/apis/credentials)
+
+2. Sélectionnez votre projet
+
+3. Cliquez sur votre "OAuth 2.0 Client ID"
+
+4. Dans la section **"URIs de redirection autorisées"**, ajoutez EXACTEMENT l'URL affichée dans l'interface NoteFlow (panneau Administration > Google Calendar)
+
+5. Cliquez sur **"Enregistrer"**
+
+6. **Important** : Attendez quelques minutes que Google propage les changements (peut prendre 5-10 minutes)
+
+#### 4. Tester la connexion
+
+1. Dans NoteFlow, allez dans **Administration** > **Google Calendar**
+
+2. Vérifiez que l'URL affichée dans l'encadré jaune correspond exactement à celle configurée dans Google Cloud Console
+
+3. Cliquez sur **"Se connecter avec Google"**
+
+4. Vous devriez maintenant voir un écran de sélection de compte Google
+
+## Problème : Pas de choix du compte Google
+
+### Solution
+
+Ce problème a été corrigé dans le code. L'authentification utilise maintenant `prompt: 'select_account consent'` qui force l'affichage du sélecteur de compte Google.
+
+Si vous ne voyez toujours pas le choix du compte :
+1. Déconnectez-vous de Google Calendar dans NoteFlow
+2. Effacez les cookies Google dans votre navigateur
+3. Reconnectez-vous
+
+## Vérification rapide
+
+✅ Checklist :
+- [ ] Fichier `.env` créé avec la bonne valeur pour `APP_URL`
+- [ ] URL de redirection configurée dans Google Cloud Console (sans faute de frappe !)
+- [ ] API Google Calendar activée dans Google Cloud Console
+- [ ] Client ID et Client Secret enregistrés dans NoteFlow
+- [ ] Application redémarrée après modification du `.env`
+- [ ] Attendu 5-10 minutes après modification dans Google Cloud Console
+
+## Besoin d'aide ?
+
+Si le problème persiste :
+1. Vérifiez les logs de l'application pour des messages d'erreur détaillés
+2. Assurez-vous que votre navigateur accepte les cookies tiers
+3. Essayez en navigation privée pour éliminer les problèmes de cache
+4. Vérifiez que l'API Google Calendar est bien activée dans votre projet Google Cloud

routes/calendar.routes.js

@@ -14,8 +14,9 @@ const SCOPES = ['https://www.googleapis.com/auth/calendar.readonly'];
 
 /**
  * Créer un client OAuth2
+ * @param {string} [customRedirectUri] - URI de redirection personnalisée (optionnel)
  */
-async function getOAuth2Client() {
+async function getOAuth2Client(customRedirectUri = null) {
   const clientId = await getOne("SELECT value FROM settings WHERE key = 'google_client_id'");
   const clientSecret = await getOne("SELECT value FROM settings WHERE key = 'google_client_secret'");
 
@@ -23,7 +24,9 @@ async function getOAuth2Client() {
     throw new Error('Client ID et Client Secret non configurés');
   }
 
-  const redirectUri = `${process.env.APP_URL || 'http://localhost:2222'}/api/calendar/oauth-callback`;
+  // Utiliser l'URI personnalisée si fournie, sinon utiliser APP_URL ou localhost
+  const redirectUri = customRedirectUri ||
+    `${process.env.APP_URL || 'http://localhost:2222'}/api/calendar/oauth-callback`;
 
   return new google.auth.OAuth2(
     clientId.value,
@@ -38,12 +41,14 @@ async function getOAuth2Client() {
  */
 router.get('/auth-url', requireAdmin, async (req, res) => {
   try {
-    const oauth2Client = await getOAuth2Client();
+    // Permettre de passer une URL de redirection personnalisée via query param
+    const customRedirectUri = req.query.redirect_uri;
+    const oauth2Client = await getOAuth2Client(customRedirectUri);
 
     const authUrl = oauth2Client.generateAuthUrl({
       access_type: 'offline',
       scope: SCOPES,
-      prompt: 'consent', // Force le prompt pour obtenir refresh_token
+      prompt: 'select_account consent', // Force le choix du compte ET le prompt pour obtenir refresh_token
       state: req.user.id.toString() // Pour identifier l'utilisateur au retour
     });
 

src/pages/Index.tsx

@@ -1375,9 +1375,21 @@ const Index = () => {
                         Google Cloud Console
                       </a>
                       {' '}et activez l'API Google Calendar.
-                      <br />
-                      <strong>URI de redirection autorisée:</strong> {window.location.origin}/api/calendar/oauth-callback
                     </p>
+                    <div className="p-3 bg-yellow-50 dark:bg-yellow-900/20 border border-yellow-200 dark:border-yellow-800 rounded-lg">
+                      <p className="text-sm font-semibold text-yellow-900 dark:text-yellow-200 mb-1">
+                        ⚠️ IMPORTANT : URI de redirection autorisée
+                      </p>
+                      <p className="text-xs text-yellow-800 dark:text-yellow-300 mb-2">
+                        Ajoutez cette URL exacte dans la console Google Cloud (OAuth 2.0 Client IDs → URIs de redirection autorisées) :
+                      </p>
+                      <code className="block p-2 bg-white dark:bg-gray-800 border border-yellow-300 dark:border-yellow-700 rounded text-xs font-mono break-all">
+                        {window.location.origin}/api/calendar/oauth-callback
+                      </code>
+                      <p className="text-xs text-yellow-800 dark:text-yellow-300 mt-2">
+                        💡 Si vous utilisez un domaine différent, créez un fichier .env avec APP_URL=https://votre-domaine.com
+                      </p>
+                    </div>
                   </div>
 
                   <div className="flex gap-2">