From 7a43ed8fd5702a434e037b642af87e4638871164 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Martin=20Vytick=20Vytrhl=C3=ADk?= <vytick@gmail.com>
Date: Sat, 22 Feb 2025 16:22:59 +0100
Subject: [PATCH] feat(suite-native): persist favourite trade assets and make
 non/favourite lists exclusive

---
 .../TradeableAssetsSheet.tsx                  | 59 +++++++++++--------
 .../module-trading/src/tradingSlice.ts        |  2 +-
 suite-native/state/src/reducers.ts            |  9 ++-
 3 files changed, 44 insertions(+), 26 deletions(-)

diff --git a/suite-native/module-trading/src/components/general/TradeableAssetsSheet/TradeableAssetsSheet.tsx b/suite-native/module-trading/src/components/general/TradeableAssetsSheet/TradeableAssetsSheet.tsx
index 5e7004ce9b9..9a1374d9dbc 100644
--- a/suite-native/module-trading/src/components/general/TradeableAssetsSheet/TradeableAssetsSheet.tsx
+++ b/suite-native/module-trading/src/components/general/TradeableAssetsSheet/TradeableAssetsSheet.tsx
@@ -4,7 +4,7 @@ import { useSelector } from 'react-redux';
 import { TokenAddress } from '@suite-common/wallet-types';
 import { Translation } from '@suite-native/intl';
 
-import { selectTradingFavouriteAssetsArray } from '../../../tradingSlice';
+import { getTradeableAssetFavouriteKey, selectTradingFavouriteAssets } from '../../../tradingSlice';
 import {
     ItemRenderConfig,
     SectionListData,
@@ -75,30 +75,41 @@ export const TradeableAssetsSheet = ({
         onClose();
     };
 
-    const favourites = useSelector(selectTradingFavouriteAssetsArray);
-    const assetsData = mockAssets;
+    const favourites = useSelector(selectTradingFavouriteAssets);
 
-    const listData = useMemo(
-        () =>
-            [
-                {
-                    key: 'section_favourites',
-                    label: <Translation id="moduleTrading.tradeableAssetsSheet.favouritesTitle" />,
-                    data: favourites,
-                    sectionData: { isFavourite: true },
-                },
-                {
-                    key: 'section_all',
-                    label: <Translation id="moduleTrading.tradeableAssetsSheet.allTitle" />,
-                    data: assetsData,
-                    sectionData: { isFavourite: false },
-                },
-            ].filter(({ data }) => data.length > 0) as SectionListData<
-                TradeableAsset,
-                ListItemExtraData
-            >,
-        [favourites, assetsData],
-    );
+    const listData = useMemo(() => {
+        const { favouriteData, allData } = mockAssets.reduce(
+            (acc, a) => {
+                const key = getTradeableAssetFavouriteKey(a);
+                if (favourites[key]) {
+                    acc.favouriteData.push(a);
+                } else {
+                    acc.allData.push(a);
+                }
+
+                return acc;
+            },
+            { favouriteData: [] as TradeableAsset[], allData: [] as TradeableAsset[] },
+        );
+
+        return [
+            {
+                key: 'section_favourites',
+                label: <Translation id="moduleTrading.tradeableAssetsSheet.favouritesTitle" />,
+                data: favouriteData,
+                sectionData: { isFavourite: true },
+            },
+            {
+                key: 'section_all',
+                label: <Translation id="moduleTrading.tradeableAssetsSheet.allTitle" />,
+                data: allData,
+                sectionData: { isFavourite: false },
+            },
+        ].filter(({ data }) => data.length > 0) as SectionListData<
+            TradeableAsset,
+            ListItemExtraData
+        >;
+    }, [favourites]);
 
     return (
         <TradingBottomSheetSectionList<TradeableAsset, ListItemExtraData>
diff --git a/suite-native/module-trading/src/tradingSlice.ts b/suite-native/module-trading/src/tradingSlice.ts
index 3a39b9b4c83..d45b4a0b9a4 100644
--- a/suite-native/module-trading/src/tradingSlice.ts
+++ b/suite-native/module-trading/src/tradingSlice.ts
@@ -31,7 +31,7 @@ export const initialState: TradingState = {
     favouriteAssets: {},
 };
 
-const getTradeableAssetFavouriteKey = (asset: TradeableAsset) =>
+export const getTradeableAssetFavouriteKey = (asset: TradeableAsset) =>
     asset.contractAddress ? `${asset.symbol}_${asset.contractAddress}` : asset.symbol;
 
 export const tradingSlice = createSliceWithExtraDeps({
diff --git a/suite-native/state/src/reducers.ts b/suite-native/state/src/reducers.ts
index 8e5af972e98..c1b9390da30 100644
--- a/suite-native/state/src/reducers.ts
+++ b/suite-native/state/src/reducers.ts
@@ -75,6 +75,13 @@ export const prepareRootReducers = async () => {
         },
     });
 
+    const tradingPersistedReducer = await preparePersistReducer({
+        reducer: tradingReducer,
+        persistedKeys: ['favouriteAssets'],
+        key: 'trading',
+        version: 1,
+    });
+
     const walletReducers = combineReducers({
         accounts: accountsReducer,
         blockchain: blockchainReducer,
@@ -84,7 +91,7 @@ export const prepareRootReducers = async () => {
         send: sendFormReducer,
         fees: feesReducer,
         stake: stakeReducer,
-        trading: tradingReducer,
+        trading: tradingPersistedReducer,
     });
 
     const walletPersistedReducer = await preparePersistReducer({