From 98a11b9ddda9ab9bf5b28084b01fde202533d909 Mon Sep 17 00:00:00 2001
From: Claude <noreply@anthropic.com>
Date: Wed, 12 Nov 2025 15:47:38 +0000
Subject: [PATCH] Feature: Flux RSS avec 14 articles et pagination
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Modification du système d'affichage des flux RSS :

Changements :
- Augmentation de 8 à 14 articles maximum
- Ajout d'un système de pagination (7 articles par page)
- Navigation avec flèches ‹ › comme pour les todos
- Format compact : "X/Y" pour l'indicateur de page
- Hauteur ajustée : max-h-[calc(100vh-500px)] pour inclure la pagination
- Réinitialisation automatique à la page 1 lors du rechargement des articles

Constantes modifiées :
- RSS_MAX_ARTICLES : 8 → 14
- RSS_PER_PAGE : nouveau à 7
- loadRssArticles : 15 → 14 articles chargés

États ajoutés :
- rssPage : pagination des articles RSS

Résultat :
- Page 1 : 7 articles
- Page 2 : 7 articles
- Total : 14 articles avec navigation intuitive
---
 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 ea7d74c..acafeb5 100644
--- a/src/pages/Index.tsx
+++ b/src/pages/Index.tsx
@@ -84,10 +84,12 @@ const Index = () => {
   const [notesPage, setNotesPage] = useState(0);
   const [todosActivePage, setTodosActivePage] = useState(0);
   const [todosCompletedPage, setTodosCompletedPage] = useState(0);
+  const [rssPage, setRssPage] = useState(0);
 
   const NOTES_PER_PAGE = 5;
   const TODOS_PER_PAGE = 10;
-  const RSS_MAX_ARTICLES = 8;
+  const RSS_MAX_ARTICLES = 14;
+  const RSS_PER_PAGE = 7;
 
   // Debounce timer for auto-save
   const saveTimerRef = useRef<NodeJS.Timeout | null>(null);
@@ -169,7 +171,7 @@ const Index = () => {
 
   const loadRssArticles = async () => {
     try {
-      const articles = await RssService.getArticles(15);
+      const articles = await RssService.getArticles(14);
       if (Array.isArray(articles)) {
         setRssArticles(articles);
       }
@@ -619,6 +621,10 @@ const Index = () => {
     setTodosCompletedPage(0);
   }, [todos.length]);
 
+  useEffect(() => {
+    setRssPage(0);
+  }, [rssArticles.length]);
+
   // Pagination for todos
   const activeTodos = todos.filter(t => !t.completed);
   const completedTodos = todos.filter(t => t.completed);
@@ -633,6 +639,13 @@ const Index = () => {
     (todosCompletedPage + 1) * TODOS_PER_PAGE
   );
 
+  // Pagination for RSS
+  const totalRssPages = Math.ceil(rssArticles.length / RSS_PER_PAGE);
+  const paginatedRssArticles = rssArticles.slice(
+    rssPage * RSS_PER_PAGE,
+    (rssPage + 1) * RSS_PER_PAGE
+  );
+
   return (
     <div className="min-h-screen bg-gray-50 dark:bg-gray-900">
       {/* Top Navigation */}
@@ -1392,9 +1405,9 @@ const Index = () => {
               </div>
             </CardHeader>
             <CardContent>
-              <div className="space-y-2 max-h-[calc(100vh-400px)] overflow-y-auto">
+              <div className="space-y-2 max-h-[calc(100vh-500px)] overflow-y-auto">
                 {rssArticles.length > 0 ? (
-                  rssArticles.slice(0, RSS_MAX_ARTICLES).map(article => (
+                  paginatedRssArticles.map(article => (
                     <div
                       key={article.id}
                       className="p-2.5 border rounded hover:bg-accent/50 transition-colors cursor-pointer"
@@ -1427,6 +1440,29 @@ const Index = () => {
                   </p>
                 )}
               </div>
+              {totalRssPages > 1 && (
+                <div className="flex items-center justify-center gap-2 mt-3 pt-3 border-t">
+                  <Button
+                    variant="ghost"
+                    size="sm"
+                    onClick={() => setRssPage(p => Math.max(0, p - 1))}
+                    disabled={rssPage === 0}
+                  >
+                    ‹
+                  </Button>
+                  <span className="text-xs text-muted-foreground">
+                    {rssPage + 1}/{totalRssPages}
+                  </span>
+                  <Button
+                    variant="ghost"
+                    size="sm"
+                    onClick={() => setRssPage(p => Math.min(totalRssPages - 1, p + 1))}
+                    disabled={rssPage >= totalRssPages - 1}
+                  >
+                    ›
+                  </Button>
+                </div>
+              )}
             </CardContent>
           </Card>