diff --git a/components/Header/Menu.tsx b/components/Header/Menu.tsx deleted file mode 100644 index 13d4b206..00000000 --- a/components/Header/Menu.tsx +++ /dev/null @@ -1,140 +0,0 @@ -import { Menu, Divider, Typography, useTheme, useMediaQuery } from "@mui/material"; - -import ClaimAllRewards from "../ClaimAllRewards"; -import { getBurrow, getLocalAppVersion } from "../../utils"; -import { useAppSelector, useAppDispatch } from "../../redux/hooks"; -import { getAccountId } from "../../redux/accountSelectors"; -import { toggleDisplayValues, toggleShowDust } from "../../redux/appSlice"; -import { getDisplayAsTokenValue, getShowDust } from "../../redux/appSelectors"; -import { useFullDigits } from "../../hooks/useFullDigits"; -import { useDegenMode } from "../../hooks/hooks"; - -import { - trackDisplayAsUsd, - trackLogout, - trackShowDust, - trackToggleAmountDigits, -} from "../../utils/telemetry"; -import { useTicker } from "../../hooks/useTicker"; -import { useDisclaimer } from "../../hooks/useDisclaimer"; -import { isTestnet } from "../../utils/config"; -import { StyledMenuItem } from "./style"; -import { DarkModeMenuItem } from "../DarkSwitch"; - -interface Props { - anchorEl: null | HTMLElement; - setAnchorEl: React.Dispatch>; -} - -export const HamburgerMenu = ({ anchorEl, setAnchorEl }: Props) => { - const theme = useTheme(); - const dispatch = useAppDispatch(); - const open = Boolean(anchorEl); - const accountId = useAppSelector(getAccountId); - const displayAsTokenValue = useAppSelector(getDisplayAsTokenValue); - const showDust = useAppSelector(getShowDust); - const { fullDigits, setDigits } = useFullDigits(); - const isCompact = fullDigits?.table; - const appVersion = getLocalAppVersion(); - const { degenMode, setDegenMode } = useDegenMode(); - const { hasTicker, toggleTicker } = useTicker(); - const { setDisclaimer } = useDisclaimer(); - const isMobile = useMediaQuery(theme.breakpoints.down("sm")); - - const handleClose = () => { - setAnchorEl(null); - }; - - const handleToggleDisplayValues = () => { - trackDisplayAsUsd(); - dispatch(toggleDisplayValues()); - }; - - const handleToggleShowDust = () => { - trackShowDust(); - dispatch(toggleShowDust()); - }; - - const handleSwitchWallet = async () => { - await handleSignOut(); - window.modal.show(); - }; - - const handleSignOut = async () => { - const { signOut } = await getBurrow(); - signOut(); - trackLogout(); - handleClose(); - setDisclaimer(false); - }; - - const handleToggleAmountDigits = () => { - const digits = { table: !fullDigits?.table }; - trackToggleAmountDigits(digits); - setDigits(digits); - }; - - const handleToggleTicker = () => { - if (isTestnet) return; - toggleTicker(); - }; - - return ( - - {isMobile && } - {accountId && [ - , - - Degen Mode: {degenMode.enabled ? "On" : "Off"} - , - , - ]} - - Display Values As {displayAsTokenValue ? "USD" : "Token"} - - - Display {isCompact ? "Full" : "Compact"} Amounts - - - {showDust ? "Hide" : "Show"} Dust - - {!isTestnet && ( - - {hasTicker ? "Hide" : "Show"} Ticker - - )} - {accountId && [ - , - - Switch Wallet - , - , - - Sign Out - , - ]} - - - App Build Id: {appVersion} - - - ); -}; - -const ClaimMenuItem = (props) => ( - - Claim All Rewards - -); diff --git a/components/Header/MenuMobile.tsx b/components/Header/MenuMobile.tsx index 22244226..0c9504e2 100644 --- a/components/Header/MenuMobile.tsx +++ b/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"; diff --git a/components/Header/Set.tsx b/components/Header/Set.tsx index 2333563a..e21797da 100644 --- a/components/Header/Set.tsx +++ b/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 = () => { diff --git a/components/Table/common/cells.tsx b/components/Table/common/cells.tsx index b41ae30b..04873ca6 100644 --- a/components/Table/common/cells.tsx +++ b/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"; diff --git a/redux/appSelectors.ts b/redux/appSelectors.ts index 20658c35..7d2542d3 100644 --- a/redux/appSelectors.ts +++ b/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, diff --git a/redux/appSlice.ts b/redux/appSlice.ts index d659143a..e2de51d0 100644 --- a/redux/appSlice.ts +++ b/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, diff --git a/redux/appSliceMEME.ts b/redux/appSliceMEME.ts index 903deec5..275db402 100644 --- a/redux/appSliceMEME.ts +++ b/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, diff --git a/redux/categorySelectors.ts b/redux/categorySelectors.ts index 72e78cea..e0ee31c9 100644 --- a/redux/categorySelectors.ts +++ b/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, +); diff --git a/redux/marginTrading.ts b/redux/marginTrading.ts index 0e11baae..10fefe4a 100644 --- a/redux/marginTrading.ts +++ b/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; diff --git a/redux/selectors/getAccountRewards.ts b/redux/selectors/getAccountRewards.ts index e2bd40c3..9a0fec00 100644 --- a/redux/selectors/getAccountRewards.ts +++ b/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 = {}; diff --git a/redux/selectors/getPortfolioAssets.ts b/redux/selectors/getPortfolioAssets.ts index aea66159..353bf16f 100644 --- a/redux/selectors/getPortfolioAssets.ts +++ b/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);