From bbd37953217d4d2dac66d6403c028ee157879671 Mon Sep 17 00:00:00 2001
From: gabaldon <maria@otherplane.com>
Date: Wed, 17 Nov 2021 13:55:29 +0100
Subject: [PATCH] fix: update sort order

---
 packages/ui/components/Main.vue               | 52 ++++++++-----------
 packages/ui/tests/utils/sortByNetwork.spec.js | 23 ++++++++
 packages/ui/utils/sortByNetwork.js            | 17 ++++++
 3 files changed, 61 insertions(+), 31 deletions(-)
 create mode 100644 packages/ui/tests/utils/sortByNetwork.spec.js
 create mode 100644 packages/ui/utils/sortByNetwork.js

diff --git a/packages/ui/components/Main.vue b/packages/ui/components/Main.vue
index 0097119b..2b05adc8 100644
--- a/packages/ui/components/Main.vue
+++ b/packages/ui/components/Main.vue
@@ -28,6 +28,7 @@ import feeds from '@/apollo/queries/feeds.gql'
 import networks from '@/apollo/queries/networks.gql'
 import { formatSvgName } from '../utils/formatSvgName'
 import { generateSelectOptions } from '../utils/generateSelectOptions'
+import { sortByNetwork } from '../utils/sortByNetwork'
 
 export default {
   apollo: {
@@ -63,37 +64,26 @@ export default {
     },
     allFeeds() {
       if (this.feeds) {
-        return this.feeds.feeds
-          .map((feed) => {
-            return {
-              detailsPath: {
-                name: 'feeds-id',
-                params: { id: feed.feedFullName },
-              },
-              decimals: parseInt(feed.feedFullName.split('_').pop()) || 3,
-              name: feed.name,
-              value: feed.lastResult,
-              label: feed.label,
-              img: {
-                name: formatSvgName(feed.name),
-                alt: feed.name,
-              },
-              network: feed.network,
-              color: feed.color,
-              blockExplorer: feed.blockExplorer,
-            }
-          })
-          .sort((a, b) => {
-            if (a.network.includes('ethereum-mainnet')) {
-              return -1
-            } else if (a.network.includes('ethereum')) {
-              return 0
-            } else if (a.network < b.network) {
-              return 1
-            } else {
-              return 2
-            }
-          })
+        const result = this.feeds.feeds.map((feed) => {
+          return {
+            detailsPath: {
+              name: 'feeds-id',
+              params: { id: feed.feedFullName },
+            },
+            decimals: parseInt(feed.feedFullName.split('_').pop()) || 3,
+            name: feed.name,
+            value: feed.lastResult,
+            label: feed.label,
+            img: {
+              name: formatSvgName(feed.name),
+              alt: feed.name,
+            },
+            network: feed.network,
+            color: feed.color,
+            blockExplorer: feed.blockExplorer,
+          }
+        })
+        return sortByNetwork(result)
       } else {
         return []
       }
diff --git a/packages/ui/tests/utils/sortByNetwork.spec.js b/packages/ui/tests/utils/sortByNetwork.spec.js
new file mode 100644
index 00000000..640822ea
--- /dev/null
+++ b/packages/ui/tests/utils/sortByNetwork.spec.js
@@ -0,0 +1,23 @@
+import { sortByNetwork } from '../../utils/sortByNetwork'
+
+describe('sortByNetwork.js', () => {
+  it('orders ethereum-mainnet first, ethereum remainning networks in second place, and the rest alphabetically', () => {
+    const feeds = [
+      { network: 'boba-rinkeby' },
+      { network: 'conflux-testnet' },
+      { network: 'ethereum-rinkeby' },
+      { network: 'ethereum-mainnet' },
+      { network: 'ethereum-goerli' },
+    ]
+
+    const options = sortByNetwork(feeds)
+
+    expect(options).toStrictEqual([
+      { network: 'ethereum-mainnet' },
+      { network: 'ethereum-rinkeby' },
+      { network: 'ethereum-goerli' },
+      { network: 'boba-rinkeby' },
+      { network: 'conflux-testnet' },
+    ])
+  })
+})
diff --git a/packages/ui/utils/sortByNetwork.js b/packages/ui/utils/sortByNetwork.js
new file mode 100644
index 00000000..4cb3eafe
--- /dev/null
+++ b/packages/ui/utils/sortByNetwork.js
@@ -0,0 +1,17 @@
+export function sortByNetwork(feeds) {
+  return feeds.sort((firstFeed, secondFeed) => {
+    if (
+      firstFeed.network.includes('ethereum-mainnet') &&
+      !secondFeed.network.includes('ethereum-mainnet')
+    ) {
+      return -1
+    } else if (
+      firstFeed.network.includes('ethereum') &&
+      !secondFeed.network.includes('ethereum')
+    ) {
+      return -1
+    } else {
+      return 0
+    }
+  })
+}