fix: Update cache persistence logic for energy providers and enhance admin offers page with token checks and real-time messaging features

Author: Clément VALENTIN

apps/web/src/main.tsx

@@ -60,7 +60,7 @@ ReactDOM.createRoot(document.getElementById('root')!).render(
 
             // Don't persist energy providers/offers - they change when scrapers run
             // and must always be fresh from the server to avoid stale cache issues
-            if (queryKey === 'energy-providers' || queryKey === 'energy-offers') {
+            if (queryKey === 'energy-providers' || queryKey === 'energy-offers' || queryKey === 'energy-providers-with-scrapers' || queryKey === 'sync-status') {
               return false
             }
 

apps/web/src/pages/AdminOffers.tsx

@@ -19,6 +19,8 @@ const formatPrice = (price: number | string | undefined | null, decimals: number
 export default function AdminOffers() {
   const queryClient = useQueryClient()
   const { hasAction } = usePermissions()
+  // Use direct token check to avoid timing issues with useAuth hook
+  const hasToken = !!localStorage.getItem('access_token')
 
   // Filters
   const [filterProvider, setFilterProvider] = useState<string>('all')
@@ -94,6 +96,8 @@ export default function AdminOffers() {
       }
       return []
     },
+    enabled: hasToken,
+    staleTime: 0, // Always refetch on mount to avoid stale cache issues
   })
 
   // Fetch all offers
@@ -106,6 +110,8 @@ export default function AdminOffers() {
       }
       return []
     },
+    enabled: hasToken,
+    staleTime: 0, // Always refetch on mount to avoid stale cache issues
   })
 
   // Fetch sync status (poll every second when a sync is in progress or refresh is active)
@@ -118,6 +124,7 @@ export default function AdminOffers() {
       }
       return { sync_in_progress: false, provider: null, started_at: null, current_step: null, steps: [], progress: 0 }
     },
