perf(api): alléger les requêtes du calendrier, des stats et de la médiathèque

Trois défauts se cumulaient : des réponses bien plus larges que nécessaire,
aucun index en base, et des boucles de requêtes là où une seule suffisait.

Réponses
- /api/scheduled-posts renvoyait la ligne `social_pages` entière, jetons
  d'accès Facebook et TikTok compris, jusque dans le navigateur. Seules les
  colonnes réellement affichées sont désormais sélectionnées.
- Le filtre de dates est poussé en SQL. Il était appliqué en JavaScript après
  avoir chargé tout l'historique — que le client ne bornait jamais. Le
  calendrier demande maintenant les six semaines affichées, le sélecteur de
  date les créneaux à venir, le bloc « publications récentes » ses 90 jours.
- /api/media accepte `limit` et `offset` (sans eux, réponse inchangée : des
  écrans doivent retrouver un média par son identifiant). La médiathèque
  pagine côté serveur au lieu de tout charger pour afficher cinq vignettes, et
  l'écran de création ne demande que les douze médias qu'il propose. Le total
  voyage dans l'en-tête X-Total-Count pour garder le compteur juste.

Index
- server/migrate.ts est le seul script exécuté au démarrage et n'en créait
  aucun ; ceux de migration-docker.sql ne servaient à rien, ce fichier n'étant
  monté nulle part. Postgres n'indexant pas les clés étrangères, le calendrier,
  l'historique et le scheduler parcouraient les tables entières. S'y ajoutent
  deux index partiels pour les boucles de fond : publications en attente et
  suivi asynchrone TikTok.

Requêtes
- /api/stats lisait quatre tables entières pour en compter les lignes : c'est
  désormais quatre COUNT filtrés.
- Les vues d'administration listaient les utilisateurs puis interrogeaient les
  pages de chacun ; une seule requête les remplace.
- getPostWithMedia et l'API externe chargeaient les médias un par un.
- /api/reels/ongoing chargeait tous les posts de l'utilisateur pour n'en garder
  que ceux en cours de génération, toutes les trois secondes.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01Qns6Gcpd95bCHWUxySh4Ew

.env.example

@@ -30,9 +30,27 @@ OPENROUTER_API_KEY=your-openrouter-api-key-here
 MINIO_ENDPOINT=http://minio:9000
 MINIO_PUBLIC_URL=https://media.example.com
 
-# Optionnel: Configuration Facebook API
+# ==========================================
+# FACEBOOK (connexion des pages et renouvellement des jetons)
+# ==========================================
+# Identifiants de votre application sur https://developers.facebook.com
+# Ils peuvent aussi être saisis dans l'application (Paramètres → Facebook),
+# ce qui est prioritaire sur ces variables.
+# Sans eux, les jetons de page doivent être collés et remplacés à la main.
 # FACEBOOK_APP_ID=
 # FACEBOOK_APP_SECRET=
+#
+# URI de redirection OAuth à déclarer chez Facebook.
+# Par défaut : ${APP_URL}/api/facebook/callback
+# FACEBOOK_REDIRECT_URI=
+#
+# Permissions demandées à l'autorisation. Défaut : pages_show_list,
+# pages_manage_posts, pages_read_engagement, pages_manage_engagement,
+# read_insights, business_management, instagram_basic, instagram_content_publish
+# FACEBOOK_SCOPES=
+#
+# Version de la Graph API utilisée pour l'OAuth (défaut : v19.0).
+# FACEBOOK_GRAPH_VERSION=
 
 # Optionnel: Configuration Instagram API
 # INSTAGRAM_APP_ID=

client/src/components/ai-chat.tsx

