diff --git a/components/calendar.tsx b/components/calendar.tsx
index 1d47c83..97ba772 100644
--- a/components/calendar.tsx
+++ b/components/calendar.tsx
@@ -27,7 +27,10 @@ export function Calendar() {
   const { data: session, status } = useSession();
 
   const fetchEvents = async (forceRefresh: boolean = false) => {
-    setLoading(true);
+    // Only show loading spinner on initial load or manual refresh, not on auto-refresh
+    if (forceRefresh || events.length === 0) {
+      setLoading(true);
+    }
     try {
       const url = forceRefresh ? '/api/calendars?refresh=true' : '/api/calendars';
       const response = await fetch(url);
@@ -152,7 +155,10 @@ export function Calendar() {
       console.error('Error fetching events:', err);
       setError('Failed to load events');
     } finally {
-      setLoading(false);
+      // Only hide loading if we showed it
+      if (forceRefresh || events.length === 0) {
+        setLoading(false);
+      }
     }
   };
 
diff --git a/components/email.tsx b/components/email.tsx
index 1c956b6..f2cb0bf 100644
--- a/components/email.tsx
+++ b/components/email.tsx
@@ -2,6 +2,7 @@
 
 import { useEffect, useState, useMemo, useRef } from "react";
 import { useSession } from "next-auth/react";
+import { useRouter } from "next/navigation";
 import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
 import { Button } from "@/components/ui/button";
 import { RefreshCw, MessageSquare, Mail, MailOpen, Loader2 } from "lucide-react";
@@ -30,6 +31,7 @@ interface EmailResponse {
 
 export function Email() {
   const { data: session, status } = useSession();
+  const router = useRouter();
   const [emails, setEmails] = useState<Email[]>([]);
   const [loading, setLoading] = useState(false);
   const [refreshing, setRefreshing] = useState(false);
@@ -353,7 +355,23 @@ export function Email() {
         </Button>
       </CardHeader>
       <CardContent className="p-4">
-        {error ? (
+        {accounts.length === 0 ? (
+          <div className="text-center py-6 flex flex-col items-center gap-3">
+            <Mail className="h-8 w-8 text-gray-400" />
+            <div>
+              <p className="text-gray-700 text-sm font-medium mb-1">Aucun compte email configuré</p>
+              <p className="text-gray-500 text-xs mb-3">Configurez votre compte email pour voir vos messages</p>
+              <Button
+                variant="default"
+                size="sm"
+                onClick={() => router.push('/courrier')}
+                className="bg-blue-600 hover:bg-blue-700 text-white"
+              >
+                Configurer un compte
+              </Button>
+            </div>
+          </div>
+        ) : error ? (
           <div className="text-center py-4">
             <p className="text-red-500 text-sm mb-2">{error}</p>
             {Object.keys(accountErrors).length > 0 && (