Merge pull request #73 from R0m1k3/claude/update-rss-feeds-011CV6EZDsWAUqbRHZR1117Q

Fix: Augmentation limites frontend et ajout pagination
This commit is contained in:
LogiFlow authored and GitHub committed 2025-11-13 19:47:24 +01:00
commit a3b38e594e
1 file changed
+40 -4
+40 -4
View File
@@ -87,11 +87,13 @@ const Index = () => {
const [todosActivePage, setTodosActivePage] = useState(0); const [todosActivePage, setTodosActivePage] = useState(0);
const [todosCompletedPage, setTodosCompletedPage] = useState(0); const [todosCompletedPage, setTodosCompletedPage] = useState(0);
const [rssPage, setRssPage] = useState(0); const [rssPage, setRssPage] = useState(0);
const [calendarPage, setCalendarPage] = useState(0);
const NOTES_PER_PAGE = 5; const NOTES_PER_PAGE = 5;
const TODOS_PER_PAGE = 10; const TODOS_PER_PAGE = 15;
const RSS_MAX_ARTICLES = 14; const RSS_MAX_ARTICLES = 14;
const RSS_PER_PAGE = 7; const RSS_PER_PAGE = 8;
const CALENDAR_PER_PAGE = 10;
// Chatbox states // Chatbox states
const [chatOpen, setChatOpen] = useState(false); const [chatOpen, setChatOpen] = useState(false);
@@ -195,7 +197,7 @@ const Index = () => {
const loadCalendarEvents = async () => { const loadCalendarEvents = async () => {
try { try {
const events = await CalendarService.getEvents(10); // Limité à 10 événements const events = await CalendarService.getEvents(50); // Charger 50 événements pour pagination
if (Array.isArray(events)) { if (Array.isArray(events)) {
setCalendarEvents(events); setCalendarEvents(events);
} }
@@ -702,6 +704,10 @@ const Index = () => {
setRssPage(0); setRssPage(0);
}, [rssArticles.length]); }, [rssArticles.length]);
useEffect(() => {
setCalendarPage(0);
}, [calendarEvents.length]);
// Pagination for todos // Pagination for todos
const activeTodos = todos.filter(t => !t.completed); const activeTodos = todos.filter(t => !t.completed);
const completedTodos = todos.filter(t => t.completed); const completedTodos = todos.filter(t => t.completed);
@@ -723,6 +729,13 @@ const Index = () => {
(rssPage + 1) * RSS_PER_PAGE (rssPage + 1) * RSS_PER_PAGE
); );
// Pagination for Calendar
const totalCalendarPages = Math.ceil(calendarEvents.length / CALENDAR_PER_PAGE);
const paginatedCalendarEvents = calendarEvents.slice(
calendarPage * CALENDAR_PER_PAGE,
(calendarPage + 1) * CALENDAR_PER_PAGE
);
return ( return (
<div className="min-h-screen bg-gray-50 dark:bg-gray-900"> <div className="min-h-screen bg-gray-50 dark:bg-gray-900">
{/* Top Navigation */} {/* Top Navigation */}
@@ -851,7 +864,7 @@ const Index = () => {
<CardContent> <CardContent>
<div className="space-y-3 max-h-[calc(100vh-250px)] overflow-y-auto"> <div className="space-y-3 max-h-[calc(100vh-250px)] overflow-y-auto">
{calendarEvents.length > 0 ? ( {calendarEvents.length > 0 ? (
calendarEvents.map(event => { paginatedCalendarEvents.map(event => {
const startDate = new Date(event.start_time); const startDate = new Date(event.start_time);
const endDate = new Date(event.end_time); const endDate = new Date(event.end_time);
const isToday = startDate.toDateString() === new Date().toDateString(); const isToday = startDate.toDateString() === new Date().toDateString();
@@ -921,6 +934,29 @@ const Index = () => {
</p> </p>
)} )}
</div> </div>
{totalCalendarPages > 1 && (
<div className="flex items-center justify-center gap-2 mt-3 pt-3 border-t">
<Button
variant="ghost"
size="sm"
onClick={() => setCalendarPage(p => Math.max(0, p - 1))}
disabled={calendarPage === 0}
>
‹
</Button>
<span className="text-xs text-muted-foreground">
{calendarPage + 1}/{totalCalendarPages}
</span>
<Button
variant="ghost"
size="sm"
onClick={() => setCalendarPage(p => Math.min(totalCalendarPages - 1, p + 1))}
disabled={calendarPage === totalCalendarPages - 1}
>
›
</Button>
</div>
)}
</CardContent> </CardContent>
</Card> </Card>
</div> </div>