mirror of
https://github.com/R0m1k3/Socialflow.git
synced 2026-10-24 07:28:11 +02:00
Add a preview option to see scheduled and historical posts
Integrate an "Eye" icon in the calendar and history views to allow users to preview posts, along with a modal for displaying the preview content. Replit-Commit-Author: Agent Replit-Commit-Session-Id: ae4037a0-2a6f-4530-9bac-79b543286bda Replit-Commit-Checkpoint-Type: intermediate_checkpoint Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/397bca8c-984f-43ff-841a-10897aeb8140/ae4037a0-2a6f-4530-9bac-79b543286bda/XaovM3F
This commit is contained in:
1 parent
a0cddc9df7
commit
35869603d6
3 files changed
+208
-70
No files matched your search
@@ -1,6 +1,6 @@
|
||||
import { format, isSameDay, parseISO } from "date-fns";
|
||||
import { fr } from "date-fns/locale";
|
||||
import { Edit, Trash2, ChevronDown, ChevronUp } from "lucide-react";
|
||||
import { Edit, Trash2, ChevronDown, ChevronUp, Eye } from "lucide-react";
|
||||
import { SiFacebook, SiInstagram } from "react-icons/si";
|
||||
import { Button } from "@/components/ui/button";
|
||||
import { useState } from "react";
|
||||
@@ -9,9 +9,10 @@ interface CalendarListViewProps {
|
||||
scheduledPosts: any[];
|
||||
onEditPost: (post: any) => void;
|
||||
onDeletePost: (postId: string) => void;
|
||||
onPreviewPost: (post: any) => void;
|
||||
}
|
||||
|
||||
export default function CalendarListView({ scheduledPosts, onEditPost, onDeletePost }: CalendarListViewProps) {
|
||||
export default function CalendarListView({ scheduledPosts, onEditPost, onDeletePost, onPreviewPost }: CalendarListViewProps) {
|
||||
const [expandedDates, setExpandedDates] = useState<Set<string>>(new Set());
|
||||
|
||||
// Group posts by date
|
||||
@@ -129,30 +130,42 @@ export default function CalendarListView({ scheduledPosts, onEditPost, onDeleteP
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{isPending && (
|
||||
<div className="flex gap-2">
|
||||
<Button
|
||||
variant="ghost"
|
||||
size="sm"
|
||||
onClick={() => onEditPost(post)}
|
||||
className="h-11 w-11 p-0"
|
||||
data-testid={`button-edit-post-${post.id}`}
|
||||
title="Modifier"
|
||||
>
|
||||
<Edit className="w-5 h-5 text-blue-500" />
|
||||
</Button>
|
||||
<Button
|
||||
variant="ghost"
|
||||
size="sm"
|
||||
onClick={() => onDeletePost(post.id)}
|
||||
className="h-11 w-11 p-0"
|
||||
data-testid={`button-delete-post-${post.id}`}
|
||||
title="Supprimer"
|
||||
>
|
||||
<Trash2 className="w-5 h-5 text-red-500" />
|
||||
</Button>
|
||||
</div>
|
||||
)}
|
||||
<div className="flex gap-2">
|
||||
<Button
|
||||
variant="ghost"
|
||||
size="sm"
|
||||
onClick={() => onPreviewPost(post)}
|
||||
className="h-11 w-11 p-0"
|
||||
data-testid={`button-preview-post-${post.id}`}
|
||||
title="Prévisualiser"
|
||||
>
|
||||
<Eye className={`w-5 h-5 ${isPending ? 'text-blue-500' : 'text-green-500'}`} />
|
||||
</Button>
|
||||
{isPending && (
|
||||
<>
|
||||
<Button
|
||||
variant="ghost"
|
||||
size="sm"
|
||||
onClick={() => onEditPost(post)}
|
||||
className="h-11 w-11 p-0"
|
||||
data-testid={`button-edit-post-${post.id}`}
|
||||
title="Modifier"
|
||||
>
|
||||
<Edit className="w-5 h-5 text-blue-500" />
|
||||
</Button>
|
||||
<Button
|
||||
variant="ghost"
|
||||
size="sm"
|
||||
onClick={() => onDeletePost(post.id)}
|
||||
className="h-11 w-11 p-0"
|
||||
data-testid={`button-delete-post-${post.id}`}
|
||||
title="Supprimer"
|
||||
>
|
||||
<Trash2 className="w-5 h-5 text-red-500" />
|
||||
</Button>
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
||||
Reference in new issue
Block a user