From 4a201e7325420a27c2e5b201b1523e82c7757bcf Mon Sep 17 00:00:00 2001
From: Matthias Kretschmann <m@kretschmann.io>
Date: Thu, 22 Oct 2020 16:19:26 +0200
Subject: [PATCH] sort arrays before putting it in state

---
 src/components/pages/History/ComputeJobs.tsx  | 23 ++++++++++++-------
 .../pages/History/PoolTransactions.tsx        | 15 ++++++------
 2 files changed, 22 insertions(+), 16 deletions(-)

diff --git a/src/components/pages/History/ComputeJobs.tsx b/src/components/pages/History/ComputeJobs.tsx
index 3061f3d65..4b967a92a 100644
--- a/src/components/pages/History/ComputeJobs.tsx
+++ b/src/components/pages/History/ComputeJobs.tsx
@@ -114,13 +114,12 @@ export default function ComputeJobs(): ReactElement {
             })
           })
         }
-        setJobs(
-          jobs.sort((a, b) => {
-            if (a.dateCreated > b.dateCreated) return -1
-            if (a.dateCreated < b.dateCreated) return 1
-            return 0
-          })
-        )
+        const jobsSorted = jobs.sort((a, b) => {
+          if (a.dateCreated > b.dateCreated) return -1
+          if (a.dateCreated < b.dateCreated) return 1
+          return 0
+        })
+        setJobs(jobsSorted)
       } catch (error) {
         Logger.log(error.message)
       } finally {
@@ -130,5 +129,13 @@ export default function ComputeJobs(): ReactElement {
     getJobs()
   }, [ocean, account])
 
-  return <Table columns={columns} data={jobs} isLoading={isLoading} />
+  return (
+    <Table
+      columns={columns}
+      data={jobs}
+      isLoading={isLoading}
+      defaultSortField="row.dateCreated"
+      defaultSortAsc={false}
+    />
+  )
 }
diff --git a/src/components/pages/History/PoolTransactions.tsx b/src/components/pages/History/PoolTransactions.tsx
index ffbf80e8c..368235732 100644
--- a/src/components/pages/History/PoolTransactions.tsx
+++ b/src/components/pages/History/PoolTransactions.tsx
@@ -75,14 +75,13 @@ export default function PoolTransactions(): ReactElement {
       if (!ocean || !accountId) return
       setIsLoading(true)
       const logs = await ocean.pool.getAllPoolLogs(accountId)
-      setLogs(
-        // sort logs by date, newest first
-        logs.sort((a, b) => {
-          if (a.timestamp > b.timestamp) return -1
-          if (a.timestamp < b.timestamp) return 1
-          return 0
-        })
-      )
+      // sort logs by date, newest first
+      const logsSorted = logs.sort((a, b) => {
+        if (a.timestamp > b.timestamp) return -1
+        if (a.timestamp < b.timestamp) return 1
+        return 0
+      })
+      setLogs(logsSorted)
       setIsLoading(false)
     }
     getLogs()