From acd749b9d26cf7fed51a253d195db5327e44b04f Mon Sep 17 00:00:00 2001
From: Claude <noreply@anthropic.com>
Date: Thu, 13 Nov 2025 17:59:02 +0000
Subject: [PATCH] Fix: Augmentation limites frontend et ajout pagination
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Modifications des limites de pagination :
- Tâches : 10 → 15 éléments par page
- Flux RSS : 7 → 8 articles par page
- Calendrier : Ajout pagination (10 événements par page)

Calendrier :
- Charge maintenant 50 événements au lieu de 10
- Ajout état calendarPage et logique de pagination
- Ajout boutons de pagination (‹/›) avec compteur
- Affichage des événements paginés

Améliore l'expérience utilisateur en affichant plus d'éléments
avant la pagination tout en gardant l'interface organisée.
---
 src/pages/Index.tsx | 44 ++++++++++++++++++++++++++++++++++++++++----
 1 file changed, 40 insertions(+), 4 deletions(-)

diff --git a/src/pages/Index.tsx b/src/pages/Index.tsx
index 601f022..e21994a 100644
--- a/src/pages/Index.tsx
+++ b/src/pages/Index.tsx
@@ -87,11 +87,13 @@ const Index = () => {
   const [todosActivePage, setTodosActivePage] = useState(0);
   const [todosCompletedPage, setTodosCompletedPage] = useState(0);
   const [rssPage, setRssPage] = useState(0);
+  const [calendarPage, setCalendarPage] = useState(0);
 
   const NOTES_PER_PAGE = 5;
-  const TODOS_PER_PAGE = 10;
+  const TODOS_PER_PAGE = 15;
   const RSS_MAX_ARTICLES = 14;
-  const RSS_PER_PAGE = 7;
+  const RSS_PER_PAGE = 8;
+  const CALENDAR_PER_PAGE = 10;
 
   // Chatbox states
   const [chatOpen, setChatOpen] = useState(false);
@@ -195,7 +197,7 @@ const Index = () => {
 
   const loadCalendarEvents = async () => {
     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)) {
         setCalendarEvents(events);
       }
@@ -702,6 +704,10 @@ const Index = () => {
     setRssPage(0);
   }, [rssArticles.length]);
 
+  useEffect(() => {
+    setCalendarPage(0);
+  }, [calendarEvents.length]);
+
   // Pagination for todos
   const activeTodos = todos.filter(t => !t.completed);
   const completedTodos = todos.filter(t => t.completed);
@@ -723,6 +729,13 @@ const Index = () => {
     (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 (
     <div className="min-h-screen bg-gray-50 dark:bg-gray-900">
       {/* Top Navigation */}
@@ -851,7 +864,7 @@ const Index = () => {
               <CardContent>
                 <div className="space-y-3 max-h-[calc(100vh-250px)] overflow-y-auto">
                   {calendarEvents.length > 0 ? (
-                    calendarEvents.map(event => {
+                    paginatedCalendarEvents.map(event => {
                       const startDate = new Date(event.start_time);
                       const endDate = new Date(event.end_time);
                       const isToday = startDate.toDateString() === new Date().toDateString();
@@ -921,6 +934,29 @@ const Index = () => {
                     </p>
                   )}
                 </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>
             </Card>
           </div>