diff --git a/components/email.tsx b/components/email.tsx
index 75a5b95..dee4e00 100644
--- a/components/email.tsx
+++ b/components/email.tsx
@@ -7,6 +7,7 @@ import { RefreshCw, Mail } from "lucide-react";
 import { useSession, signIn } from "next-auth/react";
 import { formatDistance } from 'date-fns/formatDistance';
 import { fr } from 'date-fns/locale/fr';
+import { useRouter } from "next/navigation";
 
 interface Email {
   id: string;
@@ -32,6 +33,7 @@ export function Email() {
   const [error, setError] = useState<string | null>(null);
   const [refreshing, setRefreshing] = useState(false);
   const { status } = useSession();
+  const router = useRouter();
 
   const fetchEmails = async (isRefresh = false) => {
     if (isRefresh) setRefreshing(true);
@@ -186,7 +188,7 @@ export function Email() {
                 <div
                   key={email.id}
                   className="p-2 hover:bg-gray-50/50 rounded-lg transition-colors cursor-pointer"
-                  onClick={() => mailUrl && window.open(mailUrl, '_blank')}
+                  onClick={() => router.push('/mail')}
                 >
                   <div className="flex items-center justify-between mb-1">
                     <span className="text-sm text-gray-600 truncate max-w-[60%]" title={email.fromName || email.from}>