From 84bc0b18ee7dc780de9be65d8fb71f1be7363579 Mon Sep 17 00:00:00 2001
From: Ewa Kowalska <30404388+ekowalsk@users.noreply.github.com>
Date: Fri, 15 Jan 2021 11:44:42 +0100
Subject: [PATCH] Sort bounties in descending order (#4421)

---
 packages/page-bounties/src/Bounties.spec.tsx | 18 ++++++++++++++++
 packages/page-bounties/src/Bounties.tsx      | 22 +++++++++++---------
 packages/page-bounties/src/Bounty.tsx        |  2 +-
 3 files changed, 31 insertions(+), 11 deletions(-)

diff --git a/packages/page-bounties/src/Bounties.spec.tsx b/packages/page-bounties/src/Bounties.spec.tsx
index 4678ffbbba..820f561a55 100644
--- a/packages/page-bounties/src/Bounties.spec.tsx
+++ b/packages/page-bounties/src/Bounties.spec.tsx
@@ -220,6 +220,24 @@ describe('Bounties', () => {
     expect(queryAllByText('No open bounties')).toHaveLength(0);
   });
 
+  it('renders bounties in order from newest to oldest', async () => {
+    const bounty1 = bountyInStatus('Proposed');
+    const bounty2 = bountyInStatus('Proposed');
+    const bounty3 = bountyInStatus('Proposed');
+
+    const { findAllByTestId } = renderBounties({ bounties: [
+      { bounty: bounty1, description: 'bounty 2', index: anIndex(2), proposals: [] },
+      { bounty: bounty2, description: 'bounty 1', index: anIndex(1), proposals: [] },
+      { bounty: bounty3, description: 'bounty 3', index: anIndex(3), proposals: [] }
+    ] });
+
+    const descriptions = await findAllByTestId('description');
+
+    expect(descriptions[0].textContent).toEqual('bounty 3');
+    expect(descriptions[1].textContent).toEqual('bounty 2');
+    expect(descriptions[2].textContent).toEqual('bounty 1');
+  });
+
   describe('create bounty modal', () => {
     it('validates bounty length', async () => {
       const { findByTestId, findByText } = renderBounties({ maximumReasonLength: 5 });
diff --git a/packages/page-bounties/src/Bounties.tsx b/packages/page-bounties/src/Bounties.tsx
index 4e38855bac..2a6ccc8778 100644
--- a/packages/page-bounties/src/Bounties.tsx
+++ b/packages/page-bounties/src/Bounties.tsx
@@ -38,16 +38,18 @@ function Bounties (): React.ReactElement {
         empty={bounties && t<string>('No open bounties')}
         header={headerRef.current}
       >
-        {bounties && bestNumber && bounties.map(({ bounty, description, index, proposals }) => (
-          <Bounty
-            bestNumber={bestNumber}
-            bounty={bounty}
-            description={description}
-            index={index}
-            key={index.toNumber()}
-            proposals={proposals}
-          />
-        ))}
+        {bounties && bestNumber &&
+        bounties.sort((a, b) => b.index.cmp(a.index))
+          .map(({ bounty, description, index, proposals }) => (
+            <Bounty
+              bestNumber={bestNumber}
+              bounty={bounty}
+              description={description}
+              index={index}
+              key={index.toNumber()}
+              proposals={proposals}
+            />
+          ))}
       </Table>
     </>
   );
diff --git a/packages/page-bounties/src/Bounty.tsx b/packages/page-bounties/src/Bounty.tsx
index abfa73028a..bb4c4c9543 100644
--- a/packages/page-bounties/src/Bounty.tsx
+++ b/packages/page-bounties/src/Bounty.tsx
@@ -66,7 +66,7 @@ function Bounty ({ bestNumber, bounty, className = '', description, index, propo
             )}
           </div>
         </td>
-        <td>{truncateTitle(description, 30)}</td>
+        <td data-testid='description'>{truncateTitle(description, 30)}</td>
         <td><FormatBalance value={value} /></td>
         <td>{curator ? <AddressSmall value={curator} /> : EMPTY_CELL}</td>
         <td><DueBlocks dueBlocks={blocksUntilUpdate} /></td>