diff --git a/components/parole.tsx b/components/parole.tsx
index 1b1167dc..93a390b4 100644
--- a/components/parole.tsx
+++ b/components/parole.tsx
@@ -6,6 +6,7 @@ import { Button } from "@/components/ui/button";
 import { RefreshCw } from "lucide-react";
 import { useRouter } from "next/navigation";
 import { Avatar, AvatarFallback, AvatarImage } from "@/components/ui/avatar";
+import { signIn, useSession } from "next-auth/react";
 
 interface Message {
   _id: string;
@@ -26,6 +27,7 @@ export function Parole() {
   const [loading, setLoading] = useState(true);
   const [refreshing, setRefreshing] = useState(false);
   const router = useRouter();
+  const { data: session, status } = useSession();
 
   const fetchMessages = async (isRefresh = false) => {
     try {
@@ -33,11 +35,16 @@ export function Parole() {
         setRefreshing(true);
       }
       const response = await fetch('/api/rocket-chat/messages', {
-        // Prevent caching
         cache: 'no-store',
         next: { revalidate: 0 },
       });
       
+      if (response.status === 401) {
+        // Handle authentication error
+        setError('Session expired. Please sign in again.');
+        return;
+      }
+
       if (!response.ok) {
         const errorData = await response.json();
         throw new Error(errorData.error || 'Failed to fetch messages');
@@ -53,7 +60,13 @@ export function Parole() {
       setError(null);
     } catch (err) {
       console.error('Error fetching messages:', err);
-      setError(err instanceof Error ? err.message : 'Failed to fetch messages');
+      const errorMessage = err instanceof Error ? err.message : 'Failed to fetch messages';
+      setError(errorMessage);
+      
+      // Clear polling if we have an authentication error
+      if (errorMessage.includes('Session expired')) {
+        return;
+      }
     } finally {
       setLoading(false);
       setRefreshing(false);
@@ -61,11 +74,44 @@ export function Parole() {
   };
 
   useEffect(() => {
-    fetchMessages();
-    // Set up polling every 30 seconds
-    const interval = setInterval(() => fetchMessages(), 30000);
-    return () => clearInterval(interval);
-  }, []);
+    if (status === 'authenticated') {
+      fetchMessages();
+      // Set up polling every 30 seconds
+      const interval = setInterval(() => fetchMessages(), 30000);
+      return () => clearInterval(interval);
+    }
+  }, [status]);
+
+  if (status === 'loading') {
+    return (
+      <Card className="bg-white/50 backdrop-blur-sm">
+        <CardContent className="p-6">
+          <p className="text-center text-muted-foreground">Loading...</p>
+        </CardContent>
+      </Card>
+    );
+  }
+
+  if (status === 'unauthenticated' || (error && error.includes('Session expired'))) {
+    return (
+      <Card className="bg-white/50 backdrop-blur-sm">
+        <CardContent className="p-6">
+          <div className="text-center">
+            <p className="text-muted-foreground mb-4">Please sign in to view messages</p>
+            <Button 
+              onClick={(e) => {
+                e.stopPropagation();
+                signIn('keycloak');
+              }}
+              variant="default"
+            >
+              Sign In
+            </Button>
+          </div>
+        </CardContent>
+      </Card>
+    );
+  }
 
   return (
     <Card