news widget

components/news.tsx

@@ -5,13 +5,12 @@ import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
 import { Button } from "@/components/ui/button";
 import { RefreshCw, Telescope } from "lucide-react";
 import { useSession } from "next-auth/react";
-import { formatDistance } from 'date-fns';
-import { fr } from 'date-fns/locale';
 
 interface NewsItem {
   id: number;
   title: string;
-  date: string;
+  displayDate: string;
+  timestamp: string;
   source: string;
   description: string | null;
   category: string | null;
@@ -36,6 +35,14 @@ export function News() {
       }
       
       const data = await response.json();
+      
+      // Debug log the date values
+      console.log('News data dates:', data.map((item: NewsItem) => ({ 
+        id: item.id, 
+        displayDate: item.displayDate,
+        timestamp: item.timestamp
+      })));
+      
       setNews(data);
       setError(null);
     } catch (err) {
@@ -53,19 +60,6 @@ export function News() {
     }
   }, [status]);
 
-  const formatDate = (dateString: string) => {
-    try {
-      const date = new Date(dateString);
-      return formatDistance(date, new Date(), {
-        addSuffix: true,
-        locale: fr
-      });
-    } catch (err) {
-      console.error('Error formatting date:', err);
-      return dateString;
-    }
-  };
-
   if (status === 'loading' || loading) {
     return (
       <Card className="transition-transform duration-500 ease-in-out transform hover:scale-105 bg-white/95 backdrop-blur-sm border-0 shadow-lg">
@@ -117,12 +111,12 @@ export function News() {
                 >
                   <div className="flex flex-col gap-1">
                     <div className="flex items-center justify-between text-xs">
-                      <span className="text-gray-500">{formatDate(item.date)}</span>
+                      <span className="text-gray-500">{item.displayDate}</span>
                     </div>
                     <h3 className="text-sm font-medium text-gray-800 line-clamp-2" title={item.title}>
                       {item.title}
                     </h3>
-                    <p className="text-xs text-gray-500 line-clamp-2" title={item.description}>
+                    <p className="text-xs text-gray-500 line-clamp-2" title={item.description || undefined}>
                       {item.description}
                     </p>
                   </div>