update widget 2

app/api/rocket-chat/messages/route.ts

@@ -0,0 +1,39 @@
+import { getServerSession } from "next-auth";
+import { authOptions } from "@/app/api/auth/[...nextauth]/route";
+import { NextResponse } from "next/server";
+
+export async function GET() {
+  try {
+    const session = await getServerSession(authOptions);
+    if (!session) {
+      return NextResponse.json({ error: "Unauthorized" }, { status: 401 });
+    }
+
+    // Get messages from Rocket.Chat
+    const response = await fetch('https://parole.slm-lab.net/api/v1/channels.messages?roomName=general', {
+      headers: {
+        'Cookie': `rc_token=${session.accessToken}`, // Use the session token
+      },
+    });
+
+    if (!response.ok) {
+      console.error('Rocket.Chat API error:', {
+        status: response.status,
+        statusText: response.statusText,
+      });
+      return NextResponse.json(
+        { error: "Failed to fetch messages" },
+        { status: response.status }
+      );
+    }
+
+    const data = await response.json();
+    return NextResponse.json(data);
+  } catch (error) {
+    console.error('Error fetching messages:', error);
+    return NextResponse.json(
+      { error: "Internal server error" },
+      { status: 500 }
+    );
+  }
+} 

components/parole.tsx

@@ -22,38 +22,14 @@ export function Parole() {
   useEffect(() => {
     const fetchMessages = async () => {
       try {
-        // First, login to get auth token
-        const loginResponse = await fetch('https://parole.slm-lab.net/api/v1/login', {
-          method: 'POST',
-          headers: {
-            'Content-Type': 'application/json',
-          },
-          body: JSON.stringify({
-            user: process.env.NEXT_PUBLIC_ROCKET_CHAT_USER,
-            password: process.env.NEXT_PUBLIC_ROCKET_CHAT_PASSWORD,
-          }),
-        });
-
-        if (!loginResponse.ok) {
-          throw new Error('Failed to authenticate with RocketChat');
+        const response = await fetch('/api/rocket-chat/messages');
+        if (!response.ok) {
+          const errorData = await response.json();
+          throw new Error(errorData.error || 'Failed to fetch messages');
         }
 
-        const { data: authData } = await loginResponse.json();
-
-        // Then fetch messages using the auth token
-        const messagesResponse = await fetch('https://parole.slm-lab.net/api/v1/channels.messages?roomName=general', {
-          headers: {
-            'X-Auth-Token': authData.authToken,
-            'X-User-Id': authData.userId,
-          },
-        });
-
-        if (!messagesResponse.ok) {
-          throw new Error('Failed to fetch messages');
-        }
-
-        const { messages: chatMessages } = await messagesResponse.json();
-        setMessages(chatMessages);
+        const data = await response.json();
+        setMessages(data.messages || []);
         setError(null);
       } catch (err) {
         console.error('Error fetching messages:', err);
@@ -64,6 +40,9 @@ export function Parole() {
     };
 
     fetchMessages();
+    // Set up polling every 30 seconds
+    const interval = setInterval(fetchMessages, 30000);
+    return () => clearInterval(interval);
   }, []);
 
   return (
@@ -75,11 +54,11 @@ export function Parole() {
         {loading && <p>Loading messages...</p>}
         {error && <p className="text-red-500">Error: {error}</p>}
         {!loading && !error && (
-          <div className="space-y-4">
+          <div className="space-y-4 max-h-[500px] overflow-y-auto">
             {messages.map((message) => (
               <div key={message._id} className="border-b pb-2">
                 <p className="font-medium">{message.u.name || message.u.username}</p>
-                <p className="text-sm">{message.msg}</p>
+                <p className="text-sm whitespace-pre-wrap">{message.msg}</p>
                 <p className="text-xs text-gray-500">
                   {new Date(message.ts).toLocaleString()}
                 </p>