feat: enhance useDaily hook and DailyPageClient for improved data handling

- Added `refreshDailySilent` method to `useDaily` for silent data refresh without loading state.
- Updated `useDaily` to accept an optional `initialDailyView` parameter, improving initial state management.
- Modified `DailyPageClient` to utilize `refreshDailySilent` for smoother user experience during checkbox updates.
- Implemented server-side data fetching in `DailyPage` for better initial load performance.
- Enhanced UI to indicate refreshing state in `DailySectionComponent`.

src/app/daily/DailyPageClient.tsx

@@ -3,12 +3,13 @@
 import { useState, useRef, useEffect } from 'react';
 import React from 'react';
 import { useDaily } from '@/hooks/useDaily';
-import { DailyCheckbox } from '@/lib/types';
+import { DailyCheckbox, DailyView } from '@/lib/types';
 import { Button } from '@/components/ui/Button';
 import { Input } from '@/components/ui/Input';
 import { Card } from '@/components/ui/Card';
 import Link from 'next/link';
 import { DailyCalendar } from '@/components/daily/DailyCalendar';
+import { dailyClient } from '@/clients/daily-client';
 
 interface DailySectionProps {
   title: string;
@@ -19,6 +20,7 @@ interface DailySectionProps {
   onUpdateCheckbox: (checkboxId: string, text: string) => Promise<void>;
   onDeleteCheckbox: (checkboxId: string) => Promise<void>;
   saving: boolean;
+  refreshing?: boolean;
 }
 
 function DailySectionComponent({ 
@@ -29,7 +31,8 @@ function DailySectionComponent({
   onToggleCheckbox, 
   onUpdateCheckbox,
   onDeleteCheckbox,
-  saving 
+  saving,
+  refreshing = false
 }: DailySectionProps) {
   const [newCheckboxText, setNewCheckboxText] = useState('');
   const [addingCheckbox, setAddingCheckbox] = useState(false);
@@ -103,8 +106,11 @@ function DailySectionComponent({
   return (
     <Card className="p-4">
       <div className="flex items-center justify-between mb-4">
-        <h2 className="text-lg font-bold text-[var(--foreground)] font-mono">
+        <h2 className="text-lg font-bold text-[var(--foreground)] font-mono flex items-center gap-2">
           {title} <span className="text-sm font-normal text-[var(--muted-foreground)]">({formatShortDate(date)})</span>
+          {refreshing && (
+            <div className="w-4 h-4 border-2 border-[var(--primary)] border-t-transparent rounded-full animate-spin"></div>
+          )}
         </h2>
         <span className="text-xs text-[var(--muted-foreground)] font-mono">
           {checkboxes.filter(cb => cb.isChecked).length}/{checkboxes.length}
@@ -204,14 +210,25 @@ function DailySectionComponent({
   );
 }
 
-export function DailyPageClient() {
+interface DailyPageClientProps {
+  initialDailyView?: DailyView;
+  initialDailyDates?: string[];
+  initialDate?: Date;
+}
+
+export function DailyPageClient({ 
+  initialDailyView, 
+  initialDailyDates = [], 
+  initialDate 
+}: DailyPageClientProps = {}) {
   const {
     dailyView,
     loading,
+    refreshing,
     error,
     saving,
     currentDate,
-    refreshDaily,
+    refreshDailySilent,
     toggleCheckbox,
     updateCheckbox,
     deleteCheckbox,
@@ -219,16 +236,28 @@ export function DailyPageClient() {
     goToNextDay,
     goToToday,
     setDate
-  } = useDaily();
+  } = useDaily(initialDate, initialDailyView);
 
-  const [dailyDates, setDailyDates] = useState<string[]>([]);
+  const [dailyDates, setDailyDates] = useState<string[]>(initialDailyDates);
 
-  // Charger les dates avec des dailies pour le calendrier
+  // Fonction pour rafraîchir la liste des dates avec des dailies
+  const refreshDailyDates = async () => {
+    try {
+      const dates = await dailyClient.getDailyDates();
+      setDailyDates(dates);
+    } catch (error) {
+      console.error('Erreur lors du refresh des dates:', error);
+    }
+  };
+
+  // Charger les dates avec des dailies pour le calendrier (seulement si pas de données SSR)
   useEffect(() => {
-    import('@/clients/daily-client').then(({ dailyClient }) => {
-      return dailyClient.getDailyDates();
-    }).then(setDailyDates).catch(console.error);
-  }, []);
+    if (initialDailyDates.length === 0) {
+      import('@/clients/daily-client').then(({ dailyClient }) => {
+        return dailyClient.getDailyDates();
+      }).then(setDailyDates).catch(console.error);
+    }
+  }, [initialDailyDates.length]);
 
   const handleAddTodayCheckbox = async (text: string) => {
     try {
@@ -238,11 +267,10 @@ export function DailyPageClient() {
         text,
         isChecked: false
       });
-      // Recharger la vue daily après ajout
-      await refreshDaily();
+      // Recharger silencieusement la vue daily (sans clignotement)
+      refreshDailySilent().catch(console.error);
       // Recharger aussi les dates pour le calendrier
-      const updatedDates = await dailyClient.getDailyDates();
-      setDailyDates(updatedDates);
+      await refreshDailyDates();
     } catch (error) {
       console.error('Erreur lors de l\'ajout de la tâche:', error);
     }
@@ -259,11 +287,10 @@ export function DailyPageClient() {
         text,
         isChecked: false
       });
-      // Recharger la vue daily après ajout
-      await refreshDaily();
+      // Recharger silencieusement la vue daily (sans clignotement)
+      refreshDailySilent().catch(console.error);
       // Recharger aussi les dates pour le calendrier
-      const updatedDates = await dailyClient.getDailyDates();
-      setDailyDates(updatedDates);
+      await refreshDailyDates();
     } catch (error) {
       console.error('Erreur lors de l\'ajout de la tâche:', error);
     }
@@ -275,6 +302,8 @@ export function DailyPageClient() {
 
   const handleDeleteCheckbox = async (checkboxId: string) => {
     await deleteCheckbox(checkboxId);
+    // Refresh dates après suppression pour mettre à jour le calendrier
+    await refreshDailyDates();
   };
 
   const handleUpdateCheckbox = async (checkboxId: string, text: string) => {
@@ -416,6 +445,7 @@ export function DailyPageClient() {
               onUpdateCheckbox={handleUpdateCheckbox}
               onDeleteCheckbox={handleDeleteCheckbox}
               saving={saving}
+              refreshing={refreshing}
             />
 
             {/* Section Aujourd'hui */}
@@ -428,6 +458,7 @@ export function DailyPageClient() {
               onUpdateCheckbox={handleUpdateCheckbox}
               onDeleteCheckbox={handleDeleteCheckbox}
               saving={saving}
+              refreshing={refreshing}
             />
             </div>
           )}