diff --git a/src/components/MultiHopTrade/components/TradeInput/TradeInput.tsx b/src/components/MultiHopTrade/components/TradeInput/TradeInput.tsx index 46728b4c6c6..6a59f3c4484 100644 --- a/src/components/MultiHopTrade/components/TradeInput/TradeInput.tsx +++ b/src/components/MultiHopTrade/components/TradeInput/TradeInput.tsx @@ -267,7 +267,12 @@ export const TradeInput = ({ isCompact, tradeInputRef, onChangeTab }: TradeInput // Set the confirmed quote for execution, with a snapshot of the affiliate fees for display after the trade is executed. // This is done to handle the fox power calculation changing due to FOX balance changes after the trade is executed. - dispatch(tradeQuoteSlice.actions.setConfirmedQuote({ quote: activeQuote, calculatedFees })) + dispatch( + tradeQuoteSlice.actions.setConfirmedQuote({ + quote: activeQuote, + shapeshiftFeeMetadata: calculatedFees, + }), + ) dispatch(tradeQuoteSlice.actions.clearQuoteExecutionState(activeQuote.id)) if (isLedger(wallet)) { diff --git a/src/lib/fees/model.ts b/src/lib/fees/model.ts index f7dd288a820..40839fd60c3 100644 --- a/src/lib/fees/model.ts +++ b/src/lib/fees/model.ts @@ -18,7 +18,7 @@ type CalculateFeeBpsArgs = { /** * Represents the return type for calculating fee basis points (bps). - * @type {Object} CalculateFeeBpsReturn + * @type {Object} ShapeshiftFeeMetadata * @property {BigNumber} feeBps - The net fee bps (i.e., including the fox discount) used for actual trades. * @property {BigNumber} feeBpsFloat - `feeBps` as a floating point number, used for plotting the theoretical bps ignoring the realities of integer bps values. * @property {BigNumber} feeUsd - The net USD value of the fee (i.e., including the fox discount). @@ -27,7 +27,7 @@ type CalculateFeeBpsArgs = { * @property {BigNumber} feeUsdBeforeDiscount - The gross USD value of the fee (i.e., excluding the fox discount). * @property {BigNumber} feeBpsBeforeDiscount - The gross fee bps (i.e., excluding the fox discount). */ -export type CalculateFeeBpsReturn = { +export type ShapeshiftFeeMetadata = { feeBps: BigNumber feeBpsFloat: BigNumber feeUsd: BigNumber @@ -36,7 +36,7 @@ export type CalculateFeeBpsReturn = { feeUsdBeforeDiscount: BigNumber feeBpsBeforeDiscount: BigNumber } -type CalculateFeeBps = (args: CalculateFeeBpsArgs) => CalculateFeeBpsReturn +type CalculateFeeBps = (args: CalculateFeeBpsArgs) => ShapeshiftFeeMetadata export const calculateFees: CalculateFeeBps = ({ tradeAmountUsd, diff --git a/src/state/apis/snapshot/selectors.ts b/src/state/apis/snapshot/selectors.ts index 1be612c23b7..48c1b4db786 100644 --- a/src/state/apis/snapshot/selectors.ts +++ b/src/state/apis/snapshot/selectors.ts @@ -4,7 +4,7 @@ import { bnOrZero } from '@shapeshiftoss/utils' import createCachedSelector from 're-reselect' import type { Selector } from 'reselect' import { createSelector } from 'reselect' -import type { CalculateFeeBpsReturn } from 'lib/fees/model' +import type { ShapeshiftFeeMetadata } from 'lib/fees/model' import { calculateFees } from 'lib/fees/model' import type { ParameterModel } from 'lib/fees/parameters/types' import { isSome } from 'lib/utils' @@ -57,7 +57,7 @@ type AffiliateFeesProps = { inputAmountUsd: string | undefined } -export const selectCalculatedFees: Selector = +export const selectCalculatedFees: Selector = createCachedSelector( (_state: ReduxState, { feeModel }: AffiliateFeesProps) => feeModel, (_state: ReduxState, { inputAmountUsd }: AffiliateFeesProps) => inputAmountUsd, @@ -65,7 +65,7 @@ export const selectCalculatedFees: Selector = selectThorVotingPower, selectIsSnapshotApiQueriesRejected, (feeModel, inputAmountUsd, votingPower, thorVotingPower, isSnapshotApiQueriesRejected) => { - const fees: CalculateFeeBpsReturn = calculateFees({ + const fees: ShapeshiftFeeMetadata = calculateFees({ tradeAmountUsd: bnOrZero(inputAmountUsd), foxHeld: bnOrZero(votingPower), thorHeld: bnOrZero(thorVotingPower), diff --git a/src/state/slices/tradeQuoteSlice/constants.ts b/src/state/slices/tradeQuoteSlice/constants.ts index aeed808cbd4..b0877514ecb 100644 --- a/src/state/slices/tradeQuoteSlice/constants.ts +++ b/src/state/slices/tradeQuoteSlice/constants.ts @@ -30,7 +30,7 @@ export const initialTradeExecutionState = { export const initialState: TradeQuoteSliceState = { activeQuoteMeta: undefined, confirmedQuote: undefined, - confirmedFees: undefined, + confirmedShapeshiftFeeMetadata: undefined, activeStep: undefined, tradeExecution: {}, tradeQuotes: {}, diff --git a/src/state/slices/tradeQuoteSlice/selectors.ts b/src/state/slices/tradeQuoteSlice/selectors.ts index b820c09d417..0a67bb03ff7 100644 --- a/src/state/slices/tradeQuoteSlice/selectors.ts +++ b/src/state/slices/tradeQuoteSlice/selectors.ts @@ -16,7 +16,7 @@ import type { Asset } from '@shapeshiftoss/types' import { identity } from 'lodash' import type { Selector } from 'reselect' import { bn, bnOrZero } from 'lib/bignumber/bignumber' -import type { CalculateFeeBpsReturn } from 'lib/fees/model' +import type { ShapeshiftFeeMetadata } from 'lib/fees/model' import { fromBaseUnit } from 'lib/math' import { validateQuoteRequest } from 'state/apis/swapper/helpers/validateQuoteRequest' import { selectIsTradeQuoteApiQueryPending } from 'state/apis/swapper/selectors' @@ -205,10 +205,12 @@ export const selectConfirmedQuote: Selector = - createDeepEqualOutputSelector(selectTradeQuoteSlice, tradeQuoteState => { - return tradeQuoteState.confirmedFees - }) +export const selectConfirmedShapeshiftFeeMetadata: Selector< + ReduxState, + ShapeshiftFeeMetadata | undefined +> = createDeepEqualOutputSelector(selectTradeQuoteSlice, tradeQuoteState => { + return tradeQuoteState.confirmedShapeshiftFeeMetadata +}) export const selectActiveQuoteMetaOrDefault: Selector< ReduxState, @@ -569,21 +571,21 @@ export const selectActiveQuoteAffiliateBps: Selector { - if (!affiliateBps || !calculatedFees) return + (confirmedShapeshiftFeeMetadata, affiliateBps) => { + if (!affiliateBps || !confirmedShapeshiftFeeMetadata) return if (affiliateBps === '0') return bn(0) - return calculatedFees.feeUsd + return confirmedShapeshiftFeeMetadata.feeUsd }, ) export const selectTradeQuoteAffiliateFeeDiscountUsd = createSelector( - selectConfirmedFees, - confirmedFees => { - if (!confirmedFees) return - return confirmedFees.foxDiscountUsd + selectConfirmedShapeshiftFeeMetadata, + confirmedShapeshiftFeeMetadata => { + if (!confirmedShapeshiftFeeMetadata) return + return confirmedShapeshiftFeeMetadata.foxDiscountUsd }, ) diff --git a/src/state/slices/tradeQuoteSlice/tradeQuoteSlice.ts b/src/state/slices/tradeQuoteSlice/tradeQuoteSlice.ts index 1b207ce3c97..24d6d9cf5e0 100644 --- a/src/state/slices/tradeQuoteSlice/tradeQuoteSlice.ts +++ b/src/state/slices/tradeQuoteSlice/tradeQuoteSlice.ts @@ -3,7 +3,7 @@ import { createSlice } from '@reduxjs/toolkit' import type { SwapperName, TradeQuote, TradeRate } from '@shapeshiftoss/swapper' import { orderBy, uniqBy } from 'lodash' import type { InterpolationOptions } from 'node-polyglot' -import type { CalculateFeeBpsReturn } from 'lib/fees/model' +import type { ShapeshiftFeeMetadata } from 'lib/fees/model' import type { ApiQuote } from 'state/apis/swapper/types' import { initialState, initialTradeExecutionState } from './constants' @@ -57,11 +57,11 @@ export const tradeQuoteSlice = createSlice({ state, action: PayloadAction<{ quote: TradeQuote | TradeRate - calculatedFees: CalculateFeeBpsReturn + shapeshiftFeeMetadata: ShapeshiftFeeMetadata }>, ) => { state.confirmedQuote = action.payload.quote - state.confirmedFees = action.payload.calculatedFees + state.confirmedShapeshiftFeeMetadata = action.payload.shapeshiftFeeMetadata }, clearQuoteExecutionState: (state, action: PayloadAction) => { state.tradeExecution[action.payload] = initialTradeExecutionState diff --git a/src/state/slices/tradeQuoteSlice/types.ts b/src/state/slices/tradeQuoteSlice/types.ts index f6e76e92e30..8e2f9b5d914 100644 --- a/src/state/slices/tradeQuoteSlice/types.ts +++ b/src/state/slices/tradeQuoteSlice/types.ts @@ -1,7 +1,7 @@ import type { SwapperName, TradeQuote, TradeRate } from '@shapeshiftoss/swapper' import type { PartialRecord } from '@shapeshiftoss/types' import type { InterpolationOptions } from 'node-polyglot' -import type { CalculateFeeBpsReturn } from 'lib/fees/model' +import type { ShapeshiftFeeMetadata } from 'lib/fees/model' import type { ApiQuote } from 'state/apis/swapper/types' export type ActiveQuoteMeta = { @@ -15,7 +15,7 @@ export type TradeQuoteSliceState = { confirmedQuote: TradeQuote | TradeRate | undefined // the quote being executed // Used to display the "You saved" message in the TradeSuccess component. This needs to be stored // here because trading fox will affect the calculation after the trade has been executed. - confirmedFees: CalculateFeeBpsReturn | undefined + confirmedShapeshiftFeeMetadata: ShapeshiftFeeMetadata | undefined tradeExecution: Record tradeQuotes: PartialRecord> // mapping from swapperName to quoteId to ApiQuote tradeQuoteDisplayCache: ApiQuote[] diff --git a/src/test/mocks/store.ts b/src/test/mocks/store.ts index 46371415f3b..4c4d1891c15 100644 --- a/src/test/mocks/store.ts +++ b/src/test/mocks/store.ts @@ -267,7 +267,7 @@ export const mockStore: ReduxState = { tradeQuoteSlice: { activeQuoteMeta: undefined, confirmedQuote: undefined, - confirmedFees: undefined, + confirmedShapeshiftFeeMetadata: undefined, activeStep: undefined, tradeExecution: {}, tradeQuotes: {},