@@ -38,6 +38,9 @@ export default function AiChat() {
   // Fetch available models from OpenRouter
   const { data: modelsData, isLoading: modelsLoading } = useQuery<{ data: OpenRouterModel[] }>({
     queryKey: ['/api/openrouter/models'],
+    // Liste servie par un appel sortant vers OpenRouter : elle ne bouge pas d'une
+    // heure à l'autre, inutile de la redemander à chaque retour sur l'onglet.
+    staleTime: 60 * 60 * 1000,
   });
 
   const availableModels = modelsData?.data || [];

client/src/components/calendar-view.tsx

@@ -13,6 +13,24 @@ import { useMediaQuery } from "@/hooks/use-media-query";
 import { PreviewModal } from "@/components/preview-modal";
 import type { Media } from "@shared/schema";
 
+/**
+ * Bornes de la grille affichée : 42 cases à partir du lundi qui précède le 1er
+ * du mois. Demander cette fenêtre plutôt que tout l'historique évite de charger
+ * des années de publications pour en afficher six semaines.
+ */
+function visibleRange(currentDate: Date): { startDate: string; endDate: string } {
+  const year = currentDate.getFullYear();
+  const month = currentDate.getMonth();
+  const firstDay = new Date(year, month, 1);
+  const startingDayOfWeek = firstDay.getDay() === 0 ? 6 : firstDay.getDay() - 1;
+
+  const start = new Date(year, month, 1 - startingDayOfWeek);
+  const end = new Date(year, month, 1 - startingDayOfWeek + 42);
+  end.setMilliseconds(-1); // fin de la 42e journée
+
+  return { startDate: start.toISOString(), endDate: end.toISOString() };
+}
+
 export default function CalendarView() {
   const [currentDate, setCurrentDate] = useState(new Date());
   const [editDialogOpen, setEditDialogOpen] = useState(false);
@@ -22,8 +40,11 @@ export default function CalendarView() {
   const { toast } = useToast();
   const isDesktop = useMediaQuery("(min-width: 768px)");
 
+  // La fenêtre fait partie de la clé : changer de mois redéclenche la requête.
+  const range = visibleRange(currentDate);
+
   const { data: scheduledPosts = [] } = useQuery<ScheduledPost[]>({
-    queryKey: ["/api/scheduled-posts"],
+    queryKey: ["/api/scheduled-posts", range],
     refetchInterval: 30000, // Auto-refresh every 30 seconds
   });
 

client/src/components/facebook-token-status.tsx

@@ -0,0 +1,203 @@
+/**
+ * Suivi et renouvellement des jetons d'accès.
+ *
+ * Un jeton de page Facebook n'affiche pas toujours de date d'expiration : celui
+ * qui dérive d'une connexion OAuth est permanent, et c'est sa révocation — pas
+ * son échéance — qui casse la publication. L'UI montre donc l'état réel remonté
+ * par le contrôle serveur, pas seulement un décompte de jours.
+ */
+
+import { useMutation, useQuery } from "@tanstack/react-query";
+import { AlertTriangle, Calendar, CheckCircle2, Facebook, RefreshCw, ShieldCheck } from "lucide-react";
+import { Button } from "@/components/ui/button";
+import { useToast } from "@/hooks/use-toast";
+import { apiRequest, getErrorMessage, queryClient } from "@/lib/queryClient";
+import type { ClientSocialPage } from "@shared/schema";
+import { format } from "date-fns";
+import { fr } from "date-fns/locale";
+
+type TokenStatus = 'valid' | 'expiring' | 'expired' | 'error';
+
+const STATUS_STYLES: Record<TokenStatus, { label: string; color: string; bgColor: string }> = {
+  valid: { label: 'Jeton valide', color: 'text-green-600', bgColor: 'bg-green-100' },
+  expiring: { label: 'Jeton bientôt expiré', color: 'text-orange-600', bgColor: 'bg-orange-100' },
+  expired: { label: 'Jeton expiré', color: 'text-red-600', bgColor: 'bg-red-100' },
+  error: { label: 'Contrôle en échec', color: 'text-red-600', bgColor: 'bg-red-100' },
+};
+
+function statusOf(page: ClientSocialPage): TokenStatus {
+  return (page.tokenStatus as TokenStatus | null) ?? 'valid';
+}
+
+/**
+ * Lance l'autorisation Facebook. La connexion se fait par navigation complète
+ * du navigateur (et non en fetch) puisqu'elle passe par le site de Facebook.
+ */
+export function ConnectFacebookButton({ className }: { className?: string }) {
+  const { toast } = useToast();
+
+  const { data: config } = useQuery<{ configured: boolean }>({
+    queryKey: ['/api/facebook/config'],
+  });
+
+  const handleClick = () => {
+    if (config && !config.configured) {
+      toast({
+        title: "Facebook n'est pas configuré",
+        description:
+          "Renseignez l'App ID et l'App Secret de votre application Facebook dans les paramètres.",
+        variant: 'destructive',
+      });
+      return;
+    }
+    window.location.href = '/api/facebook/connect';
+  };
+
+  return (
+    <Button
+      variant="outline"
+      className={className}
+      onClick={handleClick}
+      data-testid="button-connect-facebook"
+    >
+      <Facebook className="w-4 h-4 mr-2" />
+      Connecter des pages Facebook
+    </Button>
+  );
+}
+
+/** Relance le contrôle serveur, qui renouvelle le jeton s'il le peut. */
+export function RefreshTokenButton({ page }: { page: ClientSocialPage }) {
+  const { toast } = useToast();
+
+  const refreshMutation = useMutation({
+    mutationFn: async () => {
+      const response = await apiRequest('POST', `/api/facebook/pages/${page.id}/refresh`);
+      return (await response.json()) as { status: TokenStatus; renewed: boolean; error?: string };
+    },
+    onSuccess: (result) => {
+      queryClient.invalidateQueries({ queryKey: ['/api/pages'] });
+      toast({
+        title: result.renewed
+          ? 'Jeton renouvelé'
+          : result.status === 'valid'
+            ? 'Jeton valide'
+            : STATUS_STYLES[result.status].label,
+        description:
+          result.error ||
+          (result.renewed
+            ? `Un nouveau jeton a été généré pour ${page.pageName}.`
+            : `Aucun renouvellement nécessaire pour ${page.pageName}.`),
+        variant: result.status === 'valid' ? undefined : 'destructive',
+      });
+    },
+    onError: (error: unknown) => {
+      toast({
+        title: 'Contrôle impossible',
+        description: getErrorMessage(error, 'Facebook est injoignable, réessayez plus tard.'),
+        variant: 'destructive',
+      });
+    },
+  });
+
+  return (
+    <Button
+      variant="ghost"
+      size="sm"
+      onClick={() => refreshMutation.mutate()}
+      disabled={refreshMutation.isPending}
+      data-testid={`button-refresh-token-${page.id}`}
+    >
+      <RefreshCw className={`w-4 h-4 mr-2 ${refreshMutation.isPending ? 'animate-spin' : ''}`} />
+      {refreshMutation.isPending ? 'Contrôle…' : 'Vérifier le jeton'}
+    </Button>
+  );
+}
+
+/**
+ * Bloc d'état du jeton : ce que le dernier contrôle a constaté, l'échéance
+ * quand il y en a une, et l'erreur à corriger le cas échéant.
+ */
+export function TokenHealthPanel({ page }: { page: ClientSocialPage }) {
+  const status = statusOf(page);
+  const style = STATUS_STYLES[status];
+  const isTiktok = page.platform === 'tiktok';
+
+  // Pour TikTok, c'est l'autorisation (refresh token) qui porte l'échéance.
+  const expiresAt = isTiktok ? page.refreshTokenExpiresAt : page.tokenExpiresAt;
+
+  return (
+    <div className={`text-xs px-3 py-2 rounded-lg space-y-1 ${style.bgColor}`}>
+      <div className="flex items-center gap-2">
+        {status === 'valid' ? (
+          <CheckCircle2 className="w-4 h-4 text-green-600 shrink-0" />
+        ) : (
+          <AlertTriangle className="w-4 h-4 text-red-600 shrink-0" />
+        )}
+        <span className={`font-semibold ${style.color}`}>{style.label}</span>
+      </div>
+
+      <div className="flex items-center gap-2 text-muted-foreground">
+        <Calendar className="w-3.5 h-3.5 shrink-0" />
+        {expiresAt ? (
+          <span>
+            {isTiktok ? 'Connexion valable jusqu\'au' : 'Expire le'}{' '}
+            {format(new Date(expiresAt), 'd MMMM yyyy', { locale: fr })}
+          </span>
+        ) : page.autoRenew ? (
+          <span>Sans expiration</span>
+        ) : (
+          <span>Échéance inconnue</span>
+        )}
+      </div>
+
+      {page.autoRenew && (
+        <div className="flex items-center gap-2 text-muted-foreground">
+          <ShieldCheck className="w-3.5 h-3.5 shrink-0" />
+          <span>Renouvellement automatique actif</span>
+        </div>
+      )}
+
+      {page.tokenError && (
+        <p className={`${style.color} leading-relaxed`} data-testid={`text-token-error-${page.id}`}>
+          {page.tokenError}
+        </p>
+      )}
+
+      {page.lastTokenCheck && (
+        <p className="text-muted-foreground">
+          Dernier contrôle : {format(new Date(page.lastTokenCheck), 'd MMM yyyy à HH:mm', { locale: fr })}
+        </p>
+      )}
+    </div>
+  );
+}
+
+/** Bandeau global : les pages qui réclament une reconnexion manuelle. */
+export function TokenAlertBanner({ pages }: { pages: ClientSocialPage[] }) {
+  const failing = pages.filter((page) => {
+    const status = statusOf(page);
+    return status === 'expired' || status === 'error' || status === 'expiring';
+  });
+
+  if (failing.length === 0) return null;
+
+  return (
+    <div className="mb-6 p-4 bg-red-500/10 border border-red-500/30 rounded-xl flex gap-3">
+      <AlertTriangle className="w-5 h-5 text-red-500 shrink-0 mt-0.5" />
+      <div className="text-sm space-y-1">
+        <p className="font-semibold text-red-600 dark:text-red-400">
+          {failing.length === 1
+            ? 'Une page nécessite votre attention'
+            : `${failing.length} pages nécessitent votre attention`}
+        </p>
+        {failing.map((page) => (
+          <p key={page.id} className="text-muted-foreground">
+            <strong>{page.pageName}</strong> — {STATUS_STYLES[statusOf(page)].label.toLowerCase()}
+            {page.tokenError ? ` : ${page.tokenError}` : '.'}
+          </p>
+        ))}
+      </div>
+    </div>
+  );
+}

client/src/components/media-upload.tsx

@@ -2,25 +2,57 @@ import { useState, useCallback, useRef, useEffect } from "react";
 import { useDropzone } from "react-dropzone";
 import { Button } from "@/components/ui/button";
 import { Dialog, DialogContent } from "@/components/ui/dialog";
-import { useMutation, useQuery } from "@tanstack/react-query";
+import { useInfiniteQuery, useMutation } from "@tanstack/react-query";
 import { apiRequest, queryClient, handleUnauthorized } from "@/lib/queryClient";
 import { MediaThumbnail } from "@/components/media-thumbnail";
 import { CloudUpload, Image as ImageIcon, Video, X, Upload, Loader2, ZoomIn, Camera } from "lucide-react";
 import { useToast } from "@/hooks/use-toast";
 import { SiFacebook, SiInstagram } from "react-icons/si";
 
+/** Nombre de vignettes chargées par page. */
+const MEDIA_PAGE_SIZE = 15;
+
 export default function MediaUpload() {
   const { toast } = useToast();
   const [selectedFile, setSelectedFile] = useState<any>(null);
-  const [visibleCount, setVisibleCount] = useState(5);
   const [zoomImage, setZoomImage] = useState<string | null>(null);
   const loadMoreRef = useRef<HTMLDivElement>(null);
   const cameraInputRef = useRef<HTMLInputElement>(null);
 
-  const { data: mediaList } = useQuery({
-    queryKey: ["/api/media"],
+  // Pagination côté serveur : la médiathèque entière transitait pour n'afficher
+  // que les premières vignettes. La clé reste préfixée par « /api/media » afin
+  // que les invalidations existantes continuent de la rafraîchir.
+  const {
+    data: mediaPages,
+    fetchNextPage,
+    hasNextPage,
+    isFetchingNextPage,
+  } = useInfiniteQuery({
+    queryKey: ["/api/media", "pages"],
+    initialPageParam: 0,
+    queryFn: async ({ pageParam }) => {
+      const response = await fetch(`/api/media?limit=${MEDIA_PAGE_SIZE}&offset=${pageParam}`, {
+        credentials: "include",
+      });
+      if (!response.ok) {
+        // Même traitement que les autres requêtes : une session expirée renvoie
+        // vers l'écran de connexion plutôt que sur une médiathèque vide.
+        if (response.status === 401) handleUnauthorized("/api/media");
+        throw new Error("Impossible de charger la médiathèque");
+      }
+      const items = (await response.json()) as any[];
+      const total = Number(response.headers.get("X-Total-Count"));
+      return { items, total: Number.isFinite(total) ? total : items.length };
+    },
+    getNextPageParam: (lastPage, allPages) => {
+      const loaded = allPages.reduce((count, page) => count + page.items.length, 0);
+      return loaded < lastPage.total ? loaded : undefined;
+    },
   });
 
+  const mediaList = mediaPages?.pages.flatMap(page => page.items) ?? [];
+  const totalMedia = mediaPages?.pages[0]?.total ?? 0;
+
   const [uploadingCount, setUploadingCount] = useState(0);
 
   const uploadMutation = useMutation({
@@ -163,8 +195,8 @@ export default function MediaUpload() {
   useEffect(() => {
     const observer = new IntersectionObserver(
       (entries) => {
-        if (entries[0].isIntersecting && mediaList && visibleCount < (mediaList as any[]).length) {
-          setVisibleCount(prev => Math.min(prev + 5, (mediaList as any[]).length));
+        if (entries[0].isIntersecting && hasNextPage && !isFetchingNextPage) {
+          fetchNextPage();
         }
       },
       { threshold: 0.1 }
@@ -179,7 +211,7 @@ export default function MediaUpload() {
         observer.unobserve(loadMoreRef.current);
       }
     };
-  }, [mediaList, visibleCount]);
+  }, [hasNextPage, isFetchingNextPage, fetchNextPage]);
 
   return (
     <div className="bg-card rounded-2xl border border-border/50 overflow-hidden shadow-lg">
@@ -268,13 +300,13 @@ export default function MediaUpload() {
               <h4 className="text-sm font-semibold text-foreground flex items-center justify-between">
                 <span>Fichiers téléchargés</span>
                 <span className="text-xs font-medium text-muted-foreground bg-muted/30 px-3 py-1 rounded-full">
-                  {(mediaList as any[])?.length || 0} média(s)
+                  {totalMedia} média(s)
                 </span>
               </h4>
 
               <div className="max-h-[500px] overflow-y-auto">
                 <div className="grid grid-cols-3 gap-3">
-                  {(mediaList as any[])?.slice(0, visibleCount).map((media: any) => (
+                  {mediaList.map((media: any) => (
                     <div
                       key={media.id}
                       onClick={() => setSelectedFile(media)}
@@ -316,7 +348,7 @@ export default function MediaUpload() {
                 </div>
 
                 {/* Élément sentinelle pour le scroll infini */}
-                {(mediaList && visibleCount < (mediaList as any[]).length) ? (
+                {hasNextPage ? (
                   <div ref={loadMoreRef} className="flex justify-center py-4 mt-3">
                     <Loader2 className="w-5 h-5 text-primary animate-spin" />
                   </div>

client/src/components/ongoing-reels.tsx

@@ -24,7 +24,10 @@ interface OngoingReelsProps {
 export default function OngoingReels({ compact = false }: OngoingReelsProps) {
     const { data: ongoingPosts = [] } = useQuery<Post[]>({
         queryKey: ["/api/reels/ongoing"],
-        refetchInterval: 3000, // Poll every 3 seconds
+        // Cette route ne renvoie que les générations en cours : tant qu'elle est
+        // vide il n'y a pas de barre de progression à animer. On garde une veille
+        // lente, qui suffit à détecter une génération lancée depuis un autre écran.
+        refetchInterval: (query) => ((query.state.data?.length ?? 0) > 0 ? 3000 : 30000),
     });
 
     // Nothing to show — render nothing (not even a card)

client/src/components/recent-publications.tsx

@@ -29,6 +29,16 @@ import { Trash2 } from "lucide-react";
 import { useMutation, useQueryClient } from "@tanstack/react-query";
 import { apiRequest } from "@/lib/queryClient";
 
+/** Profondeur d'historique du bloc « Publications récentes ». */
+const RECENT_WINDOW_DAYS = 90;
+
+/** Minuit, pour que la clé de requête reste stable d'un rendu à l'autre. */
+function startOfDay(date: Date): Date {
+  const copy = new Date(date);
+  copy.setHours(0, 0, 0, 0);
+  return copy;
+}
+
 export default function RecentPublications() {
   const [previewModalOpen, setPreviewModalOpen] = useState(false);
   const [previewData, setPreviewData] = useState<{ postText: string; mediaIds: string[]; allMedia: Media[] }>({ postText: '', mediaIds: [], allMedia: [] });
@@ -37,8 +47,13 @@ export default function RecentPublications() {
   const { toast } = useToast();
   const queryClient = useQueryClient();
 
+  // Ce bloc n'affiche que les dix dernières publications : inutile de faire
+  // remonter tout l'historique pour cela.
+  const since = new Date();
+  since.setDate(since.getDate() - RECENT_WINDOW_DAYS);
+
   const { data: scheduledPosts = [], isLoading } = useQuery<ScheduledPostWithRelations[]>({
-    queryKey: ['/api/scheduled-posts'],
+    queryKey: ['/api/scheduled-posts', { startDate: startOfDay(since).toISOString() }],
   });
 
   // Filter and sort attempted posts (scheduled in the past)

client/src/components/sidebar.tsx

@@ -1,7 +1,7 @@
 import { Home, PlusCircle, Calendar, Images, Users, Bot, Clock, Settings, Database, UserCog, LogOut, ChevronLeft, ChevronRight, ChevronDown, Wand2, BarChart3, Video, Music, Shield } from "lucide-react";
 import { Link, useLocation } from "wouter";
 import { useQuery, useMutation } from "@tanstack/react-query";
-import { apiRequest, queryClient } from "@/lib/queryClient";
+import { apiRequest, AUTH_MUTATION, queryClient } from "@/lib/queryClient";
 import { useToast } from "@/hooks/use-toast";
 import { Button } from "@/components/ui/button";
 import { Avatar, AvatarFallback } from "@/components/ui/avatar";
@@ -52,6 +52,7 @@ export default function Sidebar({ onLinkClick }: SidebarProps = {}) {
   };
 
   const logoutMutation = useMutation({
+    mutationKey: [AUTH_MUTATION, "logout"],
     mutationFn: async () => {
       const res = await apiRequest("POST", "/api/auth/logout", {});
       return await res.json();

client/src/lib/queryClient.ts

@@ -1,4 +1,4 @@
-import { QueryClient, QueryFunction } from "@tanstack/react-query";
+import { MutationCache, QueryClient, QueryFunction } from "@tanstack/react-query";
 
 // Les routes d'authentification elles-mêmes ne doivent jamais déclencher
 // de redirection automatique (ex: mauvais mot de passe sur /login).
@@ -69,13 +69,40 @@ export async function apiRequest(
   return res;
 }
 
+/**
+ * Construit l'URL d'une requête à partir de sa clé.
+ *
+ * Les segments texte forment le chemin (`['/api/posts', id]`). Un objet en
+ * dernière position porte les paramètres de requête : c'est ce qui permet de
+ * demander une fenêtre de dates plutôt que tout l'historique
+ * (`['/api/scheduled-posts', { startDate, endDate }]`).
+ */
+export function urlFromQueryKey(queryKey: readonly unknown[]): string {
+  const segments = [...queryKey];
+  const last = segments[segments.length - 1];
+
+  if (last !== null && typeof last === "object") {
+    segments.pop();
+    const params = new URLSearchParams();
+    for (const [key, value] of Object.entries(last as Record<string, unknown>)) {
+      if (value !== undefined && value !== null && value !== "") {
+        params.set(key, String(value));
+      }
+    }
+    const query = params.toString();
+    return query ? `${segments.join("/")}?${query}` : segments.join("/");
+  }
+
+  return segments.join("/");
+}
+
 type UnauthorizedBehavior = "returnNull" | "throw";
 export const getQueryFn: <T>(options: {
   on401: UnauthorizedBehavior;
 }) => QueryFunction<T> =
   ({ on401: unauthorizedBehavior }) =>
   async ({ queryKey }) => {
-    const url = queryKey.join("/") as string;
+    const url = urlFromQueryKey(queryKey);
     const res = await fetch(url, {
       credentials: "include",
     });
@@ -88,13 +115,42 @@ export const getQueryFn: <T>(options: {
     return await res.json();
   };
 
+/**
+ * Marque les mutations d'authentification, exclues de l'invalidation globale
+ * ci-dessous. À passer en `mutationKey` : `[AUTH_MUTATION, 'logout']`.
+ */
+export const AUTH_MUTATION = "auth";
+
 export const queryClient = new QueryClient({
+  // Les compteurs du tableau de bord et la liste des posts dérivent de tout le
+  // reste : publier, supprimer un média, générer un texte… Aucune mutation ne
+  // peut raisonnablement se souvenir de les invalider, et aucune ne le faisait :
+  // ils restaient figés jusqu'au rechargement de la page. On les invalide donc
+  // ici, une bonne fois, après chaque mutation réussie.
+  mutationCache: new MutationCache({
+    onSuccess: (_data, _variables, _context, mutation) => {
+      // Sauf pour l'authentification : au moment où la déconnexion réussit, la
+      // session est déjà détruite. Relancer des requêtes ici ne produirait que
+      // des 401 et une redirection brutale, avant même que le cache soit vidé.
+      if (mutation.options.mutationKey?.[0] === AUTH_MUTATION) return;
+
+      queryClient.invalidateQueries({ queryKey: ["/api/stats"] });
+      queryClient.invalidateQueries({ queryKey: ["/api/posts"] });
+    },
+  }),
   defaultOptions: {
     queries: {
       queryFn: getQueryFn({ on401: "throw" }),
-      refetchInterval: false,
-      refetchOnWindowFocus: false,
-      staleTime: Infinity,
+      // Le serveur agit de son côté — le scheduler publie toutes les minutes, le
+      // renouvellement des jetons tourne en tâche de fond — sans que le
+      // navigateur en soit averti. Avec `staleTime: Infinity`, un écran restait
+      // sur le cache de sa première visite pour toute la session : d'où la
+      // nécessité de recharger la page pour voir quoi que ce soit. Une
+      // péremption courte, plus un rafraîchissement au retour sur l'onglet,
+      // suffit à garder l'affichage juste sans marteler l'API.
+      staleTime: 30_000,
+      refetchOnWindowFocus: true,
+      refetchOnReconnect: true,
       retry: false,
     },
     mutations: {

client/src/pages/history.tsx

@@ -17,6 +17,15 @@ type ScheduledPostWithRelations = ScheduledPost & {
   page?: SocialPage;
 };
 
+/** Publication dont l'heure est passée mais que le scheduler n'a pas encore traitée. */
+function isAwaitingPublication(scheduledPost: ScheduledPostWithRelations): boolean {
+  return (
+    !!scheduledPost.scheduledAt &&
+    new Date(scheduledPost.scheduledAt) <= new Date() &&
+    !scheduledPost.publishedAt
+  );
+}
+
 export default function History() {
   const [sidebarOpen, setSidebarOpen] = useState(false);
   const [previewModalOpen, setPreviewModalOpen] = useState(false);
@@ -25,7 +34,11 @@ export default function History() {
 
   const { data: scheduledPosts = [], isLoading } = useQuery<ScheduledPostWithRelations[]>({
     queryKey: ['/api/scheduled-posts'],
-    refetchInterval: 3000,
+    // Le scheduler publie en tâche de fond : on ne suit à la seconde que ce qui
+    // est réellement en attente. Le reste du temps, une veille lente suffit —
+    // sans quoi la page entière était rechargée 20 fois par minute pour rien.
+    refetchInterval: (query) =>
+      (query.state.data ?? []).some(isAwaitingPublication) ? 3000 : 30000,
   });
 
   // Filter attempted posts (scheduled in the past)

client/src/pages/mobile/history.tsx

@@ -19,13 +19,25 @@ import {
     DropdownMenuTrigger,
 } from "@/components/ui/dropdown-menu";
 
+/** Post dont le statut peut changer d'un instant à l'autre. */
+function isChanging(post: any): boolean {
+    if (post?.generationStatus === 'pending' || post?.generationStatus === 'processing') {
+        return true;
+    }
+    return post?.status === 'scheduled' && !!post?.scheduledFor && new Date(post.scheduledFor) <= new Date();
+}
+
 export default function MobileHistory() {
     const [searchTerm, setSearchTerm] = useState("");
 
     // Fetch posts history with polling to see status updates
     const { data: posts } = useQuery<any[]>({
         queryKey: ['/api/posts'],
-        refetchInterval: 3000, // Poll every 3 seconds
+        // Un post planifié pour la semaine prochaine ne bougera pas d'ici une
+        // seconde : on ne suit de près que ce dont le statut peut basculer
+        // maintenant (génération en cours, ou heure de publication dépassée).
+        refetchInterval: (query) =>
+            (query.state.data ?? []).some(isChanging) ? 3000 : 30000,
     });
 
     const getStatusIcon = (status: string) => {

client/src/pages/mobile/new-post.tsx

@@ -104,6 +104,16 @@ function SortableMediaItem({
   );
 }
 
+/** Nombre de médias récents proposés à la sélection. */
+const RECENT_MEDIA_COUNT = 12;
+
+/** Minuit, pour que la clé de requête reste stable d'un rendu à l'autre. */
+function startOfToday(): Date {
+  const date = new Date();
+  date.setHours(0, 0, 0, 0);
+  return date;
+}
+
 export default function NewPostMobile() {
   const [sidebarOpen, setSidebarOpen] = useState(false);
   const [, navigate] = useLocation();
@@ -127,8 +137,10 @@ export default function NewPostMobile() {
   });
   const pages = allPages.filter(p => p.platform !== 'tiktok');
 
+  // Seuls les douze derniers médias sont proposés ici : autant ne demander
+  // que ceux-là plutôt que toute la médiathèque.
   const { data: allMedia = [] } = useQuery<Media[]>({
-    queryKey: ['/api/media'],
+    queryKey: ['/api/media', { limit: RECENT_MEDIA_COUNT }],
   });
 
   const mediaList = useMemo(() => {
@@ -142,11 +154,13 @@ export default function NewPostMobile() {
         const dateB = b.createdAt ? new Date(b.createdAt).getTime() : 0;
         return dateB - dateA;
       })
-      .slice(0, 12);
+      .slice(0, RECENT_MEDIA_COUNT);
   }, [allMedia, recentUploads]);
 
+  // Ne sert qu'à griser les créneaux déjà pris dans le sélecteur de date : le
+  // passé n'a aucune influence sur une planification à venir.
   const { data: scheduledPosts = [] } = useQuery<ScheduledPost[]>({
-    queryKey: ['/api/scheduled-posts'],
+    queryKey: ['/api/scheduled-posts', { startDate: startOfToday().toISOString() }],
   });
 
   const uploadMutation = useMutation({

client/src/pages/mobile/pages.tsx

@@ -1,6 +1,6 @@
 import { useEffect, useState } from "react";
 import { useQuery, useMutation } from "@tanstack/react-query";
-import { Plus, Facebook, Instagram, Trash2, RefreshCw, Edit, Bug, Code, Calendar, AlertTriangle } from "lucide-react";
+import { Plus, Facebook, Instagram, Trash2, RefreshCw, Edit, Bug, Code } from "lucide-react";
 import { SiTiktok } from "react-icons/si";
 import Sidebar from "@/components/sidebar";
 import TopBar from "@/components/topbar";
@@ -12,69 +12,13 @@ import { Label } from "@/components/ui/label";
 import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select";
 import { useToast } from "@/hooks/use-toast";
 import { apiRequest, queryClient } from "@/lib/queryClient";
-import type { SocialPage } from "@shared/schema";
-import { format } from "date-fns";
-import { fr } from "date-fns/locale";
-
-function getTokenExpirationStatus(expiresAt: string | null | undefined) {
-  if (!expiresAt) {
-    return {
-      status: 'unknown' as const,
-      color: 'text-gray-500',
-      bgColor: 'bg-gray-100',
-      daysLeft: null,
-      message: 'Date inconnue'
-    };
-  }
-
-  const now = new Date();
-  const expiration = new Date(expiresAt);
-  const diffTime = expiration.getTime() - now.getTime();
-  const daysLeft = Math.ceil(diffTime / (1000 * 60 * 60 * 24));
-
-  if (daysLeft < 0) {
-    return {
-      status: 'expired' as const,
-      color: 'text-red-600',
-      bgColor: 'bg-red-100',
-      daysLeft,
-      message: 'Expiré'
-    };
-  } else if (daysLeft <= 7) {
-    return {
-      status: 'urgent' as const,
-      color: 'text-red-600',
-      bgColor: 'bg-red-100',
-      daysLeft,
-      message: `${daysLeft} jour${daysLeft > 1 ? 's' : ''} restant${daysLeft > 1 ? 's' : ''}`
-    };
-  } else if (daysLeft <= 15) {
-    return {
-      status: 'warning' as const,
-      color: 'text-orange-600',
-      bgColor: 'bg-orange-100',
-      daysLeft,
-      message: `${daysLeft} jours restants`
-    };
-  } else {
-    return {
-      status: 'good' as const,
-      color: 'text-green-600',
-      bgColor: 'bg-green-100',
-      daysLeft,
-      message: `${daysLeft} jours restants`
-    };
-  }
-}
-
-/**
- * Un compte TikTok n'a pas de "token de page" à surveiller : ce qui compte est la
- * validité de l'autorisation, portée par le refresh token (1 an).
- */
-function getConnectionExpiry(page: SocialPage): string | null {
-  const date = page.platform === 'tiktok' ? page.refreshTokenExpiresAt : page.tokenExpiresAt;
-  return date ? new Date(date).toISOString() : null;
-}
+import type { ClientSocialPage } from "@shared/schema";
+import {
+  ConnectFacebookButton,
+  RefreshTokenButton,
+  TokenAlertBanner,
+  TokenHealthPanel,
+} from "@/components/facebook-token-status";
 
 /**
  * Lance l'autorisation TikTok. La connexion se fait par navigation complète du
@@ -115,17 +59,21 @@ function ConnectTiktokButton() {
 export default function PagesManagementMobile() {
   const [sidebarOpen, setSidebarOpen] = useState(false);
   const [dialogOpen, setDialogOpen] = useState(false);
-  const [editingPage, setEditingPage] = useState<SocialPage | null>(null);
+  const [editingPage, setEditingPage] = useState<ClientSocialPage | null>(null);
   const { toast } = useToast();
 
-  // Retour du flux d'autorisation TikTok (/api/tiktok/callback redirige ici)
+  // Retour des flux d'autorisation (/api/tiktok/callback et /api/facebook/callback
+  // redirigent ici avec le résultat en paramètre)
   useEffect(() => {
     const params = new URLSearchParams(window.location.search);
-    const result = params.get('tiktok');
-    if (!result) return;
+    const network = params.get('tiktok') ? 'tiktok' : params.get('facebook') ? 'facebook' : null;
+    if (!network) return;
+
+    const result = params.get(network);
+    const label = network === 'tiktok' ? 'TikTok' : 'Facebook';
 
     toast({
-      title: result === 'success' ? 'Compte TikTok connecté' : 'Connexion TikTok impossible',
+      title: result === 'success' ? `${label} connecté` : `Connexion ${label} impossible`,
       description: params.get('message') || undefined,
       variant: result === 'success' ? undefined : 'destructive',
     });
@@ -134,7 +82,7 @@ export default function PagesManagementMobile() {
     window.history.replaceState({}, '', window.location.pathname);
   }, [toast]);
 
-  const { data: pages = [], isLoading } = useQuery<SocialPage[]>({
+  const { data: pages = [], isLoading } = useQuery<ClientSocialPage[]>({
     queryKey: ['/api/pages'],
   });
 
@@ -185,6 +133,9 @@ export default function PagesManagementMobile() {
             </p>
           </div>
 
+          <TokenAlertBanner pages={pages} />
+
+          <ConnectFacebookButton className="w-full min-h-[48px]" />
           <ConnectTiktokButton />
           <AddPageDialog open={dialogOpen} onOpenChange={setDialogOpen} />
           <EditPageDialog page={editingPage} onOpenChange={(open) => !open && setEditingPage(null)} />
@@ -267,32 +218,14 @@ export default function PagesManagementMobile() {
                       ID: {page.pageId}
                     </div>
 
-                    {/* Token expiration status */}
-                    {(() => {
-                      const expiresAt = getConnectionExpiry(page);
-                      const expirationStatus = getTokenExpirationStatus(expiresAt);
-                      return (
-                        <div className={`flex items-center gap-2 text-xs px-3 py-3 rounded-lg ${expirationStatus.bgColor}`}>
-                          <Calendar className="w-4 h-4 flex-shrink-0" />
-                          <div className="flex-1 min-w-0">
-                            <div className="font-medium">
-                              {page.platform === 'tiktok' ? 'Expiration de la connexion' : 'Expiration du token'}
-                            </div>
-                            <div className={`${expirationStatus.color} font-semibold`}>
-                              {expirationStatus.message}
-                            </div>
-                            {expiresAt && (
-                              <div className="text-muted-foreground mt-0.5">
-                                {format(new Date(expiresAt), "d MMMM yyyy", { locale: fr })}
-                              </div>
-                            )}
-                          </div>
-                          {(expirationStatus.status === 'expired' || expirationStatus.status === 'urgent') && (
-                            <AlertTriangle className="w-4 h-4 text-red-600 flex-shrink-0" />
-                          )}
-                        </div>
-                      );
-                    })()}
+                    {/* État du jeton, tel que constaté par le dernier contrôle serveur */}
+                    <TokenHealthPanel page={page} />
+
+                    {page.platform !== 'tiktok' && (
+                      <div className="flex">
+                        <RefreshTokenButton page={page} />
+                      </div>
+                    )}
 
                     <div className="flex items-center gap-2 pt-2">
                       {page.platform === 'tiktok' ? (
@@ -497,7 +430,7 @@ function AddPageDialog({ open, onOpenChange }: { open: boolean; onOpenChange: (o
   );
 }
 
-function EditPageDialog({ page, onOpenChange }: { page: SocialPage | null; onOpenChange: (open: boolean) => void }) {
+function EditPageDialog({ page, onOpenChange }: { page: ClientSocialPage | null; onOpenChange: (open: boolean) => void }) {
   const [accessToken, setAccessToken] = useState('');
   const { toast } = useToast();
 

client/src/pages/mobile/settings.tsx

@@ -47,6 +47,9 @@ export default function SettingsMobile() {
 
   const { data: openrouterModels, isLoading: modelsLoading } = useQuery({
     queryKey: ['/api/openrouter/models'],
+    // Liste servie par un appel sortant vers OpenRouter : elle ne bouge pas d'une
+    // heure à l'autre, inutile de la redemander à chaque retour sur l'onglet.
+    staleTime: 60 * 60 * 1000,
   });
 
   useEffect(() => {

client/src/pages/new-post.tsx

@@ -102,6 +102,16 @@ function SortableMediaItem({
   );
 }
 
+/** Nombre de médias récents proposés à la sélection. */
+const RECENT_MEDIA_COUNT = 12;
+
+/** Minuit, pour que la clé de requête reste stable d'un rendu à l'autre. */
+function startOfToday(): Date {
+  const date = new Date();
+  date.setHours(0, 0, 0, 0);
+  return date;
+}
+
 export default function NewPost() {
   const [sidebarOpen, setSidebarOpen] = useState(false);
   const [, navigate] = useLocation();
@@ -124,8 +134,10 @@ export default function NewPost() {
   });
   const pages = allPages.filter(p => p.platform !== 'tiktok');
 
+  // Seuls les douze derniers médias sont proposés ici : autant ne demander
+  // que ceux-là plutôt que toute la médiathèque.
   const { data: allMedia = [] } = useQuery<Media[]>({
-    queryKey: ['/api/media'],
+    queryKey: ['/api/media', { limit: RECENT_MEDIA_COUNT }],
   });
 
   // Afficher seulement les 12 derniers médias triés par date décroissante
@@ -138,11 +150,13 @@ export default function NewPost() {
         const dateB = b.createdAt ? new Date(b.createdAt).getTime() : 0;
         return dateB - dateA; // Tri décroissant (plus récent en premier)
       })
-      .slice(0, 12);
+      .slice(0, RECENT_MEDIA_COUNT);
   }, [allMedia]);
 
+  // Ne sert qu'à griser les créneaux déjà pris dans le sélecteur de date : le
+  // passé n'a aucune influence sur une planification à venir.
   const { data: scheduledPosts = [] } = useQuery<ScheduledPost[]>({
-    queryKey: ['/api/scheduled-posts'],
+    queryKey: ['/api/scheduled-posts', { startDate: startOfToday().toISOString() }],
   });
 
   const uploadMutation = useMutation({

client/src/pages/pages.tsx

@@ -1,6 +1,6 @@
 import { useEffect, useState } from "react";
 import { useQuery, useMutation } from "@tanstack/react-query";
-import { Plus, Facebook, Instagram, Trash2, RefreshCw, Edit, Bug, Code, Calendar, AlertTriangle } from "lucide-react";
+import { Plus, Facebook, Instagram, Trash2, RefreshCw, Edit, Bug, Code, AlertTriangle } from "lucide-react";
 import { SiTiktok } from "react-icons/si";
 import Sidebar from "@/components/sidebar";
 import TopBar from "@/components/topbar";
@@ -12,84 +12,32 @@ import { Label } from "@/components/ui/label";
 import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select";
 import { useToast } from "@/hooks/use-toast";
 import { apiRequest, queryClient } from "@/lib/queryClient";
-import type { SocialPage } from "@shared/schema";
-import { format } from "date-fns";
-import { fr } from "date-fns/locale";
-
-function getTokenExpirationStatus(expiresAt: string | null | undefined) {
-  if (!expiresAt) {
-    return { 
-      status: 'unknown' as const, 
-      color: 'text-gray-500',
-      bgColor: 'bg-gray-100',
-      daysLeft: null,
-      message: 'Date inconnue'
-    };
-  }
-
-  const now = new Date();
-  const expiration = new Date(expiresAt);
-  const diffTime = expiration.getTime() - now.getTime();
-  const daysLeft = Math.ceil(diffTime / (1000 * 60 * 60 * 24));
-
-  if (daysLeft < 0) {
-    return {
-      status: 'expired' as const,
-      color: 'text-red-600',
-      bgColor: 'bg-red-100',
-      daysLeft,
-      message: 'Expiré'
-    };
-  } else if (daysLeft <= 7) {
-    return {
-      status: 'urgent' as const,
-      color: 'text-red-600',
-      bgColor: 'bg-red-100',
-      daysLeft,
-      message: `${daysLeft} jour${daysLeft > 1 ? 's' : ''} restant${daysLeft > 1 ? 's' : ''}`
-    };
-  } else if (daysLeft <= 15) {
-    return {
-      status: 'warning' as const,
-      color: 'text-orange-600',
-      bgColor: 'bg-orange-100',
-      daysLeft,
-      message: `${daysLeft} jours restants`
-    };
-  } else {
-    return {
-      status: 'good' as const,
-      color: 'text-green-600',
-      bgColor: 'bg-green-100',
-      daysLeft,
-      message: `${daysLeft} jours restants`
-    };
-  }
-}
-
-/**
- * Un compte TikTok n'a pas de "token de page" à surveiller : ce qui compte est la
- * validité de l'autorisation, portée par le refresh token (1 an).
- */
-function getConnectionExpiry(page: SocialPage): string | null {
-  const date = page.platform === 'tiktok' ? page.refreshTokenExpiresAt : page.tokenExpiresAt;
-  return date ? new Date(date).toISOString() : null;
-}
+import type { ClientSocialPage } from "@shared/schema";
+import {
+  ConnectFacebookButton,
+  RefreshTokenButton,
+  TokenAlertBanner,
+  TokenHealthPanel,
+} from "@/components/facebook-token-status";
 
 export default function PagesManagement() {
   const [sidebarOpen, setSidebarOpen] = useState(false);
   const [dialogOpen, setDialogOpen] = useState(false);
-  const [editingPage, setEditingPage] = useState<SocialPage | null>(null);
+  const [editingPage, setEditingPage] = useState<ClientSocialPage | null>(null);
   const { toast } = useToast();
 
-  // Retour du flux d'autorisation TikTok (/api/tiktok/callback redirige ici)
+  // Retour des flux d'autorisation (/api/tiktok/callback et /api/facebook/callback
+  // redirigent ici avec le résultat en paramètre)
   useEffect(() => {
     const params = new URLSearchParams(window.location.search);
-    const result = params.get('tiktok');
-    if (!result) return;
+    const network = params.get('tiktok') ? 'tiktok' : params.get('facebook') ? 'facebook' : null;
+    if (!network) return;
+
+    const result = params.get(network);
+    const label = network === 'tiktok' ? 'TikTok' : 'Facebook';
 
     toast({
-      title: result === 'success' ? 'Compte TikTok connecté' : 'Connexion TikTok impossible',
+      title: result === 'success' ? `${label} connecté` : `Connexion ${label} impossible`,
       description: params.get('message') || undefined,
       variant: result === 'success' ? undefined : 'destructive',
     });
@@ -98,7 +46,7 @@ export default function PagesManagement() {
     window.history.replaceState({}, '', window.location.pathname);
   }, [toast]);
 
-  const { data: pages = [], isLoading } = useQuery<SocialPage[]>({
+  const { data: pages = [], isLoading } = useQuery<ClientSocialPage[]>({
     queryKey: ['/api/pages'],
   });
 
@@ -149,24 +97,29 @@ export default function PagesManagement() {
               </p>
             </div>
             <div className="flex items-center gap-3">
+              <ConnectFacebookButton />
               <ConnectTiktokButton />
               <AddPageDialog open={dialogOpen} onOpenChange={setDialogOpen} />
             </div>
             <EditPageDialog page={editingPage} onOpenChange={(open) => !open && setEditingPage(null)} />
           </div>
 
+          <TokenAlertBanner pages={pages} />
+
           {/* Permissions required notice */}
           <div className="mb-6 p-4 bg-amber-500/10 border border-amber-500/30 rounded-xl flex gap-3">
             <AlertTriangle className="w-5 h-5 text-amber-500 shrink-0 mt-0.5" />
             <div className="text-sm">
-              <p className="font-semibold text-amber-600 dark:text-amber-400 mb-1">Permissions Facebook requises pour la publication vidéo</p>
+              <p className="font-semibold text-amber-600 dark:text-amber-400 mb-1">Connectez vos pages plutôt que de coller un jeton</p>
               <p className="text-muted-foreground mb-2">
-                Le token de page doit inclure : <code className="bg-muted px-1 rounded text-xs">pages_manage_posts</code>{" "}
-                <code className="bg-muted px-1 rounded text-xs">pages_read_engagement</code>{" "}
-                <code className="bg-muted px-1 rounded text-xs">publish_video</code>
+                « Connecter des pages Facebook » récupère les jetons de page via l'autorisation Facebook :
+                ils n'expirent pas et SocialFlow les régénère seul en cas de révocation. Un jeton collé à la
+                main expire au bout de 60 jours et devra être remplacé manuellement.
               </p>
               <p className="text-muted-foreground text-xs">
-                Dans Graph API Explorer → Sélectionnez votre app → Ajoutez ces 3 permissions → Générez un User Token → Échangez via <code className="bg-muted px-1 rounded">/me/accounts</code> pour obtenir le Page Token.
+                Le jeton doit couvrir : <code className="bg-muted px-1 rounded text-xs">pages_manage_posts</code>{" "}
+                <code className="bg-muted px-1 rounded text-xs">pages_read_engagement</code>{" "}
+                <code className="bg-muted px-1 rounded text-xs">publish_video</code>
               </p>
             </div>
           </div>
@@ -246,34 +199,11 @@ export default function PagesManagement() {
                       ID: {page.pageId}
                     </div>
                     
-                    {/* Token expiration status */}
-                    {(() => {
-                      const expiresAt = getConnectionExpiry(page);
-                      const expirationStatus = getTokenExpirationStatus(expiresAt);
-                      return (
-                        <div className={`flex items-center gap-2 text-xs px-3 py-2 rounded-lg ${expirationStatus.bgColor}`}>
-                          <Calendar className="w-4 h-4" />
-                          <div className="flex-1">
-                            <div className="font-medium">
-                              {page.platform === 'tiktok' ? 'Expiration de la connexion' : 'Expiration du token'}
-                            </div>
-                            <div className={`${expirationStatus.color} font-semibold`}>
-                              {expirationStatus.message}
-                            </div>
-                            {expiresAt && (
-                              <div className="text-muted-foreground mt-0.5">
-                                {format(new Date(expiresAt), "d MMMM yyyy", { locale: fr })}
-                              </div>
-                            )}
-                          </div>
-                          {(expirationStatus.status === 'expired' || expirationStatus.status === 'urgent') && (
-                            <AlertTriangle className="w-4 h-4 text-red-600" />
-                          )}
-                        </div>
-                      );
-                    })()}
+                    {/* État du jeton, tel que constaté par le dernier contrôle serveur */}
+                    <TokenHealthPanel page={page} />
 
                     <div className="flex items-center justify-end gap-2 pt-2">
+                      {page.platform !== 'tiktok' && <RefreshTokenButton page={page} />}
                       {page.platform === 'tiktok' ? (
                         // Un token TikTok ne se saisit pas : on repasse par l'autorisation
                         <Button
@@ -495,7 +425,7 @@ function AddPageDialog({ open, onOpenChange }: { open: boolean; onOpenChange: (o
   );
 }
 
-function EditPageDialog({ page, onOpenChange }: { page: SocialPage | null; onOpenChange: (open: boolean) => void }) {
+function EditPageDialog({ page, onOpenChange }: { page: ClientSocialPage | null; onOpenChange: (open: boolean) => void }) {
   const [accessToken, setAccessToken] = useState('');
   const { toast } = useToast();
 

client/src/pages/settings.tsx

@@ -1,5 +1,5 @@
 import { useState, useEffect } from "react";
-import { Settings as SettingsIcon, Bell, Key, Shield, Cloud, Brain, Image, Upload, X, Video, Plug, Mic } from "lucide-react";
+import { Settings as SettingsIcon, Bell, Key, Shield, Cloud, Brain, Image, Upload, X, Video, Plug, Mic, Facebook } from "lucide-react";
 import { useQuery, useMutation } from "@tanstack/react-query";
 import Sidebar from "@/components/sidebar";
 import TopBar from "@/components/topbar";
@@ -32,6 +32,8 @@ export default function Settings() {
   const [ffmpegApiKey, setFfmpegApiKey] = useState("");
   const [externalApiKey, setExternalApiKey] = useState("");
   const [geminiApiKey, setGeminiApiKey] = useState("");
+  const [facebookAppId, setFacebookAppId] = useState("");
+  const [facebookAppSecret, setFacebookAppSecret] = useState("");
   const [tiktokClientKey, setTiktokClientKey] = useState("");
   const [tiktokClientSecret, setTiktokClientSecret] = useState("");
   const { toast } = useToast();
@@ -53,6 +55,9 @@ export default function Settings() {
 
   const { data: openrouterModels, isLoading: modelsLoading } = useQuery({
     queryKey: ['/api/openrouter/models'],
+    // Liste servie par un appel sortant vers OpenRouter : elle ne bouge pas d'une
+    // heure à l'autre, inutile de la redemander à chaque retour sur l'onglet.
+    staleTime: 60 * 60 * 1000,
   });
 
   const { data: ffmpegConfig } = useQuery({
@@ -68,6 +73,16 @@ export default function Settings() {
     queryKey: ['/api/tiktok/config'],
   });
 
+  const { data: facebookConfig } = useQuery<{
+    configured: boolean;
+    appId: string;
+    hasAppSecret: boolean;
+    redirectUri: string;
+    scopes: string[];
+  }>({
+    queryKey: ['/api/facebook/config'],
+  });
+
   const { data: externalApiConfig } = useQuery({
     queryKey: ['/api/settings/external-api'],
     enabled: isAdmin,
@@ -111,6 +126,13 @@ export default function Settings() {
     }
   }, [tiktokConfig]);
 
+  useEffect(() => {
+    if (facebookConfig) {
+      // L'App Secret n'est jamais renvoyé par l'API : il reste vide
+      setFacebookAppId(facebookConfig.appId || "");
+    }
+  }, [facebookConfig]);
+
   useEffect(() => {
     if (geminiConfig) {
       // Don't pre-fill - user must enter key manually
@@ -283,6 +305,32 @@ export default function Settings() {
     },
   });
 
+  const saveFacebookMutation = useMutation({
+    mutationFn: () => {
+      const payload: any = { appId: facebookAppId.trim() };
+      // Le secret n'est envoyé que s'il est saisi : sinon on conserve l'existant
+      if (facebookAppSecret.trim() !== "") {
+        payload.appSecret = facebookAppSecret.trim();
+      }
+      return apiRequest('PUT', '/api/facebook/config', payload);
+    },
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: ['/api/facebook/config'] });
+      setFacebookAppSecret("");
+      toast({
+        title: "Configuration Facebook enregistrée",
+        description: "Les jetons de page se renouvellent désormais automatiquement",
+      });
+    },
+    onError: async (error: any) => {
+      toast({
+        title: "Erreur",
+        description: error?.message || "Impossible d'enregistrer la configuration Facebook",
+        variant: "destructive",
+      });
+    },
+  });
+
   const saveTiktokMutation = useMutation({
     mutationFn: () => {
       const payload: any = { clientKey: tiktokClientKey.trim() };
@@ -802,6 +850,80 @@ export default function Settings() {
               </Card>
             )}
 
+            {isAdmin && (
+              <Card className="rounded-2xl border-border/50 shadow-lg">
+                <CardHeader className="p-6">
+                  <CardTitle className="flex items-center gap-2">
+                    <Facebook className="w-5 h-5" />
+                    Facebook
+                  </CardTitle>
+                  <CardDescription>
+                    Identifiants de votre application Facebook (developers.facebook.com). Ils
+                    permettent de connecter vos pages en un clic et de renouveler leurs jetons
+                    automatiquement, sans jamais recoller un token à la main.
+                  </CardDescription>
+                </CardHeader>
+                <CardContent className="space-y-4">
+                  {facebookConfig?.configured && (
+                    <div className="rounded-lg bg-muted p-3 flex items-center gap-2 text-sm text-green-600 dark:text-green-400">
+                      <Key className="w-4 h-4" />
+                      <span>Application Facebook configurée</span>
+                    </div>
+                  )}
+
+                  <div className="space-y-2">
+                    <Label htmlFor="facebookAppId">App ID</Label>
+                    <Input
+                      id="facebookAppId"
+                      value={facebookAppId}
+                      onChange={(e) => setFacebookAppId(e.target.value)}
+                      placeholder="1234567890123456"
+                    />
+                  </div>
+
+                  <div className="space-y-2">
+                    <Label htmlFor="facebookAppSecret">
+                      {facebookConfig?.hasAppSecret ? "Nouvel App Secret (laisser vide pour conserver l'actuel)" : "App Secret"}
+                    </Label>
+                    <Input
+                      id="facebookAppSecret"
+                      type="password"
+                      value={facebookAppSecret}
+                      onChange={(e) => setFacebookAppSecret(e.target.value)}
+                      placeholder="••••••••••••••••"
+                    />
+                  </div>
+
+                  <div className="space-y-2">
+                    <Label>URI de redirection à déclarer chez Facebook</Label>
+                    <code className="block text-xs bg-muted px-3 py-2 rounded break-all">
+                      {facebookConfig?.redirectUri || `${window.location.origin}/api/facebook/callback`}
+                    </code>
+                    <p className="text-xs text-muted-foreground">
+                      À ajouter dans « Connexion Facebook › Paramètres › URI de redirection OAuth valides ».
+                    </p>
+                  </div>
+
+                  {facebookConfig?.scopes?.length ? (
+                    <div className="space-y-2">
+                      <Label>Permissions demandées</Label>
+                      <p className="text-xs text-muted-foreground break-all">
+                        {facebookConfig.scopes.join(', ')}
+                      </p>
+                    </div>
+                  ) : null}
+
+                  <Button
+                    onClick={() => saveFacebookMutation.mutate()}
+                    disabled={saveFacebookMutation.isPending || !facebookAppId.trim()}
+                    className="w-full"
+                  >
+                    {saveFacebookMutation.isPending ? "Enregistrement..." : "Enregistrer"}
+                  </Button>
+                </CardContent>
+              </Card>
+            )}
+
             {isAdmin && (
               <Card className="rounded-2xl border-border/50 shadow-lg">
                 <CardHeader className="p-6">

server/cron.ts

@@ -15,12 +15,17 @@ export function startTokenCron() {
     });
     console.log('[Cron] TikTok publish status job scheduled (*/2 * * * *).');
 
-    // Run every day at midnight (00:00) — Token health check
-    cron.schedule('0 0 * * *', async () => {
-        console.log('[Cron] Running daily token check...');
-        await TokenManager.checkAndRefreshTokens();
+    // Deux fois par jour (00:00 et 12:00) — contrôle et renouvellement des jetons.
+    // Un jeton révoqué par Meta ne prévient pas : passer deux fois par jour
+    // réduit d'autant la fenêtre pendant laquelle une publication échouerait.
+    cron.schedule('0 0,12 * * *', async () => {
+        console.log('[Cron] Running token check...');
+        const results = await TokenManager.checkAndRefreshTokens();
+        const renewed = results.filter(r => r.renewed).length;
+        const failing = results.filter(r => r.status === 'expired' || r.status === 'error').length;
+        console.log(`[Cron] Token check done: ${results.length} contrôlés, ${renewed} renouvelés, ${failing} en échec.`);
     });
-    console.log('[Cron] Token refresh job scheduled (0 0 * * *).');
+    console.log('[Cron] Token refresh job scheduled (0 0,12 * * *).');
 
     // Run twice daily (08:00 and 20:00) — Analytics sync for all pages
     cron.schedule('0 8,20 * * *', async () => {

server/migrate.ts

@@ -187,6 +187,25 @@ export async function migrate() {
       ADD COLUMN IF NOT EXISTS "avatar_url" text;
     `);
 
+    // facebook_config (application développeur Facebook, globale)
+    await client.query(`
+      CREATE TABLE IF NOT EXISTS "facebook_config" (
+        "id" varchar PRIMARY KEY DEFAULT gen_random_uuid() NOT NULL,
+        "app_id" text NOT NULL,
+        "app_secret" text NOT NULL,
+        "created_at" timestamp DEFAULT now(),
+        "updated_at" timestamp DEFAULT now()
+      );
+    `);
+
+    // social_pages : renouvellement automatique des tokens Facebook
+    await client.query(`
+      ALTER TABLE "social_pages"
+      ADD COLUMN IF NOT EXISTS "user_access_token" text,
+      ADD COLUMN IF NOT EXISTS "user_token_expires_at" timestamp,
+      ADD COLUMN IF NOT EXISTS "token_error" text;
+    `);
+
     // scheduled_posts : suivi de la publication asynchrone TikTok
     await client.query(`
       ALTER TABLE "scheduled_posts"
@@ -194,6 +213,53 @@ export async function migrate() {
       ADD COLUMN IF NOT EXISTS "publish_status" text;
     `);
 
+    // 4. Index de performance
+    //
+    // Postgres n'indexe pas les clés étrangères tout seul : sans ces index, le
+    // calendrier, l'historique et le scheduler faisaient des parcours complets
+    // de table à chaque appel. Ils existaient dans migration-docker.sql, qui
+    // n'est monté nulle part — ce fichier-ci est le seul exécuté au démarrage.
+    //
+    // Chaque index est créé isolément : une table absente sur une vieille
+    // installation ne doit pas empêcher la création des suivants.
+    const indexes: [string, string][] = [
+      // Filtres par propriétaire
+      ["idx_posts_user_id", `CREATE INDEX IF NOT EXISTS "idx_posts_user_id" ON "posts" ("user_id")`],
+      ["idx_media_user_id", `CREATE INDEX IF NOT EXISTS "idx_media_user_id" ON "media" ("user_id")`],
+      ["idx_social_pages_user_id", `CREATE INDEX IF NOT EXISTS "idx_social_pages_user_id" ON "social_pages" ("user_id")`],
+      ["idx_ai_generations_user_id", `CREATE INDEX IF NOT EXISTS "idx_ai_generations_user_id" ON "ai_generations" ("user_id")`],
+
+      // Jointures
+      ["idx_scheduled_posts_post_id", `CREATE INDEX IF NOT EXISTS "idx_scheduled_posts_post_id" ON "scheduled_posts" ("post_id")`],
+      ["idx_post_media_post_id", `CREATE INDEX IF NOT EXISTS "idx_post_media_post_id" ON "post_media" ("post_id")`],
+      ["idx_post_media_media_id", `CREATE INDEX IF NOT EXISTS "idx_post_media_media_id" ON "post_media" ("media_id")`],
+      ["idx_post_analytics_post_id", `CREATE INDEX IF NOT EXISTS "idx_post_analytics_post_id" ON "post_analytics" ("post_id")`],
+      ["idx_page_analytics_history_page_date", `CREATE INDEX IF NOT EXISTS "idx_page_analytics_history_page_date" ON "page_analytics_history" ("page_id", "date")`],
+      ["idx_user_page_permissions_user_id", `CREATE INDEX IF NOT EXISTS "idx_user_page_permissions_user_id" ON "user_page_permissions" ("user_id")`],
+      ["idx_user_page_permissions_page_id", `CREATE INDEX IF NOT EXISTS "idx_user_page_permissions_page_id" ON "user_page_permissions" ("page_id")`],
+
+      // Calendrier et historique : « les publications de ces pages, sur cette période »
+      ["idx_scheduled_posts_page_scheduled_at", `CREATE INDEX IF NOT EXISTS "idx_scheduled_posts_page_scheduled_at" ON "scheduled_posts" ("page_id", "scheduled_at")`],
+
+      // Scheduler (toutes les minutes) : seules les publications non encore
+      // traitées comptent, d'où un index partiel qui reste minuscule.
+      ["idx_scheduled_posts_pending", `CREATE INDEX IF NOT EXISTS "idx_scheduled_posts_pending" ON "scheduled_posts" ("scheduled_at") WHERE "published_at" IS NULL`],
+
+      // Suivi asynchrone TikTok (toutes les deux minutes)
+      ["idx_scheduled_posts_publish_id", `CREATE INDEX IF NOT EXISTS "idx_scheduled_posts_publish_id" ON "scheduled_posts" ("publish_id") WHERE "publish_id" IS NOT NULL`],
+
+      // Reels en cours de génération
+      ["idx_posts_generation_status", `CREATE INDEX IF NOT EXISTS "idx_posts_generation_status" ON "posts" ("generation_status") WHERE "generation_status" IS NOT NULL`],
+    ];
+
+    for (const [name, statement] of indexes) {
+      try {
+        await client.query(statement);
+      } catch (error) {
+        console.warn(`[Migration] Index ${name} non créé:`, error instanceof Error ? error.message : error);
+      }
+    }
+
     console.log("[Migration] Safe migration completed.");
   } catch (error) {
     console.error("[Migration] Error during migration:", error);

server/routes.ts

@@ -18,6 +18,7 @@ import { reelsRouter } from "./routes/reels";
 import { remotionRouter } from "./routes/remotion";
 import { externalRouter } from "./routes/external";
 import { tiktokRouter } from "./routes/tiktok";
+import { facebookRouter } from "./routes/facebook";
 import { legalRouter } from "./routes/legal";
 import { insertAudioTrackSchema } from "@shared/schema";
 import * as musicMetadata from "music-metadata";
@@ -110,6 +111,20 @@ function requireAdmin(req: Request, res: Response, next: NextFunction) {
   next();
 }
 
+/** Convertit un paramètre de requête en entier positif, ou `undefined`. */
+function parsePositiveInt(value: unknown): number | undefined {
+  if (typeof value !== "string" || value === "") return undefined;
+  const parsed = Number.parseInt(value, 10);
+  return Number.isFinite(parsed) && parsed >= 0 ? parsed : undefined;
+}
+
+/** Convertit un paramètre de requête en date, ou `undefined` s'il est inutilisable. */
+function parseDateParam(value: unknown): Date | undefined {
+  if (typeof value !== "string" || value === "") return undefined;
+  const date = new Date(value);
+  return Number.isNaN(date.getTime()) ? undefined : date;
+}
+
 export async function registerRoutes(app: Express): Promise<Server> {
 
 
@@ -475,6 +490,7 @@ export async function registerRoutes(app: Express): Promise<Server> {
 
   // TikTok Routes (OAuth multi-comptes) — avant le routeur Reels monté sur /api
   app.use("/api/tiktok", requireAuth, tiktokRouter);
+  app.use("/api/facebook", requireAuth, facebookRouter);
 
   // Reels & Music Routes
   app.use("/api", requireAuth, reelsRouter);
@@ -542,39 +558,28 @@ export async function registerRoutes(app: Express): Promise<Server> {
       const user = req.user as User;
       const userId = user.id;
 
-      const posts = await storage.getPosts(userId);
-      const pages = await storage.getSocialPages(userId);
-      const media = await storage.getMedia(userId);
-      const aiGenerations = await storage.getAiGenerations(userId);
-
-      // Statistiques actuelles
-      const scheduledPosts = posts.filter(p => p.status === "scheduled").length;
-      const currentAiTexts = aiGenerations.length;
-      const currentMedia = media.length;
-
       // Calculer les statistiques de la période précédente (hier pour les textes IA, mois dernier pour les posts)
       const now = new Date();
       const yesterday = new Date(now);
       yesterday.setDate(yesterday.getDate() - 1);
       yesterday.setHours(0, 0, 0, 0);
 
+      const today = new Date(yesterday);
+      today.setDate(today.getDate() + 1);
+
       const lastMonth = new Date(now);
       lastMonth.setMonth(lastMonth.getMonth() - 1);
 
-      // Textes IA générés hier
-      const aiTextsYesterday = aiGenerations.filter(gen => {
-        if (!gen.createdAt) return false;
-        const genDate = new Date(gen.createdAt);
-        genDate.setHours(0, 0, 0, 0);
-        return genDate.getTime() === yesterday.getTime();
-      }).length;
+      const stats = await storage.getDashboardStats(userId, {
+        yesterdayStart: yesterday,
+        yesterdayEnd: today,
+        lastMonth,
+      });
 
-      // Posts planifiés le mois dernier
-      const scheduledPostsLastMonth = posts.filter(p => {
-        if (!p.createdAt) return false;
-        const createdDate = new Date(p.createdAt);
-        return p.status === "scheduled" && createdDate < lastMonth;
-      }).length;
+      const scheduledPosts = stats.scheduledPosts;
+      const scheduledPostsLastMonth = stats.scheduledPostsLastMonth;
+      const currentAiTexts = stats.aiTextsGenerated;
+      const aiTextsYesterday = stats.aiTextsYesterday;
 
       // Calculer les variations en pourcentage
       const aiTextChange = aiTextsYesterday > 0
@@ -589,11 +594,11 @@ export async function registerRoutes(app: Express): Promise<Server> {
         scheduledPosts,
         scheduledPostsChange: scheduledPostsChange > 0 ? `+${scheduledPostsChange}%` : `${scheduledPostsChange}%`,
         scheduledPostsTrending: scheduledPostsChange >= 0 ? "up" : "down",
-        connectedPages: pages.length,
+        connectedPages: stats.connectedPages,
         aiTextsGenerated: currentAiTexts,
         aiTextsChange: aiTextChange > 0 ? `+${aiTextChange}%` : `${aiTextChange}%`,
         aiTextsTrending: aiTextChange >= 0 ? "up" : "down",
-        mediaStored: media.length,
+        mediaStored: stats.mediaStored,
       });
     } catch (error) {
       console.error("Error fetching stats:", error);
@@ -721,7 +726,19 @@ export async function registerRoutes(app: Express): Promise<Server> {
     try {
       const user = req.user as User;
       const userId = user.id;
-      const media = await storage.getMedia(userId);
+
+      // Sans paramètre, la médiathèque entière est renvoyée comme avant : les
+      // écrans qui doivent retrouver un média par son identifiant en dépendent.
+      const limit = parsePositiveInt(req.query.limit);
+      const offset = parsePositiveInt(req.query.offset);
+      const media = await storage.getMedia(userId, { limit, offset });
+
+      // Le total permet à l'appelant paginé de savoir s'il reste des pages —
+      // et à la médiathèque d'afficher un compteur juste sans tout charger.
+      if (limit !== undefined) {
+        res.setHeader("X-Total-Count", String(await storage.getMediaCount(userId)));
+      }
+
       res.json(media);
     } catch (error) {
       console.error("Error fetching media:", error);
@@ -1413,16 +1430,15 @@ export async function registerRoutes(app: Express): Promise<Server> {
       const userId = user.id;
       const { startDate, endDate } = req.query;
 
-      const start = startDate ? new Date(startDate as string) : undefined;
-      const end = endDate ? new Date(endDate as string) : undefined;
+      // Une date illisible est ignorée plutôt que transmise telle quelle à SQL.
+      const start = parseDateParam(startDate);
+      const end = parseDateParam(endDate);
 
       let scheduledPosts;
 
       if (user.role === 'admin') {
         // Admin voit tous les posts programmés - on récupère toutes les pages
-        const allPages = await storage.getAllUsers().then(users =>
-          Promise.all(users.map(u => storage.getSocialPages(u.id)))
-        ).then(pagesArrays => pagesArrays.flat());
+        const allPages = await storage.getAllSocialPages();
         const allPageIds = allPages.map(p => p.id);
 
         if (allPageIds.length > 0) {
@@ -1553,6 +1569,19 @@ export async function registerRoutes(app: Express): Promise<Server> {
   });
 
   // Social pages
+
+  /**
+   * Vue client d'une page : sans jetons, avec un indicateur de renouvellement
+   * automatique (vrai quand un jeton utilisateur longue durée est enregistré).
+   */
+  function toClientPage(page: SocialPage) {
+    const { accessToken, userAccessToken, refreshToken, ...safe } = page;
+    return {
+      ...safe,
+      autoRenew: page.platform === 'tiktok' ? !!refreshToken : !!userAccessToken,
+    };
+  }
+
   app.get("/api/pages", requireAuth, async (req, res) => {
     try {
       const user = req.user as User;
@@ -1562,17 +1591,15 @@ export async function registerRoutes(app: Express): Promise<Server> {
 
       if (user.role === 'admin') {
         // Les admins voient toutes les pages de tous les utilisateurs
-        const allUsers = await storage.getAllUsers();
-        const allPages = await Promise.all(
-          allUsers.map(u => storage.getSocialPages(u.id))
-        );
-        pages = allPages.flat();
+        pages = await storage.getAllSocialPages();
       } else {
         // Les utilisateurs normaux voient uniquement les pages auxquelles ils ont accès
         pages = await storage.getUserAccessiblePages(userId);
       }
 
-      res.json(pages);
+      // Les jetons n'ont rien à faire dans le navigateur : on ne renvoie que
+      // l'information dont l'UI a besoin, dont la capacité à se renouveler seule.
+      res.json(pages.map(toClientPage));
     } catch (error) {
       console.error("Error fetching pages:", error);
       res.status(500).json({ error: "Failed to fetch pages" });
@@ -1602,7 +1629,7 @@ export async function registerRoutes(app: Express): Promise<Server> {
         tokenExpiresAt
       });
       const page = await storage.createSocialPage(pageData);
-      res.json(page);
+      res.json(toClientPage(page));
     } catch (error) {
       console.error("Error creating page:", error);
       res.status(500).json({ error: "Failed to create page" });
@@ -1638,7 +1665,7 @@ export async function registerRoutes(app: Express): Promise<Server> {
       }
 
       const updatedPage = await storage.updateSocialPage(pageId, pageData);
-      res.json(updatedPage);
+      res.json(toClientPage(updatedPage));
     } catch (error) {
       console.error("Error updating page:", error);
       res.status(500).json({ error: "Failed to update page" });

server/routes/external.ts

@@ -270,9 +270,7 @@ router.get("/posts", async (req, res) => {
       }
       pageIds = [pageId];
     } else {
-      const users = await storage.getAllUsers();
-      const allPages = await Promise.all(users.map(u => storage.getSocialPages(u.id)));
-      pageIds = allPages.flat().map(p => p.id);
+      pageIds = (await storage.getAllSocialPages()).map(p => p.id);
     }
 
     if (pageIds.length === 0) {
@@ -312,19 +310,20 @@ router.get("/posts", async (req, res) => {
       if (post.status !== postStatus && postStatus !== "all") continue;
 
       if (!postMap.has(post.id)) {
-        // Récupérer les médias du post
+        // Récupérer les médias du post, en une requête plutôt qu'une par média
         const postMediaLinks = await storage.getPostMedia(post.id);
-        const mediaItems: Array<{ id: string; url: string; type: string }> = [];
-        for (const link of postMediaLinks) {
-          const mediaItem = await storage.getMediaById(link.mediaId);
-          if (mediaItem) {
-            mediaItems.push({
-              id: mediaItem.id,
-              url: mediaItem.originalUrl,
-              type: mediaItem.type,
-            });
-          }
-        }
+        const byId = new Map(
+          (await storage.getMediaByIds(postMediaLinks.map(link => link.mediaId)))
+            .map(item => [item.id, item])
+        );
+        const mediaItems = postMediaLinks
+          .map(link => byId.get(link.mediaId))
+          .filter((item): item is NonNullable<typeof item> => item !== undefined)
+          .map(item => ({
+            id: item.id,
+            url: item.originalUrl,
+            type: item.type,
+          }));
 
         postMap.set(post.id, {
           id: post.id,

server/routes/facebook.ts

@@ -0,0 +1,300 @@
+/**
+ * Connexion et renouvellement des pages Facebook / Instagram.
+ *
+ * Une page connectée ici embarque le jeton utilisateur longue durée qui a servi
+ * à l'obtenir : c'est ce qui permet au `TokenManager` de régénérer son jeton de
+ * page tout seul, au lieu d'exiger un copier-coller depuis le Graph Explorer
+ * tous les deux mois.
+ */
+
+import crypto from 'crypto';
+import { Router, Request, Response } from 'express';
+import type { User } from '@shared/schema';
+import { storage } from '../storage';
+import { facebookOAuthService } from '../services/facebook_oauth';
+import { TokenManager } from '../services/token_manager';
+import { encrypt } from '../utils/encryption';
+import { insertFacebookConfigSchema, updateFacebookConfigSchema } from '@shared/schema';
+
+export const facebookRouter = Router();
+
+/** Page vers laquelle on renvoie le navigateur à la fin du flux OAuth. */
+const RETURN_PATH = '/pages';
+
+function isAdmin(req: Request): boolean {
+  const user = req.user as User | undefined;
+  return user?.role === 'admin';
+}
+
+function buildReturnUrl(status: 'success' | 'error', message: string): string {
+  const params = new URLSearchParams({ facebook: status, message });
+  return `${RETURN_PATH}?${params.toString()}`;
+}
+
+/**
+ * État de la configuration Facebook.
+ * L'App Secret n'est jamais renvoyé au client.
+ */
+facebookRouter.get('/config', async (req: Request, res: Response) => {
+  try {
+    const config = await storage.getFacebookConfig();
+    const configured = await facebookOAuthService.isConfigured();
+
+    // Tout le monde a besoin de savoir si la connexion est possible ; seuls les
+    // admins voient les détails de l'application développeur.
+    if (!isAdmin(req)) {
+      return res.json({ configured });
+    }
+
+    res.json({
+      configured,
+      appId: config?.appId || (process.env.FACEBOOK_APP_ID ? "(défini par variable d'environnement)" : ''),
+      hasAppSecret: !!(config?.appSecret || process.env.FACEBOOK_APP_SECRET),
+      redirectUri: facebookOAuthService.getRedirectUri(),
+      scopes: facebookOAuthService.getScopes().split(','),
+    });
+  } catch (error) {
+    console.error('❌ [Facebook] Erreur lecture configuration:', error);
+    res.status(500).json({ error: 'Impossible de lire la configuration Facebook' });
+  }
+});
+
+/** Enregistre les identifiants de l'application Facebook (admin). */
+facebookRouter.put('/config', async (req: Request, res: Response) => {
+  try {
+    if (!isAdmin(req)) {
+      return res.status(403).json({ error: 'Accès refusé. Réservé aux administrateurs.' });
+    }
+
+    const existing = await storage.getFacebookConfig();
+    // Le secret peut être omis lors d'une mise à jour : on garde l'existant
+    const schema = existing ? updateFacebookConfigSchema : insertFacebookConfigSchema;
+    const data = schema.parse(req.body);
+
+    const config = await storage.upsertFacebookConfig(data);
+
+    res.json({
+      success: true,
+      appId: config.appId,
+      redirectUri: facebookOAuthService.getRedirectUri(),
+    });
+  } catch (error: any) {
+    console.error('❌ [Facebook] Erreur enregistrement configuration:', error);
+    res.status(400).json({
+      error: error?.errors?.[0]?.message || error?.message || 'Configuration Facebook invalide',
+    });
+  }
+});
+
+/**
+ * Démarre la connexion des pages Facebook.
+ * À appeler par navigation complète du navigateur (window.location), pas en fetch.
+ */
+facebookRouter.get('/connect', async (req: Request, res: Response) => {
+  try {
+    if (!(await facebookOAuthService.isConfigured())) {
+      return res.redirect(
+        buildReturnUrl('error', "Facebook n'est pas configuré. Renseignez d'abord l'App ID et l'App Secret.")
+      );
+    }
+
+    // Protection CSRF : l'état est vérifié au retour
+    const state = crypto.randomBytes(16).toString('hex');
+    (req.session as any).facebookOAuthState = state;
+
+    const authUrl = await facebookOAuthService.buildAuthorizationUrl(state);
+
+    // La session doit être écrite avant la redirection, sinon l'état est perdu
+    req.session.save((err) => {
+      if (err) {
+        console.error('❌ [Facebook] Impossible de sauvegarder la session OAuth:', err);
+        return res.redirect(buildReturnUrl('error', 'Erreur de session, réessayez.'));
+      }
+      res.redirect(authUrl);
+    });
+  } catch (error) {
+    console.error('❌ [Facebook] Erreur démarrage OAuth:', error);
+    res.redirect(
+      buildReturnUrl('error', error instanceof Error ? error.message : 'Erreur de connexion Facebook')
+    );
+  }
+});
+
+/**
+ * Retour d'autorisation Facebook : échange le code contre un jeton utilisateur
+ * longue durée, puis crée ou met à jour chaque page administrée.
+ */
+facebookRouter.get('/callback', async (req: Request, res: Response) => {
+  const user = req.user as User;
+  const { code, state, error: oauthError, error_description: oauthErrorDescription } = req.query;
+
+  try {
+    if (oauthError) {
+      const description = (oauthErrorDescription as string) || (oauthError as string);
+      return res.redirect(buildReturnUrl('error', `Autorisation Facebook refusée : ${description}`));
+    }
+
+    const expectedState = (req.session as any)?.facebookOAuthState;
+    delete (req.session as any)?.facebookOAuthState;
+
+    if (!state || !expectedState || state !== expectedState) {
+      return res.redirect(buildReturnUrl('error', 'Requête de connexion Facebook invalide (état non reconnu).'));
+    }
+
+    if (!code || typeof code !== 'string') {
+      return res.redirect(buildReturnUrl('error', "Aucun code d'autorisation reçu de Facebook."));
+    }
+
+    const userToken = await facebookOAuthService.exchangeCodeForUserToken(code);
+    const targets = await facebookOAuthService.listPages(userToken.accessToken);
+
+    if (targets.length === 0) {
+      return res.redirect(
+        buildReturnUrl(
+          'error',
+          "Aucune page Facebook administrée par ce compte. Connectez-vous avec un compte administrateur de la page."
+        )
+      );
+    }
+
+    // Le jeton utilisateur est la clé du renouvellement automatique : il est
+    // conservé chiffré, sur chaque page issue de cette autorisation.
+    const encryptedUserToken = encrypt(userToken.accessToken);
+    const existingPages = await storage.getSocialPages(user.id);
+
+    let created = 0;
+    let updated = 0;
+
+    for (const target of targets) {
+      const existing = existingPages.find(
+        (page) => page.platform === 'facebook' && page.pageId === target.id
+      );
+
+      if (existing) {
+        await storage.updateSocialPage(existing.id, {
+          pageName: target.name,
+          accessToken: target.accessToken,
+          // Un jeton de page dérivé d'un jeton utilisateur longue durée n'expire pas.
+          tokenExpiresAt: null,
+          userAccessToken: encryptedUserToken,
+          userTokenExpiresAt: userToken.expiresAt,
+          followersCount: target.followersCount,
+          tokenStatus: 'valid',
+          tokenError: null,
+          lastTokenCheck: new Date(),
+          isActive: 'true',
+        });
+        updated++;
+        continue;
+      }
+
+      const page = await storage.createSocialPage({
+        userId: user.id,
+        platform: 'facebook',
+        pageId: target.id,
+        pageName: target.name,
+        accessToken: target.accessToken,
+        tokenExpiresAt: null,
+        userAccessToken: encryptedUserToken,
+        userTokenExpiresAt: userToken.expiresAt,
+        followersCount: target.followersCount,
+        isActive: 'true',
+      });
+      created++;
+
+      // Les non-admins ne voient que les pages qui leur sont explicitement
+      // attribuées : sans cette permission, ils ne verraient pas leur propre page.
+      if (user.role !== 'admin') {
+        try {
+          await storage.createPagePermission({ userId: user.id, pageId: page.id });
+        } catch (permissionError) {
+          console.error('⚠️ [Facebook] Impossible de créer la permission de page:', permissionError);
+        }
+      }
+    }
+
+    // Un compte Instagram professionnel publie avec le jeton de la page Facebook
+    // à laquelle il est rattaché : on le rafraîchit dans la foulée, sans quoi il
+    // resterait sur un jeton saisi à la main, condamné à expirer.
+    for (const page of existingPages) {
+      if (page.platform !== 'instagram') continue;
+      const linked = targets.find((target) => target.instagram?.id === page.pageId);
+      if (!linked) continue;
+
+      await storage.updateSocialPage(page.id, {
+        accessToken: linked.accessToken,
+        tokenExpiresAt: null,
+        userAccessToken: encryptedUserToken,
+        userTokenExpiresAt: userToken.expiresAt,
+        tokenStatus: 'valid',
+        tokenError: null,
+        lastTokenCheck: new Date(),
+      });
+      updated++;
+    }
+
+    const summary = [
+      created > 0 ? `${created} page${created > 1 ? 's' : ''} connectée${created > 1 ? 's' : ''}` : null,
+      updated > 0 ? `${updated} page${updated > 1 ? 's' : ''} mise${updated > 1 ? 's' : ''} à jour` : null,
+    ]
+      .filter(Boolean)
+      .join(', ');
+
+    console.log(`✅ [Facebook] ${summary} pour ${user.username}`);
+    res.redirect(
+      buildReturnUrl('success', `${summary}. Les jetons se renouvellent désormais automatiquement.`)
+    );
+  } catch (error) {
+    console.error('❌ [Facebook] Erreur callback OAuth:', error);
+    res.redirect(
+      buildReturnUrl('error', error instanceof Error ? error.message : 'Connexion Facebook impossible')
+    );
+  }
+});
+
+/** Contrôle (et renouvelle si besoin) le jeton d'une page à la demande. */
+facebookRouter.post('/pages/:id/refresh', async (req: Request, res: Response) => {
+  try {
+    const user = req.user as User;
+    const page = await storage.getSocialPage(req.params.id);
+
+    if (!page) {
+      return res.status(404).json({ error: 'Page non trouvée' });
+    }
+
+    if (user.role !== 'admin' && page.userId !== user.id) {
+      const accessible = await storage.getUserAccessiblePages(user.id);
+      if (!accessible.some((p) => p.id === page.id)) {
+        return res.status(403).json({ error: 'Accès refusé à cette page' });
+      }
+    }
+
+    const result = await TokenManager.checkPage(page.id);
+    res.json(result);
+  } catch (error) {
+    console.error('❌ [Facebook] Erreur renouvellement du jeton:', error);
+    res.status(502).json({
+      error: error instanceof Error ? error.message : 'Impossible de contrôler le jeton',
+    });
+  }
+});
+
+/** Relance le contrôle de toutes les pages (admin). */
+facebookRouter.post('/tokens/check', async (req: Request, res: Response) => {
+  try {
+    if (!isAdmin(req)) {
+      return res.status(403).json({ error: 'Accès refusé. Réservé aux administrateurs.' });
+    }
+
+    const results = await TokenManager.checkAndRefreshTokens();
+    res.json({
+      checked: results.length,
+      renewed: results.filter((r) => r.renewed).length,
+      failing: results.filter((r) => r.status === 'expired' || r.status === 'error').length,
+      results,
+    });
+  } catch (error) {
+    console.error('❌ [Facebook] Erreur contrôle global des jetons:', error);
+    res.status(500).json({ error: 'Contrôle des jetons impossible' });
+  }
+});

server/routes/reels.ts

@@ -898,10 +898,7 @@ reelsRouter.get('/reels/config', async (req: Request, res: Response) => {
 reelsRouter.get('/reels/ongoing', async (req: Request, res: Response) => {
     try {
         const user = req.user as User;
-        const allPosts = await storage.getPosts(user.id);
-        const ongoing = allPosts.filter(
-            (p) => p.generationStatus === 'processing' || p.generationStatus === 'pending'
-        );
+        const ongoing = await storage.getOngoingReelPosts(user.id);
         res.json(ongoing);
     } catch (error) {
         console.error('❌ Error fetching ongoing reels:', error);

server/services/facebook_oauth.ts

@@ -0,0 +1,289 @@
+/**
+ * Renouvellement des tokens Facebook.
+ *
+ * Le problème que ce service résout : un token de page saisi à la main finit
+ * toujours par mourir (60 jours pour un token issu du Graph Explorer, ou du
+ * jour au lendemain si le mot de passe change, si l'utilisateur perd son rôle
+ * d'admin, ou si Meta révoque l'autorisation) — et on ne l'apprend qu'au
+ * moment où une publication échoue.
+ *
+ * La parade est celle recommandée par Meta :
+ *   1. l'utilisateur autorise l'application (OAuth) ;
+ *   2. le code est échangé contre un token utilisateur court ;
+ *   3. ce token court est échangé contre un token utilisateur longue durée
+ *      (~60 jours) — c'est lui que l'on conserve, chiffré ;
+ *   4. les tokens de page dérivés d'un token utilisateur longue durée
+ *      n'expirent pas.
+ *
+ * Conserver le token utilisateur permet de régénérer un token de page sans
+ * intervention humaine, et de prolonger le token utilisateur lui-même avant
+ * son échéance : tant que l'utilisateur ne retire pas son autorisation, la
+ * chaîne se renouvelle toute seule.
+ */
+
+import { storage } from '../storage';
+
+const GRAPH_VERSION = process.env.FACEBOOK_GRAPH_VERSION?.trim() || 'v19.0';
+const GRAPH_URL = `https://graph.facebook.com/${GRAPH_VERSION}`;
+
+/** Permissions nécessaires pour publier et lire les statistiques d'une page. */
+const DEFAULT_SCOPES = [
+  'pages_show_list',
+  'pages_manage_posts',
+  'pages_read_engagement',
+  'pages_manage_engagement',
+  'read_insights',
+  'business_management',
+  'instagram_basic',
+  'instagram_content_publish',
+].join(',');
+
+export interface FacebookLongLivedToken {
+  accessToken: string;
+  /** Nul quand Facebook ne renvoie pas d'échéance (jeton sans expiration). */
+  expiresAt: Date | null;
+}
+
+export interface FacebookPageTarget {
+  id: string;
+  name: string;
+  accessToken: string;
+  followersCount: number;
+  /** Compte Instagram professionnel rattaché à la page, s'il existe. */
+  instagram: { id: string; name: string } | null;
+}
+
+/** Résultat de /debug_token : ce que Meta sait vraiment du jeton. */
+export interface FacebookTokenInfo {
+  isValid: boolean;
+  /** Nul = n'expire pas (cas normal d'un token de page). */
+  expiresAt: Date | null;
+  scopes: string[];
+  error: string | null;
+}
+
+export class FacebookAuthError extends Error {
+  constructor(message: string) {
+    super(message);
+    this.name = 'FacebookAuthError';
+  }
+}
+
+export class FacebookOAuthService {
+  /**
+   * Identifiants de l'application Facebook (globaux à l'instance).
+   * La base prime sur les variables d'environnement.
+   */
+  private async getCredentials(): Promise<{ appId: string; appSecret: string }> {
+    const config = await storage.getFacebookConfig();
+
+    const appId = config?.appId || process.env.FACEBOOK_APP_ID;
+    const appSecret = config?.appSecret || process.env.FACEBOOK_APP_SECRET;
+
+    if (!appId || !appSecret) {
+      throw new FacebookAuthError(
+        "Facebook n'est pas configuré. Renseignez l'App ID et l'App Secret de " +
+        'votre application Facebook dans les paramètres.'
+      );
+    }
+
+    return { appId, appSecret };
+  }
+
+  async isConfigured(): Promise<boolean> {
+    try {
+      await this.getCredentials();
+      return true;
+    } catch {
+      return false;
+    }
+  }
+
+  getRedirectUri(): string {
+    if (process.env.FACEBOOK_REDIRECT_URI) {
+      return process.env.FACEBOOK_REDIRECT_URI;
+    }
+    const base = (process.env.APP_URL || 'http://localhost:5555').replace(/\/$/, '');
+    return `${base}/api/facebook/callback`;
+  }
+
+  getScopes(): string {
+    return process.env.FACEBOOK_SCOPES || DEFAULT_SCOPES;
+  }
+
+  /** URL d'autorisation à ouvrir pour connecter les pages d'un compte Facebook. */
+  async buildAuthorizationUrl(state: string): Promise<string> {
+    const { appId } = await this.getCredentials();
+
+    const params = new URLSearchParams({
+      client_id: appId,
+      redirect_uri: this.getRedirectUri(),
+      state,
+      scope: this.getScopes(),
+      response_type: 'code',
+    });
+
+    return `https://www.facebook.com/${GRAPH_VERSION}/dialog/oauth?${params.toString()}`;
+  }
+
+  /**
+   * Échange le code d'autorisation contre un token utilisateur **longue durée**.
+   * L'étape intermédiaire (token court) n'est jamais conservée : seul le token
+   * longue durée rend les tokens de page permanents.
+   */
+  async exchangeCodeForUserToken(code: string): Promise<FacebookLongLivedToken> {
+    const { appId, appSecret } = await this.getCredentials();
+
+    const shortLived = await this.graphGet<{ access_token?: string }>('/oauth/access_token', {
+      client_id: appId,
+      client_secret: appSecret,
+      redirect_uri: this.getRedirectUri(),
+      code,
+    }, "échange du code d'autorisation");
+
+    if (!shortLived.access_token) {
+      throw new FacebookAuthError('Facebook n\'a pas renvoyé de jeton pour ce code d\'autorisation.');
+    }
+
+    return this.extendUserToken(shortLived.access_token);
+  }
+
+  /**
+   * Prolonge un token utilisateur. Appelé au retour d'OAuth (token court →
+   * ~60 jours) mais aussi périodiquement : ré-échanger un token longue durée
+   * encore valide repart pour 60 jours, ce qui évite la reconnexion manuelle.
+   */
+  async extendUserToken(userToken: string): Promise<FacebookLongLivedToken> {
+    const { appId, appSecret } = await this.getCredentials();
+
+    const longLived = await this.graphGet<{ access_token?: string; expires_in?: number }>(
+      '/oauth/access_token',
+      {
+        grant_type: 'fb_exchange_token',
+        client_id: appId,
+        client_secret: appSecret,
+        fb_exchange_token: userToken,
+      },
+      'prolongation du jeton utilisateur'
+    );
+
+    if (!longLived.access_token) {
+      throw new FacebookAuthError("Facebook n'a pas renvoyé de jeton longue durée.");
+    }
+
+    return {
+      accessToken: longLived.access_token,
+      // expires_in absent ou nul = jeton sans expiration connue.
+      expiresAt: longLived.expires_in
+        ? new Date(Date.now() + longLived.expires_in * 1000)
+        : null,
+    };
+  }
+
+  /**
+   * Pages administrées par le compte, avec leur token de page.
+   * Ces tokens sont permanents lorsqu'ils dérivent d'un token utilisateur
+   * longue durée : c'est le cœur du renouvellement automatique.
+   */
+  async listPages(userToken: string): Promise<FacebookPageTarget[]> {
+    const response = await this.graphGet<{
+      data?: {
+        id: string;
+        name: string;
+        access_token: string;
+        fan_count?: number;
+        followers_count?: number;
+        instagram_business_account?: { id: string; name?: string; username?: string };
+      }[];
+    }>(
+      '/me/accounts',
+      {
+        fields: 'id,name,access_token,fan_count,followers_count,instagram_business_account{id,name,username}',
+        limit: '200',
+        access_token: userToken,
+      },
+      'récupération des pages'
+    );
+
+    return (response.data ?? []).map((page) => ({
+      id: page.id,
+      name: page.name,
+      accessToken: page.access_token,
+      followersCount: page.followers_count ?? page.fan_count ?? 0,
+      instagram: page.instagram_business_account
+        ? {
+            id: page.instagram_business_account.id,
+            name:
+              page.instagram_business_account.username ||
+              page.instagram_business_account.name ||
+              page.name,
+          }
+        : null,
+    }));
+  }
+
+  /**
+   * Interroge Meta sur l'état réel d'un jeton. Un simple appel /me ne dit pas
+   * quand le jeton expire : /debug_token le dit, ce qui permet de renouveler
+   * *avant* la panne plutôt qu'après.
+   */
+  async inspectToken(token: string): Promise<FacebookTokenInfo> {
+    const { appId, appSecret } = await this.getCredentials();
+
+    const response = await this.graphGet<{
+      data?: {
+        is_valid?: boolean;
+        expires_at?: number;
+        scopes?: string[];
+        error?: { message?: string };
+      };
+    }>(
+      '/debug_token',
+      {
+        input_token: token,
+        // Jeton d'application : `app_id|app_secret`, accepté par /debug_token.
+        access_token: `${appId}|${appSecret}`,
+      },
+      'inspection du jeton'
+    );
+
+    const data = response.data ?? {};
+
+    return {
+      isValid: data.is_valid === true,
+      // `expires_at: 0` signifie « n'expire pas » chez Meta.
+      expiresAt: data.expires_at ? new Date(data.expires_at * 1000) : null,
+      scopes: data.scopes ?? [],
+      error: data.error?.message ?? null,
+    };
+  }
+
+  private async graphGet<T>(
+    endpoint: string,
+    params: Record<string, string>,
+    context: string
+  ): Promise<T> {
+    const url = new URL(`${GRAPH_URL}${endpoint}`);
+    Object.entries(params).forEach(([key, value]) => url.searchParams.set(key, value));
+
+    let response: Response;
+    try {
+      response = await fetch(url.toString());
+    } catch (error) {
+      throw new FacebookAuthError(
+        `Facebook injoignable (${context}) : ${error instanceof Error ? error.message : 'erreur réseau'}`
+      );
+    }
+
+    const payload: any = await response.json().catch(() => ({}));
+
+    if (!response.ok || payload?.error) {
+      const message = payload?.error?.message || `HTTP ${response.status}`;
+      throw new FacebookAuthError(`Facebook (${context}) : ${message}`);
+    }
+
+    return payload as T;
+  }
+}
+
+export const facebookOAuthService = new FacebookOAuthService();

server/services/token_manager.ts

@@ -1,10 +1,31 @@
 // crypto removed, using shared encryption utility
 import { db } from '../db';
-import { socialPages, tokenStatusEnum } from '../../shared/schema';
-import { eq, and, lte } from 'drizzle-orm';
+import { socialPages } from '../../shared/schema';
+import { eq } from 'drizzle-orm';
 import { GraphAPIClient } from '../utils/graph_client';
+import type { SocialPage } from '../../shared/schema';
 
 import { encrypt, decrypt } from '../utils/encryption';
+import { facebookOAuthService, FacebookAuthError } from './facebook_oauth';
+
+/**
+ * Un jeton dont l'échéance est plus proche que cette fenêtre est renouvelé
+ * sans attendre : il reste largement le temps de réessayer les jours suivants
+ * si Facebook est indisponible au moment du contrôle.
+ */
+const RENEWAL_WINDOW_MS = 15 * 24 * 60 * 60 * 1000;
+
+/** En deçà de cette marge, un jeton non renouvelable est signalé « expiring ». */
+const WARNING_WINDOW_MS = 7 * 24 * 60 * 60 * 1000;
+
+export interface TokenCheckResult {
+    pageId: string;
+    pageName: string;
+    status: 'valid' | 'expiring' | 'expired' | 'error';
+    /** Vrai quand ce passage a effectivement réécrit un nouveau jeton. */
+    renewed: boolean;
+    error?: string;
+}
 
 /**
  * Service responsible for managing Facebook Page Token lifecycle
@@ -30,8 +51,9 @@ export class TokenManager {
     /**
      * Checks all active pages for expiring tokens and refreshes them if needed.
      */
-    static async checkAndRefreshTokens() {
+    static async checkAndRefreshTokens(): Promise<TokenCheckResult[]> {
         console.log('[TokenManager] Starting daily token check...');
+        const results: TokenCheckResult[] = [];
 
         try {
             // Fetch active pages
@@ -41,15 +63,18 @@ export class TokenManager {
 
             for (const page of pages) {
                 try {
-                    await this.processPageToken(page);
+                    results.push(await this.processPageToken(page));
                 } catch (error) {
+                    const message = error instanceof Error ? error.message : String(error);
                     console.error(`[TokenManager] Error processing page ${page.pageName} (${page.id}):`, error);
-                    await db.update(socialPages)
-                        .set({
-                            tokenStatus: "error",
-                            lastTokenCheck: new Date()
-                        })
-                        .where(eq(socialPages.id, page.id));
+                    await this.persistStatus(page.id, 'error', message);
+                    results.push({
+                        pageId: page.id,
+                        pageName: page.pageName,
+                        status: 'error',
+                        renewed: false,
+                        error: message,
+                    });
                 }
             }
 
@@ -57,46 +82,211 @@ export class TokenManager {
         } catch (e) {
             console.error('[TokenManager] Critical error in checkAndRefreshTokens:', e);
         }
+
+        return results;
     }
 
-    private static async processPageToken(page: any) {
+    /** Contrôle (et renouvellement) d'une seule page, déclenché depuis l'UI. */
+    static async checkPage(pageId: string): Promise<TokenCheckResult> {
+        const [page] = await db.select().from(socialPages).where(eq(socialPages.id, pageId));
+        if (!page) {
+            throw new Error('Page introuvable');
+        }
+        return this.processPageToken(page);
+    }
+
+    private static async processPageToken(page: SocialPage): Promise<TokenCheckResult> {
         // Les comptes TikTok ont leur propre cycle de vie : l'access token ne dure
         // que 24h et se renouvelle avec le refresh token, pas via la Graph API.
         if (page.platform === 'tiktok') {
             return await this.processTiktokToken(page);
         }
 
-        let accessToken = page.accessToken;
-
-        // Attempt to decrypt. If fails, assume it's plain text (migration phase)
-        try {
-            if (accessToken.includes(':')) {
-                accessToken = this.decrypt(accessToken);
-            }
-        } catch (e) {
-            // Not encrypted or format error, proceed with original
-        }
-
         console.log(`[TokenManager] Checking page: ${page.pageName}`);
 
+        const accessToken = this.readToken(page.accessToken);
+
+        // Sans application Facebook configurée, on ne peut ni interroger
+        // /debug_token ni régénérer quoi que ce soit : on se rabat sur le
+        // contrôle historique (le jeton répond-il encore ?).
+        if (!(await facebookOAuthService.isConfigured())) {
+            return this.legacyCheck(page, accessToken);
+        }
+
+        let info;
+        try {
+            info = await facebookOAuthService.inspectToken(accessToken);
+        } catch (error) {
+            // Facebook injoignable : on ne dégrade pas le statut sur un incident
+            // réseau, sinon toute l'UI passerait au rouge le temps d'une panne.
+            const message = error instanceof Error ? error.message : String(error);
+            console.warn(`[TokenManager] Inspection impossible pour ${page.pageName}: ${message}`);
+            return this.legacyCheck(page, accessToken);
+        }
+
+        const expiresAt = info.expiresAt;
+        const expiringSoon =
+            expiresAt !== null && expiresAt.getTime() - Date.now() < RENEWAL_WINDOW_MS;
+
+        if (info.isValid && !expiringSoon) {
+            // Le jeton de page tient : on en profite pour prolonger le jeton
+            // utilisateur s'il approche de son échéance, car c'est lui qui
+            // permettra le prochain renouvellement.
+            await this.extendUserTokenIfNeeded(page);
+            await this.persistStatus(page.id, 'valid', null, { tokenExpiresAt: expiresAt });
+            return { pageId: page.id, pageName: page.pageName, status: 'valid', renewed: false };
+        }
+
+        const reason = info.isValid
+            ? `Le jeton expire le ${expiresAt?.toLocaleDateString('fr-FR')}`
+            : info.error || 'Le jeton a été invalidé par Facebook';
+        console.warn(`[TokenManager] ${page.pageName}: ${reason} — tentative de renouvellement`);
+
+        // Renouvellement automatique : c'est tout l'intérêt d'avoir conservé le
+        // jeton utilisateur longue durée au moment de la connexion OAuth.
+        try {
+            const renewed = await this.renewFromUserToken(page);
+            if (renewed) {
+                console.log(`[TokenManager] Jeton renouvelé automatiquement pour ${page.pageName}`);
+                return { pageId: page.id, pageName: page.pageName, status: 'valid', renewed: true };
+            }
+        } catch (error) {
+            const message = error instanceof Error ? error.message : String(error);
+            console.error(`[TokenManager] Renouvellement impossible pour ${page.pageName}: ${message}`);
+            await this.persistStatus(page.id, info.isValid ? 'expiring' : 'expired', message, {
+                tokenExpiresAt: expiresAt,
+            });
+            return {
+                pageId: page.id,
+                pageName: page.pageName,
+                status: info.isValid ? 'expiring' : 'expired',
+                renewed: false,
+                error: message,
+            };
+        }
+
+        // Pas de jeton utilisateur en base : la page a été ajoutée à la main,
+        // seule une reconnexion peut la remettre d'aplomb.
+        const manual =
+            `${reason}. Reconnectez la page via « Connecter des pages Facebook » ` +
+            'pour activer le renouvellement automatique.';
+        const status = info.isValid ? 'expiring' : 'expired';
+        await this.persistStatus(page.id, status, manual, { tokenExpiresAt: expiresAt });
+        return { pageId: page.id, pageName: page.pageName, status, renewed: false, error: manual };
+    }
+
+    /**
+     * Régénère le jeton de page à partir du jeton utilisateur longue durée.
+     * Renvoie false quand la page n'a pas de jeton utilisateur enregistré.
+     */
+    private static async renewFromUserToken(page: SocialPage): Promise<boolean> {
+        if (!page.userAccessToken) return false;
+
+        const storedUserToken = this.readToken(page.userAccessToken);
+
+        // On prolonge d'abord le jeton utilisateur : le ré-échanger repart pour
+        // ~60 jours, ce qui repousse d'autant la prochaine reconnexion manuelle.
+        // Un échec ici n'est pas bloquant tant que le jeton actuel fonctionne.
+        let userToken = storedUserToken;
+        let userTokenExpiresAt = page.userTokenExpiresAt ?? null;
+        try {
+            const extended = await facebookOAuthService.extendUserToken(storedUserToken);
+            userToken = extended.accessToken;
+            userTokenExpiresAt = extended.expiresAt;
+        } catch (error) {
+            console.warn(
+                `[TokenManager] Prolongation du jeton utilisateur impossible pour ${page.pageName}:`,
+                error instanceof Error ? error.message : error
+            );
+        }
+
+        const targets = await facebookOAuthService.listPages(userToken);
+        // Une page Instagram est publiée avec le jeton de la page Facebook à
+        // laquelle son compte professionnel est rattaché.
+        const match = targets.find(
+            (target) => target.id === page.pageId || target.instagram?.id === page.pageId
+        );
+
+        if (!match) {
+            throw new FacebookAuthError(
+                `La page « ${page.pageName} » n'est plus administrée par le compte Facebook connecté. ` +
+                'Reconnectez-la avec un compte administrateur de cette page.'
+            );
+        }
+
+        // Un jeton de page dérivé d'un jeton utilisateur longue durée n'expire
+        // pas : `expiresAt` reste donc généralement nul.
+        let pageTokenExpiresAt: Date | null = null;
+        try {
+            pageTokenExpiresAt = (await facebookOAuthService.inspectToken(match.accessToken)).expiresAt;
+        } catch {
+            // L'inspection est un confort : le jeton fraîchement émis est bon.
+        }
+
+        await db.update(socialPages)
+            .set({
+                accessToken: match.accessToken,
+                tokenExpiresAt: pageTokenExpiresAt,
+                userAccessToken: encrypt(userToken),
+                userTokenExpiresAt,
+                followersCount: match.followersCount || page.followersCount,
+                tokenStatus: 'valid',
+                tokenError: null,
+                lastTokenCheck: new Date(),
+            })
+            .where(eq(socialPages.id, page.id));
+
+        return true;
+    }
+
+    /**
+     * Prolonge le jeton utilisateur quand son échéance approche, même si le
+     * jeton de page se porte bien : c'est ce qui évite de perdre la capacité de
+     * renouveler le jour où le jeton de page est révoqué.
+     */
+    private static async extendUserTokenIfNeeded(page: SocialPage): Promise<void> {
+        if (!page.userAccessToken) return;
+
+        const expiresAt = page.userTokenExpiresAt ? new Date(page.userTokenExpiresAt).getTime() : null;
+        if (expiresAt !== null && expiresAt - Date.now() > RENEWAL_WINDOW_MS) return;
+
+        try {
+            const extended = await facebookOAuthService.extendUserToken(this.readToken(page.userAccessToken));
+            await db.update(socialPages)
+                .set({
+                    userAccessToken: encrypt(extended.accessToken),
+                    userTokenExpiresAt: extended.expiresAt,
+                })
+                .where(eq(socialPages.id, page.id));
+            console.log(`[TokenManager] Jeton utilisateur prolongé pour ${page.pageName}`);
+        } catch (error) {
+            console.warn(
+                `[TokenManager] Impossible de prolonger le jeton utilisateur de ${page.pageName}:`,
+                error instanceof Error ? error.message : error
+            );
+        }
+    }
+
+    /**
+     * Contrôle historique, utilisé quand l'application Facebook n'est pas
+     * configurée : on sait seulement si le jeton répond encore.
+     */
+    private static async legacyCheck(page: SocialPage, accessToken: string): Promise<TokenCheckResult> {
         const isValid = await this.verifyToken(accessToken);
 
-        if (isValid) {
-            await db.update(socialPages)
-                .set({
-                    tokenStatus: "valid",
-                    lastTokenCheck: new Date()
-                })
-                .where(eq(socialPages.id, page.id));
-        } else {
-            await db.update(socialPages)
-                .set({
-                    tokenStatus: "expired",
-                    lastTokenCheck: new Date()
-                })
-                .where(eq(socialPages.id, page.id));
-            console.warn(`[TokenManager] Token expired for ${page.pageName}`);
+        if (!isValid) {
+            const error =
+                "Le jeton n'est plus accepté par Facebook. Configurez l'application Facebook " +
+                'dans les paramètres pour activer le renouvellement automatique, ou saisissez un nouveau jeton.';
+            await this.persistStatus(page.id, 'expired', error);
+            return { pageId: page.id, pageName: page.pageName, status: 'expired', renewed: false, error };
         }
+
+        // Le jeton répond : reste l'échéance déclarée à l'ajout de la page.
+        const declared = page.tokenExpiresAt ? new Date(page.tokenExpiresAt).getTime() : null;
+        const status = declared !== null && declared - Date.now() < WARNING_WINDOW_MS ? 'expiring' : 'valid';
+        await this.persistStatus(page.id, status, null);
+        return { pageId: page.id, pageName: page.pageName, status, renewed: false };
     }
 
     /**
@@ -104,7 +294,7 @@ export class TokenManager {
      * On ne teste pas l'access token (il est renouvelé à la demande avant chaque
      * publication) mais le refresh token, dont l'expiration déconnecterait le compte.
      */
-    private static async processTiktokToken(page: any) {
+    private static async processTiktokToken(page: SocialPage): Promise<TokenCheckResult> {
         console.log(`[TokenManager] Checking TikTok account: ${page.pageName}`);
 
         const refreshExpiresAt = page.refreshTokenExpiresAt
@@ -112,21 +302,47 @@ export class TokenManager {
             : 0;
 
         let status: "valid" | "expiring" | "expired" = "valid";
+        let error: string | null = null;
 
         if (!page.refreshToken || (refreshExpiresAt && refreshExpiresAt <= Date.now())) {
             status = "expired";
+            error = "L'autorisation TikTok a expiré : reconnectez le compte.";
             console.warn(`[TokenManager] TikTok account ${page.pageName} must be reconnected`);
         } else if (refreshExpiresAt && refreshExpiresAt - Date.now() < 30 * 24 * 60 * 60 * 1000) {
             // Moins de 30 jours de validité restante
             status = "expiring";
         }
 
+        await this.persistStatus(page.id, status, error);
+        return { pageId: page.id, pageName: page.pageName, status, renewed: false, error: error ?? undefined };
+    }
+
+    private static async persistStatus(
+        pageId: string,
+        status: 'valid' | 'expiring' | 'expired' | 'error',
+        error: string | null,
+        extra: { tokenExpiresAt?: Date | null } = {}
+    ): Promise<void> {
         await db.update(socialPages)
             .set({
                 tokenStatus: status,
-                lastTokenCheck: new Date()
+                tokenError: error,
+                lastTokenCheck: new Date(),
+                ...(extra.tokenExpiresAt !== undefined ? { tokenExpiresAt: extra.tokenExpiresAt } : {}),
             })
-            .where(eq(socialPages.id, page.id));
+            .where(eq(socialPages.id, pageId));
+    }
+
+    /**
+     * Les jetons ont pu être enregistrés en clair (saisie manuelle) ou chiffrés
+     * (flux OAuth) : `decrypt` renvoie le texte tel quel s'il n'est pas chiffré.
+     */
+    private static readToken(token: string): string {
+        try {
+            return this.decrypt(token);
+        } catch {
+            return token;
+        }
     }
 
     private static async verifyToken(token: string): Promise<boolean> {

server/storage.ts

@@ -39,9 +39,12 @@ import {
   tiktokConfig,
   type TiktokConfig,
   type InsertTiktokConfig,
+  facebookConfig,
+  type FacebookConfig,
+  type InsertFacebookConfig,
 } from "@shared/schema";
 import { db } from "./db";
-import { eq, and, gte, lte, desc, asc, isNull, isNotNull, inArray, notInArray } from "drizzle-orm";
+import { eq, and, gte, lte, desc, asc, isNull, isNotNull, inArray, notInArray, getTableColumns, sql, type SQL } from "drizzle-orm";
 import { encrypt, decrypt, isEncrypted } from "./utils/encryption";
 
 /**
@@ -68,24 +71,73 @@ function decryptPageTokens(page: SocialPage): SocialPage {
   };
 }
 
+/** Bornes temporelles utilisées pour les comparaisons du tableau de bord. */
+export interface DashboardStatsRange {
+  yesterdayStart: Date;
+  yesterdayEnd: Date;
+  lastMonth: Date;
+}
+
+export interface DashboardStats {
+  scheduledPosts: number;
+  scheduledPostsLastMonth: number;
+  connectedPages: number;
+  aiTextsGenerated: number;
+  aiTextsYesterday: number;
+  mediaStored: number;
+}
+
+/**
+ * Colonnes renvoyées pour une publication planifiée.
+ *
+ * On ne sélectionne pas la ligne `social_pages` entière : elle porte les jetons
+ * d'accès Facebook et TikTok, qui partaient jusqu'ici dans chaque réponse HTTP
+ * — y compris vers le navigateur, qui n'en fait rien.
+ */
+const SCHEDULED_POST_COLUMNS = {
+  ...getTableColumns(scheduledPosts),
+  post: {
+    id: posts.id,
+    userId: posts.userId,
+    content: posts.content,
+    status: posts.status,
+    scheduledFor: posts.scheduledFor,
+    aiGenerated: posts.aiGenerated,
+    generationStatus: posts.generationStatus,
+    generationProgress: posts.generationProgress,
+    createdAt: posts.createdAt,
+  },
+  page: {
+    id: socialPages.id,
+    pageId: socialPages.pageId,
+    pageName: socialPages.pageName,
+    platform: socialPages.platform,
+    avatarUrl: socialPages.avatarUrl,
+  },
+};
+
 export interface IStorage {
   // Users
   getUser(id: string): Promise<User | undefined>;
   getUserByUsername(username: string): Promise<User | undefined>;
   getAllUsers(): Promise<User[]>;
+  getDashboardStats(userId: string, options: DashboardStatsRange): Promise<DashboardStats>;
   createUser(user: InsertUser): Promise<User>;
   updateUser(id: string, user: Partial<InsertUser>): Promise<User>;
   deleteUser(id: string): Promise<void>;
 
   // Social Pages
   getSocialPages(userId: string): Promise<SocialPage[]>;
+  getAllSocialPages(): Promise<SocialPage[]>;
   getSocialPage(id: string): Promise<SocialPage | undefined>;
   createSocialPage(page: InsertSocialPage): Promise<SocialPage>;
   updateSocialPage(id: string, page: Partial<SocialPage>): Promise<SocialPage>;
   deleteSocialPage(id: string): Promise<void>;
 
   // Media
-  getMedia(userId: string): Promise<Media[]>;
+  getMedia(userId: string, options?: { limit?: number; offset?: number }): Promise<Media[]>;
+  getMediaByIds(ids: string[]): Promise<Media[]>;
+  getMediaCount(userId: string): Promise<number>;
   getMediaById(id: string): Promise<Media | undefined>;
   createMedia(media: InsertMedia): Promise<Media>;
   deleteMedia(id: string): Promise<void>;
@@ -95,6 +147,7 @@ export interface IStorage {
   getPosts(userId: string): Promise<Post[]>;
   getPost(id: string): Promise<Post | undefined>;
   getPostWithMedia(id: string): Promise<{ post: Post; media: Media[] } | undefined>;
+  getOngoingReelPosts(userId: string): Promise<Post[]>;
   createPost(post: InsertPost): Promise<Post>;
   updatePost(id: string, post: Partial<InsertPost>): Promise<Post>;
   updatePostGenerationStatus(id: string, status: string, progress: number, error?: string): Promise<Post>;
@@ -121,6 +174,8 @@ export interface IStorage {
   // TikTok Config
   getTiktokConfig(): Promise<TiktokConfig | undefined>;
   upsertTiktokConfig(config: Partial<InsertTiktokConfig>): Promise<TiktokConfig>;
+  getFacebookConfig(): Promise<FacebookConfig | undefined>;
+  upsertFacebookConfig(config: Partial<InsertFacebookConfig>): Promise<FacebookConfig>;
 
   // Cloudinary Config
   getCloudinaryConfig(): Promise<CloudinaryConfig | undefined>;
@@ -189,12 +244,58 @@ export class DatabaseStorage implements IStorage {
     await db.delete(users).where(eq(users.id, id));
   }
 
+  /**
+   * Compteurs du tableau de bord.
+   *
+   * Comptés en SQL : les charger en mémoire revenait à lire quatre tables
+   * entières — tous les posts, toutes les pages, tous les médias, toutes les
+   * générations — pour n'en garder que le nombre de lignes.
+   */
+  async getDashboardStats(userId: string, range: DashboardStatsRange): Promise<DashboardStats> {
+    const [postCounts, generationCounts, pageCount, mediaCount] = await Promise.all([
+      db
+        .select({
+          scheduled: sql<string>`count(*) filter (where ${posts.status} = 'scheduled')`,
+          scheduledLastMonth: sql<string>`count(*) filter (where ${posts.status} = 'scheduled' and ${posts.createdAt} < ${range.lastMonth})`,
+        })
+        .from(posts)
+        .where(eq(posts.userId, userId)),
+      db
+        .select({
+          total: sql<string>`count(*)`,
+          yesterday: sql<string>`count(*) filter (where ${aiGenerations.createdAt} >= ${range.yesterdayStart} and ${aiGenerations.createdAt} < ${range.yesterdayEnd})`,
+        })
+        .from(aiGenerations)
+        .where(eq(aiGenerations.userId, userId)),
+      db.select({ total: sql<string>`count(*)` }).from(socialPages).where(eq(socialPages.userId, userId)),
+      db.select({ total: sql<string>`count(*)` }).from(media).where(eq(media.userId, userId)),
+    ]);
+
+    return {
+      scheduledPosts: Number(postCounts[0]?.scheduled ?? 0),
+      scheduledPostsLastMonth: Number(postCounts[0]?.scheduledLastMonth ?? 0),
+      connectedPages: Number(pageCount[0]?.total ?? 0),
+      aiTextsGenerated: Number(generationCounts[0]?.total ?? 0),
+      aiTextsYesterday: Number(generationCounts[0]?.yesterday ?? 0),
+      mediaStored: Number(mediaCount[0]?.total ?? 0),
+    };
+  }
+
   // Social Pages
   async getSocialPages(userId: string): Promise<SocialPage[]> {
     const pages = await db.select().from(socialPages).where(eq(socialPages.userId, userId));
     return pages.map(page => decryptPageTokens(page));
   }
 
+  /**
+   * Toutes les pages de l'instance, pour les vues d'administration.
+   * Remplace un `getAllUsers()` suivi d'une requête par utilisateur.
+   */
+  async getAllSocialPages(): Promise<SocialPage[]> {
+    const pages = await db.select().from(socialPages);
+    return pages.map(page => decryptPageTokens(page));
+  }
+
   async getSocialPage(id: string): Promise<SocialPage | undefined> {
     const [page] = await db.select().from(socialPages).where(eq(socialPages.id, id));
     return page ? decryptPageTokens(page) : undefined;
@@ -229,8 +330,37 @@ export class DatabaseStorage implements IStorage {
   }
 
   // Media
-  async getMedia(userId: string): Promise<Media[]> {
-    return await db.select().from(media).where(eq(media.userId, userId)).orderBy(desc(media.createdAt));
+  /**
+   * Médias d'un utilisateur, du plus récent au plus ancien.
+   * `limit` sert aux écrans qui n'en affichent qu'une poignée : sans lui, la
+   * médiathèque entière transitait pour en montrer cinq.
+   */
+  async getMedia(userId: string, options: { limit?: number; offset?: number } = {}): Promise<Media[]> {
+    let query = db
+      .select()
+      .from(media)
+      .where(eq(media.userId, userId))
+      .orderBy(desc(media.createdAt))
+      .$dynamic();
+
+    if (options.limit !== undefined) query = query.limit(options.limit);
+    if (options.offset !== undefined) query = query.offset(options.offset);
+
+    return await query;
+  }
+
+  async getMediaByIds(ids: string[]): Promise<Media[]> {
+    if (ids.length === 0) return [];
+    return await db.select().from(media).where(inArray(media.id, ids));
+  }
+
+  /** Total de médias, pour que la pagination sache où elle s'arrête. */
+  async getMediaCount(userId: string): Promise<number> {
+    const [row] = await db
+      .select({ total: sql<string>`count(*)` })
+      .from(media)
+      .where(eq(media.userId, userId));
+    return Number(row?.total ?? 0);
   }
 
   async getMediaById(id: string): Promise<Media | undefined> {
@@ -266,14 +396,16 @@ export class DatabaseStorage implements IStorage {
     if (!post) return undefined;
 
     const postMediaLinks = await this.getPostMedia(id);
-    const mediaItems: Media[] = [];
 
-    for (const link of postMediaLinks) {
-      const mediaItem = await this.getMediaById(link.mediaId);
-      if (mediaItem) {
-        mediaItems.push(mediaItem);
-      }
-    }
+    // Une seule requête pour tous les médias, puis remise dans l'ordre
+    // d'affichage : une requête par média rendait le coût proportionnel au
+    // nombre de visuels du post.
+    const byId = new Map(
+      (await this.getMediaByIds(postMediaLinks.map(link => link.mediaId))).map(item => [item.id, item])
+    );
+    const mediaItems = postMediaLinks
+      .map(link => byId.get(link.mediaId))
+      .filter((item): item is Media => item !== undefined);
 
     return { post, media: mediaItems };
   }
@@ -347,67 +479,42 @@ export class DatabaseStorage implements IStorage {
 
   // Scheduled Posts
   async getScheduledPosts(userId: string, startDate?: Date, endDate?: Date): Promise<any[]> {
-    let query = db
-      .select()
-      .from(scheduledPosts)
-      .innerJoin(posts, eq(scheduledPosts.postId, posts.id))
-      .leftJoin(socialPages, eq(scheduledPosts.pageId, socialPages.id))
-      .where(eq(posts.userId, userId));
-
-    if (startDate && endDate) {
-      const results = await query;
-      return results
-        .filter(r => {
-          const scheduledAt = new Date(r.scheduled_posts.scheduledAt);
-          return scheduledAt >= startDate && scheduledAt <= endDate;
-        })
-        .map(r => ({
-          ...r.scheduled_posts,
-          post: r.posts,
-          page: r.social_pages,
-        }));
-    }
-
-    const results = await query;
-    return results.map(r => ({
-      ...r.scheduled_posts,
-      post: r.posts,
-      page: r.social_pages,
-    }));
+    return this.queryScheduledPosts(eq(posts.userId, userId), startDate, endDate);
   }
 
   async getScheduledPostsByPages(pageIds: string[], startDate?: Date, endDate?: Date): Promise<any[]> {
     if (pageIds.length === 0) {
       return [];
     }
+    return this.queryScheduledPosts(inArray(scheduledPosts.pageId, pageIds), startDate, endDate);
+  }
 
-    let query = db
-      .select()
+  /**
+   * Publications planifiées, avec le post et la page auxquels elles se rapportent.
+   *
+   * La période est filtrée en SQL : la charger entière pour la filtrer en
+   * mémoire revenait à lire tout l'historique à chaque affichage du calendrier.
+   */
+  private async queryScheduledPosts(
+    scope: SQL,
+    startDate?: Date,
+    endDate?: Date
+  ): Promise<any[]> {
+    const conditions: SQL[] = [scope];
+    if (startDate) conditions.push(gte(scheduledPosts.scheduledAt, startDate));
+    if (endDate) conditions.push(lte(scheduledPosts.scheduledAt, endDate));
+
+    const rows = await db
+      .select(SCHEDULED_POST_COLUMNS)
       .from(scheduledPosts)
       .innerJoin(posts, eq(scheduledPosts.postId, posts.id))
       .leftJoin(socialPages, eq(scheduledPosts.pageId, socialPages.id))
-      .where(inArray(scheduledPosts.pageId, pageIds));
+      .where(conditions.length === 1 ? conditions[0] : and(...conditions))
+      .orderBy(desc(scheduledPosts.scheduledAt));
 
-    if (startDate && endDate) {
-      const results = await query;
-      return results
-        .filter(r => {
-          const scheduledAt = new Date(r.scheduled_posts.scheduledAt);
-          return scheduledAt >= startDate && scheduledAt <= endDate;
-        })
-        .map(r => ({
-          ...r.scheduled_posts,
-          post: r.posts,
-          page: r.social_pages,
-        }));
-    }
-
-    const results = await query;
-    return results.map(r => ({
-      ...r.scheduled_posts,
-      post: r.posts,
-      page: r.social_pages,
-    }));
+    // La jointure externe renvoie un objet aux champs nuls quand la page a été
+    // supprimée ; les appelants attendent `page: null` dans ce cas.
+    return rows.map(row => ({ ...row, page: row.page?.id ? row.page : null }));
   }
 
   async getScheduledPost(id: string): Promise<ScheduledPost | undefined> {
@@ -463,6 +570,24 @@ export class DatabaseStorage implements IStorage {
       );
   }
 
+  /**
+   * Reels dont la génération est en cours. Filtré en SQL : la route chargeait
+   * tous les posts de l'utilisateur pour n'en garder qu'une poignée, toutes les
+   * trois secondes.
+   */
+  async getOngoingReelPosts(userId: string): Promise<Post[]> {
+    return await db
+      .select()
+      .from(posts)
+      .where(
+        and(
+          eq(posts.userId, userId),
+          inArray(posts.generationStatus, ['processing', 'pending'])
+        )
+      )
+      .orderBy(desc(posts.createdAt));
+  }
+
   // AI Generations
   async getAiGenerations(userId: string): Promise<AiGeneration[]> {
     return await db.select().from(aiGenerations).where(eq(aiGenerations.userId, userId)).orderBy(desc(aiGenerations.createdAt));
@@ -612,6 +737,38 @@ export class DatabaseStorage implements IStorage {
     return config || undefined;
   }
 
+  // Facebook Config (application développeur, globale à l'instance)
+  async getFacebookConfig(): Promise<FacebookConfig | undefined> {
+    const [config] = await db.select().from(facebookConfig).limit(1);
+    if (!config) return undefined;
+    return { ...config, appSecret: decrypt(config.appSecret) };
+  }
+
+  async upsertFacebookConfig(data: Partial<InsertFacebookConfig>): Promise<FacebookConfig> {
+    const values: Partial<FacebookConfig> = { ...data };
+    if (data.appSecret) {
+      values.appSecret = encrypt(data.appSecret);
+    }
+
+    const [existing] = await db.select().from(facebookConfig).limit(1);
+    if (existing) {
+      const [updated] = await db.update(facebookConfig)
+        .set({ ...values, updatedAt: new Date() })
+        .where(eq(facebookConfig.id, existing.id))
+        .returning();
+      return { ...updated, appSecret: decrypt(updated.appSecret) };
+    }
+
+    if (!values.appId || !values.appSecret) {
+      throw new Error("L'App ID et l'App Secret Facebook sont requis");
+    }
+
+    const [created] = await db.insert(facebookConfig)
+      .values({ appId: values.appId, appSecret: values.appSecret })
+      .returning();
+    return { ...created, appSecret: decrypt(created.appSecret) };
+  }
+
   // TikTok Config
   async getTiktokConfig(): Promise<TiktokConfig | undefined> {
     const [config] = await db.select().from(tiktokConfig).limit(1);

shared/schema.ts

@@ -38,6 +38,15 @@ export const socialPages = pgTable("social_pages", {
   tokenStatus: tokenStatusEnum("token_status").default("valid"),
   lastTokenCheck: timestamp("last_token_check"),
 
+  // Jeton utilisateur longue durée (~60 j) obtenu via OAuth Facebook, chiffré au
+  // repos. C'est lui qui permet de régénérer un token de page sans intervention
+  // humaine : sans lui, un token révoqué impose une reconnexion manuelle.
+  userAccessToken: text("user_access_token"),
+  userTokenExpiresAt: timestamp("user_token_expires_at"),
+  // Dernière erreur rencontrée lors du contrôle du token, affichée dans l'UI
+  // pour que l'utilisateur sache quoi faire (reconnecter, réautoriser…).
+  tokenError: text("token_error"),
+
   // OAuth TikTok : l'access token n'est valable que 24h, il doit être renouvelé
   // avec le refresh token (valable 1 an) avant chaque publication.
   refreshToken: text("refresh_token"),
@@ -93,6 +102,7 @@ export const insertSocialPageSchema = createInsertSchema(socialPages).omit({
   createdAt: true,
   tokenStatus: true,     // Managed by System
   lastTokenCheck: true,  // Managed by System
+  tokenError: true,      // Managed by System
 });
 
 export const insertPostAnalyticsSchema = createInsertSchema(postAnalytics).omit({
@@ -143,6 +153,20 @@ export const openrouterConfig = pgTable("openrouter_config", {
 
 // Application développeur TikTok (globale) : un seul client_key pour toute
 // l'instance, chaque magasin autorise ensuite son propre compte via OAuth.
+/**
+ * Application développeur Facebook (globale à l'instance). Elle rend possible le
+ * renouvellement automatique des tokens de page : sans app id / app secret, on
+ * ne peut ni échanger un code OAuth, ni prolonger un jeton, ni interroger
+ * /debug_token.
+ */
+export const facebookConfig = pgTable("facebook_config", {
+  id: varchar("id").primaryKey().default(sql`gen_random_uuid()`),
+  appId: text("app_id").notNull(),
+  appSecret: text("app_secret").notNull(),
+  createdAt: timestamp("created_at").defaultNow(),
+  updatedAt: timestamp("updated_at").defaultNow(),
+});
+
 export const tiktokConfig = pgTable("tiktok_config", {
   id: varchar("id").primaryKey().default(sql`gen_random_uuid()`),
   clientKey: text("client_key").notNull(),
@@ -432,6 +456,19 @@ export const updateCloudinaryConfigSchema = insertCloudinaryConfigSchema.partial
   apiSecret: true,
 });
 
+export const insertFacebookConfigSchema = createInsertSchema(facebookConfig).omit({
+  id: true,
+  createdAt: true,
+  updatedAt: true,
+}).extend({
+  appId: z.string().trim().min(1, "L'App ID ne peut pas être vide"),
+  appSecret: z.string().trim().min(1, "L'App Secret ne peut pas être vide"),
+});
+
+export const updateFacebookConfigSchema = insertFacebookConfigSchema.partial({
+  appSecret: true,
+});
+
 export const insertTiktokConfigSchema = createInsertSchema(tiktokConfig).omit({
   id: true,
   createdAt: true,
@@ -504,6 +541,19 @@ export type InsertAudioTrack = z.infer<typeof insertAudioTrackSchema>;
 
 export type AppConfig = typeof appConfig.$inferSelect;
 
+/**
+ * Page telle qu'elle est renvoyée au navigateur : les jetons restent au serveur,
+ * `autoRenew` dit simplement si la page sait se renouveler toute seule.
+ */
+export type ClientSocialPage = Omit<
+  SocialPage,
+  'accessToken' | 'userAccessToken' | 'refreshToken'
+> & { autoRenew: boolean };
+
+export type FacebookConfig = typeof facebookConfig.$inferSelect;
+export type InsertFacebookConfig = z.infer<typeof insertFacebookConfigSchema>;
+export type UpdateFacebookConfig = z.infer<typeof updateFacebookConfigSchema>;
+
 export type TiktokConfig = typeof tiktokConfig.$inferSelect;
 export type InsertTiktokConfig = z.infer<typeof insertTiktokConfigSchema>;
 export type UpdateTiktokConfig = z.infer<typeof updateTiktokConfigSchema>;