Make transaction list sortable by cleared status

actualbudget · Nov 29, 2023 · 0e1a3b8 · 0e1a3b8
1 parent 29f323e
commit 0e1a3b8
Show file tree

Hide file tree

Showing 2 changed files with 26 additions and 3 deletions.
diff --git a/packages/desktop-client/src/components/transactions/TransactionsTable.js b/packages/desktop-client/src/components/transactions/TransactionsTable.js
@@ -365,8 +365,22 @@ const TransactionHeader = memo(
           }
         />
         {showBalance && <Cell value="Balance" width={88} textAlign="right" />}
-        {showCleared && <Field width={23} truncate={false} />}
+
+        {showCleared && (
+          <HeaderCell
+            value="Cleared"
+            width={85}
+            alignItems="center"
+            id="cleared"
+            icon={field === 'cleared' ? ascDesc : 'clickable'}
+            onClick={() =>
+              onSort('cleared', selectAscDesc(field, ascDesc, 'cleared', 'desc'))
+            }
+          />
+        )}
+
         <Cell value="" width={5 + scrollWidth ?? 0} />
+
       </Row>
     );
   },
@@ -437,9 +451,11 @@ function StatusCell({
   return (
     <Cell
       name="cleared"
-      width={23}
+      width={85}
       focused={focused}
-      style={{ padding: 1 }}
+      style={{
+        alignItems: 'center'
+      }}
       plain
     >
       <CellButton
@@ -1337,6 +1353,7 @@ const Transaction = memo(function Transaction(props) {
           isChild={isChild}
           onEdit={onEdit}
           onUpdate={onUpdate}
+          width={85}
         />
       )}
 

diff --git a/upcoming-release-notes/1994.md b/upcoming-release-notes/1994.md
@@ -0,0 +1,6 @@
+---
+category: Enhancements
+authors: [jaarasys-henria]
+---
+
+Make transaction list sortable by cleared status