From 558b9f69f7a7e9008bb1c2aa92c2085fc13bf758 Mon Sep 17 00:00:00 2001
From: Agustin Pane <agustin.pane@gmail.com>
Date: Mon, 9 Mar 2020 09:15:04 -0300
Subject: [PATCH] - Updates how the transactions are ordered, now orders by
 nonce and then by date (#640)

---
 .../Transactions/TxsTable/index.jsx           | 26 ++++++++++++++++---
 1 file changed, 22 insertions(+), 4 deletions(-)

diff --git a/src/routes/safe/components/Transactions/TxsTable/index.jsx b/src/routes/safe/components/Transactions/TxsTable/index.jsx
index 6663bb58..ebbd8018 100644
--- a/src/routes/safe/components/Transactions/TxsTable/index.jsx
+++ b/src/routes/safe/components/Transactions/TxsTable/index.jsx
@@ -74,13 +74,31 @@ const TxsTable = ({
   const columns = generateColumns()
   const autoColumns = columns.filter(c => !c.custom)
   const filteredData = getTxTableData(transactions, cancellationTransactions)
-    .sort(({ dateOrder: a }, { dateOrder: b }) => {
-      if (!a || !b) {
+    .sort((tx1, tx2) => {
+      // First order by nonce
+      const aNonce = tx1.tx.nonce
+      const bNonce = tx1.tx.nonce
+      if (aNonce && bNonce) {
+        const difference = aNonce - bNonce
+        if (difference !== 0) {
+          return difference
+        }
+      }
+      // If can't be ordered by nonce, order by date
+      const aDateOrder = tx1.dateOrder
+      const bDateOrder = tx2.dateOrder
+      // Second by date
+      if (!aDateOrder || !bDateOrder) {
         return 0
       }
-      return a - b
+      return aDateOrder - bDateOrder
+    })
+    .map((tx, id) => {
+      return {
+        ...tx,
+        id,
+      }
     })
-    .map((tx, id) => ({ ...tx, id }))
 
   return (
     <Block className={classes.container}>