feat: add uncategorized transaction count and percentage to transactions page; adjust table height for better layout

app/transactions/page.tsx

@@ -112,6 +112,11 @@ export default function TransactionsPage() {
   const filteredTransactions = transactionsData?.transactions || [];
   const totalTransactions = transactionsData?.total || 0;
   const hasMore = transactionsData?.hasMore || false;
+  const uncategorizedCount = transactionsData?.uncategorizedCount || 0;
+  const uncategorizedPercent =
+    totalTransactions > 0
+      ? Math.round((uncategorizedCount / totalTransactions) * 100)
+      : 0;
 
   // For filter comboboxes, we'll use empty arrays for now
   // They can be enhanced later with separate queries if needed
@@ -133,7 +138,11 @@ export default function TransactionsPage() {
     <PageLayout>
       <PageHeader
         title="Transactions"
-        description={`${totalTransactions} transaction${totalTransactions > 1 ? "s" : ""}`}
+        description={
+          totalTransactions > 0
+            ? `${totalTransactions} transaction${totalTransactions > 1 ? "s" : ""} • ${uncategorizedPercent}% non catégorisées`
+            : `${totalTransactions} transaction${totalTransactions > 1 ? "s" : ""}`
+        }
         actions={
           <OFXImportDialog onImportComplete={invalidateAll}>
             <Button className="md:h-10 md:px-5">

components/transactions/transaction-table.tsx

@@ -238,7 +238,7 @@ export function TransactionTable({
             <div
               ref={parentRef}
               className="overflow-auto"
-              style={{ height: "calc(100vh - 300px)", minHeight: "400px" }}
+              style={{ height: "calc(100vh - 200px)", minHeight: "600px" }}
             >
               <div
                 style={{
@@ -468,7 +468,7 @@ export function TransactionTable({
             <div
               ref={parentRef}
               className="overflow-auto"
-              style={{ height: "calc(100vh - 400px)", minHeight: "400px" }}
+              style={{ height: "calc(100vh - 200px)", minHeight: "700px" }}
             >
               <div
                 style={{

services/banking.service.ts

@@ -26,6 +26,7 @@ export interface TransactionsPaginatedResult {
   transactions: Transaction[];
   total: number;
   hasMore: boolean;
+  uncategorizedCount: number;
 }
 
 export const bankingService = {
@@ -210,6 +211,15 @@ export const bankingService = {
     // Get total count
     const total = await prisma.transaction.count({ where });
 
+    // Get uncategorized count with same filters
+    const uncategorizedWhere = {
+      ...where,
+      categoryId: null,
+    };
+    const uncategorizedCount = await prisma.transaction.count({
+      where: uncategorizedWhere,
+    });
+
     // Get paginated transactions
     const transactions = await prisma.transaction.findMany({
       where,
@@ -252,6 +262,7 @@ export const bankingService = {
       transactions: transformedTransactions,
       total,
       hasMore: offset + limit < total,
+      uncategorizedCount,
     };
   },