+    enabled: hasToken,
     refetchInterval: (query) => {
       // Poll much more frequently when sync is in progress or we're refreshing
       if (refreshingProvider || loadingPreview || query.state.data?.sync_in_progress) {

docs/pages/admin-contributions.md

@@ -42,25 +42,38 @@ Chaque contribution affiche :
 - Tarification proposée (abonnement, prix kWh selon le type)
 - Documentation (lien vers fiche des prix, screenshot)
 
-### 4. Système de messagerie
+### 4. Système de messagerie (style WhatsApp)
 
+Interface de chat en temps réel utilisant le composant partagé `ChatWhatsApp` :
+
+#### Affichage
 - **Bouton "Voir les échanges"** : Toggle pour afficher/masquer l'historique
 - **Indicateur de message non lu** : Point orange clignotant si le contributeur a répondu
 - **Persistance** : Les contributions lues sont mémorisées dans localStorage
-- **Réponse rapide** : Champ de texte inline pour répondre directement au contributeur
-- **Historique des échanges** : Messages affichés avec distinction admin/contributeur
+
+#### Design style WhatsApp
+- **Bulles de messages** avec queues (triangles) orientées selon l'expéditeur
+- **Messages admin** : Alignés à droite, fond vert/bleu primaire (dark: émeraude foncé)
+- **Messages contributeur** : Alignés à gauche, fond blanc (dark: gris foncé), icône bouclier
+- **Horodatage** : Format "JJ/MM HH:MM" en bas de chaque bulle
+- **Double checkmark** : Indicateur de lecture sur les messages admin
+- **Fond neutre** : Gris clair (`bg-gray-50`) en mode light, gris foncé en mode dark
+
+#### Communication en temps réel
+- **Auto-refresh silencieux** : Rechargement des messages toutes les **5 secondes**
+- **Réponse rapide** : Champ de texte inline avec envoi via Entrée
+- **Scroll automatique** : Défilement vers le dernier message
 
 ### 5. Actions individuelles
 
 - **Approuver** (bouton vert) : Ouvre modal de confirmation
 - **Demander des infos** (bouton bleu) : Ouvre modal avec champ de message
+  - Bouton "Envoyer la demande" **grisé** tant qu'aucun message n'est saisi
+  - Messages rapides cliquables pour pré-remplir le champ
 - **Rejeter** (bouton rouge) : Ouvre modal avec raisons prédéfinies :
-  - Tarifs incorrects ou obsolètes
-  - Offre déjà existante dans la base
-  - Informations incomplètes
-  - Source non vérifiable
-  - Fournisseur non reconnu
-  - Autre (commentaire libre)
+  - Bouton "Confirmer le rejet" **grisé** tant qu'aucune raison n'est sélectionnée/saisie
+  - Raisons rapides : Offre non valide, Lien invalide, Offre introuvable, Offre expirée, Doublon, Données incomplètes
+  - Champ texte libre pour personnaliser le motif
 
 ### 6. Actions en masse
 
@@ -69,7 +82,7 @@ Chaque contribution affiche :
 - **Barre d'actions flottante** (apparaît quand items sélectionnés) :
   - Compteur de sélection
   - Bouton "Approuver" (vert)
-  - Bouton "Rejeter" (rouge) avec modal pour raison
+  - Bouton "Rejeter" (rouge) : ouvre modal avec raison obligatoire (bouton **grisé** sinon)
   - Bouton "Annuler"
 
 ### 7. Auto-refresh

docs/pages/contribute.md

@@ -51,17 +51,14 @@ Section affichant les contributions de l'utilisateur, organisée par statut :
 - **Approuvées** (vert) : plié par défaut
 - **Rejetées** (rouge) : plié par défaut
 
-#### Détails affichés pour chaque contribution
-- En-tête : nom de l'offre, type, puissance, date de soumission
-- **Section dépliable "Voir les détails"** :
-  - Informations fournisseur (nom, site web)
-  - Description de l'offre
-  - Tarification complète selon le type
-  - Liens vers la documentation (fiche tarifaire, screenshot)
-- Motif de rejet (pour les contributions rejetées)
+#### Affichage compact des contributions
+- **En-tête** : nom de l'offre, badges (type, puissance), fournisseur, date, description tronquée
+- **Tarification inline** : prix affichés sur une ligne (Abo, Base, HC/HP, Tempo, EJP...)
+- **Lien documentation** : icône cliquable vers la fiche tarifaire
+- **Motif de rejet** : affiché en bas pour les contributions rejetées
 
 #### Actions disponibles
-- **Bouton "Modifier cette contribution"** (bleu/orange) : pour les contributions en attente ou rejetées
+- **Bouton "Modifier"** (compact, bleu/orange) : pour les contributions en attente ou rejetées
 - Active le **mode édition** du formulaire :
   - Le titre du formulaire devient "Modifier la contribution"
   - Le bouton de soumission devient "Mettre à jour la contribution"
@@ -73,15 +70,24 @@ Section affichant les contributions de l'utilisateur, organisée par statut :
 
 Communication bidirectionnelle entre l'administrateur et le contributeur :
 
-- **Historique des échanges** visible dans chaque carte de contribution
+#### Section "Échanges" dépliable
+- **Visible pour** : contributions en attente (avec ou sans messages) ou avec messages existants
+- **Auto-déploiement** : s'ouvre automatiquement si le dernier message est de l'admin (non lu)
+- **Badge "Nouveau"** : affiché quand il y a un message non lu
+- **Protection anti-perte** : impossible de replier si l'utilisateur est en train d'écrire ou d'envoyer
+
+#### Affichage des messages (compact)
 - Messages différenciés visuellement :
-  - Messages admin : fond violet avec icône bouclier
-  - Messages contributeur : fond bleu avec icône utilisateur
-- **Formulaire de réponse** pour les contributions en attente :
-  - Envoi avec Entrée (Shift+Entrée pour nouvelle ligne)
-  - Bouton d'envoi sur toute la hauteur du champ
-- **Auto-scroll** vers le dernier message dans la conversation
-- **Rafraîchissement automatique** toutes les 10 secondes pour recevoir les nouveaux messages
+  - Messages admin (Modo) : fond bleu avec icône bouclier
+  - Messages contributeur (Vous) : fond vert avec icône utilisateur
+- Horodatage compact (JJ/MM HH:MM)
+- **Auto-scroll** vers le dernier message
+
+#### Formulaire de réponse intégré
+- Champ de saisie compact (1 ligne) directement dans la section Échanges
+- Envoi avec Entrée (Shift+Entrée pour nouvelle ligne)
+- Bouton d'envoi icône uniquement
+- **Rafraîchissement automatique** toutes les 10 secondes
 
 ### 6. Import JSON (fonctionnalité avancée)