fix(ui): correct reel labeling in history and dashboard

client/src/components/recent-publications.tsx

@@ -1,6 +1,6 @@
 import { useQuery } from "@tanstack/react-query";
 import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card";
-import { Facebook, Instagram, Clock, CheckCircle2, XCircle, Eye, Image as ImageIcon, Smartphone } from "lucide-react";
+import { Facebook, Instagram, Clock, CheckCircle2, XCircle, Eye, Image as ImageIcon, Smartphone, Clapperboard } from "lucide-react";
 import { format } from "date-fns";
 import { fr } from "date-fns/locale";
 import type { ScheduledPost, SocialPage, Post, Media } from "@shared/schema";
@@ -65,6 +65,8 @@ export default function RecentPublications() {
       return <ImageIcon className="w-3.5 h-3.5" />;
     } else if (postType === 'story') {
       return <Smartphone className="w-3.5 h-3.5" />;
+    } else if (postType === 'reel') {
+      return <Clapperboard className="w-3.5 h-3.5" />;
     } else if (postType === 'both') {
       return (
         <div className="flex gap-0.5">
@@ -105,11 +107,10 @@ export default function RecentPublications() {
                 data-testid={`publication-${scheduledPost.id}`}
               >
                 {/* Platform icon */}
-                <div className={`w-10 h-10 rounded-lg flex items-center justify-center flex-shrink-0 ${
+                <div className={`w-10 h-10 rounded-lg flex items-center justify-center flex-shrink-0 ${scheduledPost.page?.platform === 'facebook'
-                  scheduledPost.page?.platform === 'facebook' 
                     ? 'bg-blue-500'
                     : 'bg-gradient-to-br from-purple-500 to-pink-500'
-                }`}>
+                  }`}>
                   {scheduledPost.page?.platform === 'facebook' ? (
                     <Facebook className="w-5 h-5 text-white" />
                   ) : (
@@ -155,7 +156,8 @@ export default function RecentPublications() {
                     <span className="flex items-center gap-1 capitalize">
                       {getPostTypeIcon(scheduledPost.postType)}
                       {scheduledPost.postType === 'feed' ? 'Feed' :
-                       scheduledPost.postType === 'story' ? 'Story' : 'Feed & Story'}
+                        scheduledPost.postType === 'story' ? 'Story' :
+                          scheduledPost.postType === 'reel' ? 'Reel' : 'Feed & Story'}
                     </span>
                     <span>•</span>
                     <span>
@@ -181,7 +183,7 @@ export default function RecentPublications() {
         postText={previewData.postText}
         selectedMedia={previewData.mediaIds}
         mediaList={previewData.allMedia}
-        onPublish={() => {}}
+        onPublish={() => { }}
         isPublishing={false}
         readOnly={true}
       />

client/src/pages/history.tsx

@@ -1,6 +1,6 @@
 import { useState } from "react";
 import { useQuery } from "@tanstack/react-query";
-import { Clock, CheckCircle, XCircle, Calendar, History as HistoryIcon, Eye, Image as ImageIcon, Smartphone, Loader2 } from "lucide-react";
+import { Clock, CheckCircle, XCircle, Calendar, History as HistoryIcon, Eye, Image as ImageIcon, Smartphone, Loader2, Clapperboard } from "lucide-react";
 import Sidebar from "@/components/sidebar";
 import TopBar from "@/components/topbar";
 import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
@@ -69,6 +69,8 @@ export default function History() {
       return <ImageIcon className="w-4 h-4" />;
     } else if (postType === 'story') {
       return <Smartphone className="w-4 h-4" />;
+    } else if (postType === 'reel') {
+      return <Clapperboard className="w-4 h-4" />;
     } else if (postType === 'both') {
       return (
         <div className="flex gap-0.5">
@@ -138,8 +140,8 @@ export default function History() {
                         <div className="flex-1">
                           <div className="flex items-center gap-3 mb-3">
                             <div className={`w-10 h-10 rounded-xl flex items-center justify-center shadow-md ${hasError ? 'bg-gradient-to-br from-destructive to-destructive/80' :
-                                isPending ? 'bg-gradient-to-br from-blue-500 to-blue-600' :
+                              isPending ? 'bg-gradient-to-br from-blue-500 to-blue-600' :
-                                  'bg-gradient-to-br from-green-500 to-green-600'
+                                'bg-gradient-to-br from-green-500 to-green-600'
                               }`}>
                               {hasError ? (
                                 <XCircle className="w-5 h-5 text-white" />
@@ -170,10 +172,10 @@ export default function History() {
                           </Button>
                           <Badge
                             className={`${hasError
-                                ? 'bg-destructive/20 text-destructive hover:bg-destructive/30'
+                              ? 'bg-destructive/20 text-destructive hover:bg-destructive/30'
-                                : isPending
+                              : isPending
-                                  ? 'bg-blue-500/20 text-blue-500 hover:bg-blue-500/30'
+                                ? 'bg-blue-500/20 text-blue-500 hover:bg-blue-500/30'
-                                  : 'bg-success/20 text-success hover:bg-success/30'
+                                : 'bg-success/20 text-success hover:bg-success/30'
                               }`}
                           >
                             {hasError ? (
@@ -202,7 +204,8 @@ export default function History() {
                           {getPostTypeIcon(scheduledPost.postType)}
                           <span className="font-medium capitalize">
                             {scheduledPost.postType === 'feed' ? 'Feed' :
-                              scheduledPost.postType === 'story' ? 'Story' : 'Feed & Story'}
+                              scheduledPost.postType === 'story' ? 'Story' :
+                                scheduledPost.postType === 'reel' ? 'Reel' : 'Feed & Story'}
                           </span>
                         </div>
                         <div className="flex items-center gap-2">