From 8f16d5190c72a8ac400024e19a60db0e6445689a Mon Sep 17 00:00:00 2001
From: ajdj100 <ajairplane@gmail.com>
Date: Thu, 18 Dec 2025 21:57:43 -0500
Subject: [PATCH 1/3] fixed incorrect label for extended LOAs when past their
 original end data

---
 ui/src/components/loa/loaList.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/ui/src/components/loa/loaList.vue b/ui/src/components/loa/loaList.vue
index a097af4..844f3ae 100644
--- a/ui/src/components/loa/loaList.vue
+++ b/ui/src/components/loa/loaList.vue
@@ -84,7 +84,7 @@ function loaStatus(loa: LOARequest): "Upcoming" | "Active" | "Overdue" | "Closed
 
     if (now < start) return "Upcoming";
     if (now >= start && now <= end) return "Active";
-    if (now > end) return "Overdue";
+    if (now > loa.extended_till || end) return "Overdue";
 
     return "Overdue"; // fallback
 }

From bb4d6a3a1aa98654ee47f255362f13a338e5956f Mon Sep 17 00:00:00 2001
From: ajdj100 <ajairplane@gmail.com>
Date: Thu, 18 Dec 2025 22:05:51 -0500
Subject: [PATCH 2/3] Fixed button sizing on the loa table

---
 ui/src/components/loa/loaList.vue | 7 ++++---
 1 file changed, 4 insertions(+), 3 deletions(-)

diff --git a/ui/src/components/loa/loaList.vue b/ui/src/components/loa/loaList.vue
index 844f3ae..b52e6a2 100644
--- a/ui/src/components/loa/loaList.vue
+++ b/ui/src/components/loa/loaList.vue
@@ -197,7 +197,7 @@ function setPage(pagenum: number) {
                             <TableCell @click.stop="" class="text-right">
                                 <DropdownMenu>
                                     <DropdownMenuTrigger class="cursor-pointer">
-                                        <Button variant="ghost">
+                                        <Button variant="ghost" size="icon">
                                             <Ellipsis class="size-6"></Ellipsis>
                                         </Button>
                                     </DropdownMenuTrigger>
@@ -220,10 +220,11 @@ function setPage(pagenum: number) {
                                 </DropdownMenu>
                             </TableCell>
                             <TableCell>
-                                <Button v-if="expanded === post.id" @click.stop="expanded = null" variant="ghost">
+                                <Button v-if="expanded === post.id" @click.stop="expanded = null" size="icon"
+                                    variant="ghost">
                                     <ChevronUp class="size-6" />
                                 </Button>
-                                <Button v-else @click.stop="expanded = post.id" variant="ghost">
+                                <Button v-else @click.stop="expanded = post.id" size="icon" variant="ghost">
                                     <ChevronDown class="size-6" />
                                 </Button>
                             </TableCell>

From 871277882d0ef58869064a7a6e925be32082755f Mon Sep 17 00:00:00 2001
From: ajdj100 <ajairplane@gmail.com>
Date: Thu, 18 Dec 2025 22:08:34 -0500
Subject: [PATCH 3/3] imporoved readability of LOA reason

---
 ui/src/components/loa/loaList.vue | 24 +++++++++++++++---------
 1 file changed, 15 insertions(+), 9 deletions(-)

diff --git a/ui/src/components/loa/loaList.vue b/ui/src/components/loa/loaList.vue
index b52e6a2..1785564 100644
--- a/ui/src/components/loa/loaList.vue
+++ b/ui/src/components/loa/loaList.vue
@@ -234,18 +234,24 @@ function setPage(pagenum: number) {
                             <TableCell :colspan="8" class="p-0">
                                 <div class="w-full p-3 mb-6 space-y-3">
                                     <div class="flex justify-between items-start gap-4">
-                                        <div class="flex-1">
-                                            <!-- Title -->
-                                            <p class="text-md font-semibold text-foreground">
-                                                Reason
-                                            </p>
+                                        <div class="space-y-3 w-full">
+
+                                            <!-- Header -->
+                                            <div class="flex items-center gap-2">
+                                                <h4 class="text-sm font-semibold text-foreground">
+                                                    Reason
+                                                </h4>
+                                                <Separator class="flex-1" />
+                                            </div>
 
                                             <!-- Content -->
-                                            <p
-                                                class="mt-1 text-md whitespace-pre-wrap leading-relaxed text-muted-foreground">
-                                                {{ post.reason }}
-                                            </p>
+                                            <div
+                                                class="rounded-lg border bg-muted/40 px-4 py-3 text-sm leading-relaxed whitespace-pre-wrap text-muted-foreground w-full">
+                                                {{ post.reason || 'No reason provided.' }}
+                                            </div>
+
                                         </div>
+
                                     </div>
                                 </div>
                             </TableCell>