From 8411721b47df5ae8884aaf860b66f77dc29ec0ca Mon Sep 17 00:00:00 2001
From: Thuc Nguyen Duy <duythucbk@gmail.com>
Date: Tue, 15 Aug 2023 16:10:40 +0700
Subject: [PATCH] [issue-920] Support sort token by value

---
 src/screens/Home/Crowdloans/index.tsx         | 12 ++++++++--
 src/screens/Home/Crypto/TokenGroups.tsx       | 14 ++++++++---
 src/screens/Home/Crypto/TokenGroupsDetail.tsx |  6 ++++-
 .../Staking/Balance/StakingBalanceList.tsx    | 23 ++++++++++++++++++-
 4 files changed, 48 insertions(+), 7 deletions(-)

diff --git a/src/screens/Home/Crowdloans/index.tsx b/src/screens/Home/Crowdloans/index.tsx
index e93723819..63c04ed53 100644
--- a/src/screens/Home/Crowdloans/index.tsx
+++ b/src/screens/Home/Crowdloans/index.tsx
@@ -1,4 +1,4 @@
-import React, { useCallback, useEffect } from 'react';
+import React, { useCallback, useEffect, useMemo } from 'react';
 import i18n from 'utils/i18n/i18n';
 import { ListRenderItemInfo } from 'react-native';
 import { CrowdloanItem } from 'screens/Home/Crowdloans/CrowdloanItem';
@@ -44,6 +44,14 @@ export const CrowdloansScreen = () => {
     { label: i18n.filterOptions.win, value: FilterValue.WINNER },
     { label: i18n.filterOptions.fail, value: FilterValue.FAIL },
   ];
+  const crowdloanData = useMemo(() => {
+    const result = items.sort(
+      // @ts-ignore
+      (firstItem, secondItem) => secondItem.convertedContribute - firstItem.convertedContribute,
+    );
+
+    return result;
+  }, [items]);
 
   useEffect(() => {
     if (isFocused) {
@@ -85,7 +93,7 @@ export const CrowdloansScreen = () => {
         renderListEmptyComponent={renderListEmptyComponent}
         renderItem={renderItem}
         autoFocus={false}
-        items={items}
+        items={crowdloanData}
         showLeftBtn={false}
         searchFunction={doFilterOptions}
         filterOptions={defaultFilterOpts}
diff --git a/src/screens/Home/Crypto/TokenGroups.tsx b/src/screens/Home/Crypto/TokenGroups.tsx
index 3d9078336..c2cd5b4a6 100644
--- a/src/screens/Home/Crypto/TokenGroups.tsx
+++ b/src/screens/Home/Crypto/TokenGroups.tsx
@@ -93,13 +93,16 @@ export const TokenGroups = () => {
   );
 
   const tokenGroupBalanceItems = useMemo<TokenBalanceItemType[]>(() => {
-    const result: TokenBalanceItemType[] = [];
+    const balanceItemData: TokenBalanceItemType[] = [];
 
     sortedTokenGroups.forEach(tokenGroupSlug => {
       if (tokenGroupBalanceMap[tokenGroupSlug]) {
-        result.push(tokenGroupBalanceMap[tokenGroupSlug]);
+        balanceItemData.push(tokenGroupBalanceMap[tokenGroupSlug]);
       }
     });
+    const result = balanceItemData
+      // @ts-ignore
+      .sort((firstItem, secondItem) => secondItem.total.convertedValue - firstItem.total.convertedValue);
 
     return result;
   }, [sortedTokenGroups, tokenGroupBalanceMap]);
@@ -185,7 +188,12 @@ export const TokenGroups = () => {
       }
     });
 
-    return items;
+    const result = items
+      // @ts-ignore
+      .sort((firstItem, secondItem) => firstItem.total.convertedValue - secondItem.total.convertedValue)
+      .reverse();
+
+    return result;
   }, [sortedTokenSlugs, tokenBalanceMap]);
 
   const listHeaderNode = useMemo(() => {
diff --git a/src/screens/Home/Crypto/TokenGroupsDetail.tsx b/src/screens/Home/Crypto/TokenGroupsDetail.tsx
index 509724709..84aacd4ac 100644
--- a/src/screens/Home/Crypto/TokenGroupsDetail.tsx
+++ b/src/screens/Home/Crypto/TokenGroupsDetail.tsx
@@ -105,7 +105,11 @@ export const TokenGroupsDetail = ({
           }
         });
 
-        return items;
+        return (
+          items
+            // @ts-ignore
+            .sort((firstItem, secondItem) => secondItem.total.convertedValue - firstItem.total.convertedValue)
+        );
       }
 
       if (tokenBalanceMap[tokenGroupSlug]) {
diff --git a/src/screens/Home/Staking/Balance/StakingBalanceList.tsx b/src/screens/Home/Staking/Balance/StakingBalanceList.tsx
index 2ec7b63e7..dd0d7e1b6 100644
--- a/src/screens/Home/Staking/Balance/StakingBalanceList.tsx
+++ b/src/screens/Home/Staking/Balance/StakingBalanceList.tsx
@@ -17,6 +17,7 @@ import { StakingType } from '@subwallet/extension-base/background/KoniTypes';
 import { RootNavigationProps } from 'routes/index';
 import { EmptyList } from 'components/EmptyList';
 import { setAdjustPan } from 'rn-android-keyboard-adjust';
+import BigNumber from 'bignumber.js';
 
 enum FilterValue {
   NOMINATED = 'nominated',
@@ -84,6 +85,26 @@ const StakingBalanceList = () => {
     { label: i18n.filterOptions.nominated, value: FilterValue.NOMINATED },
     { label: i18n.filterOptions.pooled, value: FilterValue.POOLED },
   ];
+  const stakingList = useMemo(() => {
+    console.log(data);
+    if (!data.length) {
+      return [];
+    }
+    const BN_TEN = new BigNumber(10);
+    const result = data.sort((firstItem, secondItem) => {
+      const firstPrice = priceMap[`${firstItem.staking.chain}`] || 0;
+      const firstValue =
+        // @ts-ignore
+        new BigNumber(firstItem.staking.balance).dividedBy(BN_TEN.pow(firstItem.decimals)).toFixed() * firstPrice;
+      const secondPrice = priceMap[`${secondItem.staking.chain}`] || 0;
+      const secondValue =
+        // @ts-ignore
+        new BigNumber(secondItem.staking.balance).dividedBy(BN_TEN.pow(secondItem.decimals)).toFixed() * secondPrice;
+      console.log(firstValue, secondValue);
+      return secondValue - firstValue;
+    });
+    return result;
+  }, [data, priceMap]);
 
   const isFocused = useIsFocused();
   useEffect(() => {
@@ -131,7 +152,7 @@ const StakingBalanceList = () => {
         style={{ flex: 1, paddingBottom: 16 }}
         title={i18n.header.staking}
         titleTextAlign={'left'}
-        items={data}
+        items={stakingList}
         showLeftBtn={false}
         placeholder={i18n.placeholder.searchToken}
         autoFocus={false}