feat: update dust assets logic

components/Header/MenuMobile.tsx

@@ -6,8 +6,8 @@ import { MenuButton, CloseIcon, ArrowRightIcon, ArrowTopRightIcon, ArrowDownIcon
 import { WrapperMenuMobile } from "./style";
 import { bridgeList } from "./Bridge";
 import { mainMenuList, helpMenu, Imenu } from "./menuData";
-import { toggleShowDust } from "../../redux/appSlice";
-import { getShowDust } from "../../redux/appSelectors";
+import { toggleShowDust } from "../../redux/marginTrading";
+import { getShowDust } from "../../redux/categorySelectors";
 import { useAppSelector, useAppDispatch } from "../../redux/hooks";
 import { DiscordIcon, MediumIcon, TwitterIcon } from "../Footer/svg";
 

components/Header/Set.tsx

@@ -1,8 +1,8 @@
 import { useState } from "react";
 import { twMerge } from "tailwind-merge";
 import { SetIcon } from "./svg";
-import { toggleShowDust } from "../../redux/appSlice";
-import { getShowDust } from "../../redux/appSelectors";
+import { toggleShowDust } from "../../redux/marginTrading";
+import { getShowDust } from "../../redux/categorySelectors";
 import { useAppSelector, useAppDispatch } from "../../redux/hooks";
 
 const Set = () => {

components/Table/common/cells.tsx

@@ -5,7 +5,8 @@ import { Box, Tooltip, Skeleton } from "@mui/material";
 import { USD_FORMAT, TOKEN_FORMAT, APY_FORMAT, DUST_FORMAT, NUMBER_FORMAT } from "../../../store";
 import type { IReward, UIAsset } from "../../../interfaces";
 import { useAppSelector } from "../../../redux/hooks";
-import { getDisplayAsTokenValue, getShowDust } from "../../../redux/appSelectors";
+import { getDisplayAsTokenValue } from "../../../redux/appSelectors";
+import { getShowDust } from "../../../redux/categorySelectors";
 import { Rewards } from "../../index";
 import { useFullDigits } from "../../../hooks/useFullDigits";
 

redux/appSelectors.ts

@@ -114,11 +114,6 @@ export const getAppState = (memeCategory?) => {
   );
 };
 
-export const getShowDust = createSelector(
-  (state: RootState) => state.app,
-  (app) => app.showDust,
-);
-
 export const getShowTicker = createSelector(
   (state: RootState) => state.app,
   (app) => app.showTicker,

redux/appSlice.ts

@@ -30,7 +30,6 @@ export interface AppState {
   protocolStats: boolean;
   displayAsTokenValue: boolean;
   showTicker: boolean;
-  showDust: boolean;
   slimStats: boolean;
   showDailyReturns: boolean;
   fullDigits: {
@@ -80,7 +79,6 @@ export const initialState: AppState = {
   showInfo: true,
   protocolStats: true,
   displayAsTokenValue: true,
-  showDust: false,
   showTicker: false,
   slimStats: false,
   showDailyReturns: false,
@@ -174,9 +172,6 @@ export const appSlice = createSlice({
     toggleDisplayValues(state) {
       state.displayAsTokenValue = !state.displayAsTokenValue;
     },
-    toggleShowDust(state) {
-      state.showDust = !state.showDust;
-    },
     toggleSlimStats(state) {
       state.slimStats = !state.slimStats;
     },
@@ -245,7 +240,6 @@ export const {
   updateAmount,
   toggleUseAsCollateral,
   toggleDisplayValues,
-  toggleShowDust,
   toggleSlimStats,
   setFullDigits,
   toggleShowTicker,

redux/appSliceMEME.ts

@@ -30,7 +30,6 @@ export interface AppState {
   protocolStats: boolean;
   displayAsTokenValue: boolean;
   showTicker: boolean;
-  showDust: boolean;
   slimStats: boolean;
   showDailyReturns: boolean;
   fullDigits: {
@@ -80,7 +79,6 @@ export const initialState: AppState = {
   showInfo: true,
   protocolStats: true,
   displayAsTokenValue: true,
-  showDust: false,
   showTicker: false,
   slimStats: false,
   showDailyReturns: false,
@@ -174,9 +172,6 @@ export const appSliceMEME = createSlice({
     toggleDisplayValues(state) {
       state.displayAsTokenValue = !state.displayAsTokenValue;
     },
-    toggleShowDust(state) {
-      state.showDust = !state.showDust;
-    },
     toggleSlimStats(state) {
       state.slimStats = !state.slimStats;
     },
@@ -245,7 +240,6 @@ export const {
   updateAmount,
   toggleUseAsCollateral,
   toggleDisplayValues,
-  toggleShowDust,
   toggleSlimStats,
   setFullDigits,
   toggleShowTicker,

redux/categorySelectors.ts

@@ -14,3 +14,7 @@ export const getActiveCategory = createSelector(
     return category.activeCategory;
   },
 );
+export const getShowDust = createSelector(
+  (state: RootState) => state.category,
+  (app) => app.showDust,
+);

redux/marginTrading.ts

@@ -10,6 +10,7 @@ interface commonAssets {
   ReduxTotalPLN: any;
   ReduxRangeMount: any;
   ReduxActiveTab: string;
+  showDust: boolean;
 }
 
 const initialState: commonAssets = {
@@ -22,6 +23,7 @@ const initialState: commonAssets = {
   ReduxTotalPLN: 0,
   ReduxRangeMount: 1,
   ReduxActiveTab: "long",
+  showDust: false,
 };
 
 const marginCategory = createSlice({
@@ -55,6 +57,9 @@ const marginCategory = createSlice({
     setReduxActiveTab(state, action) {
       state.ReduxActiveTab = action.payload;
     },
+    toggleShowDust(state) {
+      state.showDust = !state.showDust;
+    },
   },
 });
 
@@ -68,6 +73,7 @@ const {
   setReduxTotalPLN,
   setReduxRangeMount,
   setReduxActiveTab,
+  toggleShowDust,
 } = marginCategory.actions;
 const marginCategoryReducer = marginCategory.reducer;
 export {
@@ -80,5 +86,6 @@ export {
   setReduxTotalPLN,
   setReduxRangeMount,
   setReduxActiveTab,
+  toggleShowDust,
 };
 export default marginCategoryReducer;

redux/selectors/getAccountRewards.ts

@@ -813,7 +813,7 @@ export const getAccountDailyRewards = (memeCategory?: boolean) => {
       const accountDustProcess = dustProcess({
         accountSource: account,
         assets,
-        app,
+        showDust: category.showDust,
       });
       const baseCollateralUsdDaily =
         getGainsArr(accountDustProcess.portfolio.collaterals, assets)[0] / 365;
@@ -959,11 +959,11 @@ export function filterAccountEndedFarms(userFarms, allFarms): IAccountFarms {
 function dustProcess({
   accountSource,
   assets,
-  app,
+  showDust,
 }: {
   accountSource: AccountState;
   assets: AssetsState;
-  app: AppState;
+  showDust: boolean;
 }) {
   const account = Copy(accountSource);
   const portfolioAssets = {
@@ -987,7 +987,7 @@ function dustProcess({
         supplied: suppliedToken,
       };
     })
-    .filter(app.showDust ? Boolean : emptySuppliedAsset)
+    .filter(showDust ? Boolean : emptySuppliedAsset)
     .reduce((acc, cur) => [...acc, cur.tokenId], [] as any);
 
   const borrowed = Object.keys(account.portfolio.borrowed)
@@ -1002,7 +1002,7 @@ function dustProcess({
         borrowed: borrowedToken,
       };
     })
-    .filter(app.showDust ? Boolean : emptyBorrowedAsset)
+    .filter(showDust ? Boolean : emptyBorrowedAsset)
     .reduce((acc, cur) => [...acc, cur.tokenId], [] as any);
   const newSupplied = {};
   const newCollateral = {};

redux/selectors/getPortfolioAssets.ts

@@ -140,7 +140,7 @@ export const getPortfolioAssets = (memeCategory?: boolean) => {
             totalSupplyMoney: toUsd(totalSupplyD, asset),
           });
         })
-        .filter(app.showDust ? Boolean : emptySuppliedAsset);
+        .filter(category.showDust ? Boolean : emptySuppliedAsset);
       // borrow from regular position
       const borrowed = Object.keys(account.portfolio.borrowed || {})
         .map((tokenId) => {
@@ -180,7 +180,7 @@ export const getPortfolioAssets = (memeCategory?: boolean) => {
             totalSupplyMoney: toUsd(totalSupplyD, asset),
           });
         })
-        .filter(app.showDust ? Boolean : emptyBorrowedAsset);
+        .filter(category.showDust ? Boolean : emptyBorrowedAsset);
       // borrow from lp position
       const borrowed_LP = Object.keys(lpPositions).reduce((acc, shadow_id: string) => {
         const b = Object.keys(lpPositions[shadow_id].borrowed)
@@ -223,7 +223,7 @@ export const getPortfolioAssets = (memeCategory?: boolean) => {
               totalSupplyMoney: toUsd(totalSupplyD, asset),
             });
           })
-          .filter(app.showDust ? Boolean : emptyBorrowedAsset);
+          .filter(category.showDust ? Boolean : emptyBorrowedAsset);
         return { ...acc, [shadow_id]: b };
       }, {});
       const borrowedAll = Array.from(borrowed);