From 99408bfc730523b082fcb432048f53e4f6cc4e71 Mon Sep 17 00:00:00 2001
From: Alma <alma@MacBook-Air-de-Alma.local>
Date: Sat, 12 Apr 2025 23:21:36 +0200
Subject: [PATCH] working leantime widget 131

---
 components/flow.tsx | 22 ++++++++++++++--------
 1 file changed, 14 insertions(+), 8 deletions(-)

diff --git a/components/flow.tsx b/components/flow.tsx
index 784b48da..8fe1049e 100644
--- a/components/flow.tsx
+++ b/components/flow.tsx
@@ -117,7 +117,7 @@ export function Flow() {
             return a.status === 4 ? -1 : 1;
           }
           
-          // Then sort by dateToFinish
+          // Then sort by dateToFinish (oldest first)
           const dateA = getValidDate(a);
           const dateB = getValidDate(b);
           
@@ -166,16 +166,22 @@ export function Flow() {
 
       const month = date.toLocaleString('fr-FR', { month: 'short' }).toUpperCase();
       const day = date.getDate();
+      const year = date.getFullYear();
       
       return (
-        <>
-          <span className={`text-xs font-medium uppercase ${isPastDue ? 'text-red-600' : 'text-blue-600'}`}>
-            {month}
+        <div className="flex flex-col items-center">
+          <div className="flex flex-col items-center">
+            <span className={`text-xs font-medium uppercase ${isPastDue ? 'text-red-600' : 'text-blue-600'}`}>
+              {month}
+            </span>
+            <span className={`text-lg font-bold ${isPastDue ? 'text-red-700' : 'text-blue-700'}`}>
+              {day}
+            </span>
+          </div>
+          <span className={`text-[10px] font-medium ${isPastDue ? 'text-red-500' : 'text-blue-500'}`}>
+            {year}
           </span>
-          <span className={`text-lg font-bold ${isPastDue ? 'text-red-700' : 'text-blue-700'}`}>
-            {day}
-          </span>
-        </>
+        </div>
       );
     } catch (error) {
       console.error('Error formatting date for task', task.id, error);