Skip to content

Commit

Permalink
v7.6.0
Browse files Browse the repository at this point in the history 
v7.6.0
  • Loading branch information
@platschi
platschi authored Sep 7, 2023
2 parents 9e22c45 + 13a108c commit 8fe22f6
Show file tree
Hide file tree
Showing 19 changed files with 624 additions and 92 deletions.
2 changes: 1 addition & 1 deletion package.json
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "kwenta",
"version": "7.5.5",
"version": "7.6.0",
"description": "Kwenta",
"main": "index.js",
"scripts": {
Expand Down
2 changes: 1 addition & 1 deletion packages/app/package.json
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "@kwenta/app",
"version": "7.5.5",
"version": "7.6.0",
"scripts": {
"dev": "next",
"build": "next build",
Expand Down
Binary file added packages/app/src/assets/png/currencies/sSUSHI.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
65 changes: 63 additions & 2 deletions packages/app/src/pages/dashboard/history.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,20 +1,28 @@
import Head from 'next/head'
import { ReactNode, useCallback, useState } from 'react'
import { ReactNode, useCallback, useMemo, useState } from 'react'
import { useTranslation } from 'react-i18next'
import styled from 'styled-components'

import UploadIcon from 'assets/svg/futures/upload-icon.svg'
import { FlexDivCol, FlexDivRowCentered } from 'components/layout/flex'
import { MobileHiddenView, MobileOnlyView } from 'components/Media'
import Spacer from 'components/Spacer'
import { Body, Heading } from 'components/Text'
import DashboardLayout from 'sections/dashboard/DashboardLayout'
import HistoryTabs, { HistoryTab } from 'sections/dashboard/HistoryTabs'
import TradesTab from 'sections/futures/MobileTrade/UserTabs/TradesTab'
import { usePollDashboardFuturesData } from 'state/futures/hooks'
import { selectPositionsCsvData, selectTradesCsvData } from 'state/futures/selectors'
import { useAppSelector } from 'state/hooks'

type HistoryPageProps = React.FC & { getLayout: (page: ReactNode) => JSX.Element }

const HistoryPage: HistoryPageProps = () => {
const { t } = useTranslation()

usePollDashboardFuturesData()
const tradesCsvData = useAppSelector(selectTradesCsvData)
const positionsCsvData = useAppSelector(selectPositionsCsvData)

const [currentTab, setCurrentTab] = useState(HistoryTab.Positions)

Expand All @@ -25,13 +33,36 @@ const HistoryPage: HistoryPageProps = () => {
[]
)

const file = useMemo(
() =>
`data:text/csv;base64,${btoa(
currentTab === HistoryTab.Positions ? positionsCsvData : tradesCsvData
)}`,
[currentTab, positionsCsvData, tradesCsvData]
)
const fileName = useMemo(
() => (currentTab === HistoryTab.Positions ? 'positions-history.csv' : 'trades-history.csv'),
[currentTab]
)

return (
<>
<Head>
<title>{t('dashboard-history.page-title')}</title>
</Head>
<MobileHiddenView>
<Spacer height={10} />
<Spacer height={15} />
<FlexDivRowCentered>
<FlexDivCol>
<Heading variant="h3">{t('dashboard-history.main-title')}</Heading>
<Body color={'secondary'}>{t('dashboard-history.subtitle')}</Body>
</FlexDivCol>
<ExportButton href={file} download={fileName}>
<span>{t('dashboard-history.export-btn')}</span>
<UploadIcon width={8} style={{ 'margin-bottom': '2px' }} />
</ExportButton>
</FlexDivRowCentered>
<Spacer height={30} />
<HistoryTabs onChangeTab={handleChangeTab} currentTab={currentTab} />
<Spacer height={50} />
</MobileHiddenView>
Expand All @@ -42,6 +73,36 @@ const HistoryPage: HistoryPageProps = () => {
)
}

const ExportButton = styled.a`
gap: 8px;
height: 36px;
display: flex;
font-size: 12px;
font-weight: 700;
padding: 10px 15px;
border-radius: 50px;
font-family: ${(props) => props.theme.fonts.regular};
color: ${(props) => props.theme.colors.selectedTheme.newTheme.pill.gray.text};
background: ${(props) => props.theme.colors.selectedTheme.newTheme.pill.gray.background};
svg {
width: 10px;
path {
fill: ${(props) => props.theme.colors.selectedTheme.newTheme.pill.gray.text};
}
}
&:hover {
color: ${(props) => props.theme.colors.selectedTheme.newTheme.pill.gray.hover.text};
background: ${(props) => props.theme.colors.selectedTheme.newTheme.pill.gray.hover.background};
svg {
path {
fill: ${(props) => props.theme.colors.selectedTheme.newTheme.pill.gray.hover.text};
}
}
}
`

HistoryPage.getLayout = (page) => <DashboardLayout>{page}</DashboardLayout>

export default HistoryPage
4 changes: 2 additions & 2 deletions packages/app/src/sections/dashboard/HistoryTabs.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ import { TabPanel } from 'components/Tab'
import TraderHistory from 'sections/futures/TraderHistory'
import Trades from 'sections/futures/Trades'
import { fetchPositionHistoryForTrader } from 'state/futures/actions'
import { selectUsersPositionHistory } from 'state/futures/selectors'
import { selectPositionsHistoryTableData } from 'state/futures/selectors'
import { useAppDispatch, useAppSelector } from 'state/hooks'
import { selectWallet } from 'state/wallet/selectors'
import media from 'styles/media'
Expand All @@ -26,7 +26,7 @@ const HistoryTabs: React.FC<HistoryTabsProp> = ({ currentTab, onChangeTab }) =>
const { t } = useTranslation()
const dispatch = useAppDispatch()
const walletAddress = useAppSelector(selectWallet)
const positionHistory = useAppSelector(selectUsersPositionHistory)
const positionHistory = useAppSelector(selectPositionsHistoryTableData)

useEffect(() => {
dispatch(fetchPositionHistoryForTrader(walletAddress ?? ''))
Expand Down
65 changes: 21 additions & 44 deletions packages/app/src/sections/futures/TraderHistory.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,7 +1,5 @@
import { ZERO_WEI } from '@kwenta/sdk/constants'
import { FuturesPositionHistory } from '@kwenta/sdk/dist/types'
import { getMarketName, MarketKeyByAsset } from '@kwenta/sdk/utils'
import { wei, WeiSource } from '@synthetixio/wei'
import { FuturesMarketKey, FuturesPositionHistory } from '@kwenta/sdk/types'
import Wei, { wei, WeiSource } from '@synthetixio/wei'
import router from 'next/router'
import { FC, memo, useMemo } from 'react'
import { useTranslation } from 'react-i18next'
Expand All @@ -15,16 +13,26 @@ import Table, { TableHeader, TableNoResults } from 'components/Table'
import { Body } from 'components/Text'
import ROUTES from 'constants/routes'
import TimeDisplay from 'sections/futures/Trades/TimeDisplay'
import { selectFuturesPositions, selectQueryStatuses } from 'state/futures/selectors'
import { selectQueryStatuses } from 'state/futures/selectors'
import { useAppSelector } from 'state/hooks'
import { FetchStatus } from 'state/types'
import { ExternalLink } from 'styles/common'
import media from 'styles/media'

type PositionData = FuturesPositionHistory & {
rank: number
currencyIconKey: FuturesMarketKey
marketShortName: string
status: string
funding: Wei
pnl: Wei
pnlPct: string
}

type TraderHistoryProps = {
trader: string
traderEns?: string | null
positionHistory: FuturesPositionHistory[]
positionHistory: PositionData[]
resetSelection: () => void
compact?: boolean
searchTerm?: string | undefined
Expand All @@ -33,47 +41,16 @@ type TraderHistoryProps = {
const TraderHistory: FC<TraderHistoryProps> = memo(
({ trader, traderEns, positionHistory, resetSelection, compact, searchTerm }) => {
const { t } = useTranslation()
const positions = useAppSelector(selectFuturesPositions)
const { selectedTraderPositionHistory: queryStatus } = useAppSelector(selectQueryStatuses)

let data = useMemo(() => {
return positionHistory
.sort((a, b) => b.timestamp - a.timestamp)
.map((stat, i) => {
const totalDeposit = stat.initialMargin.add(stat.totalDeposits)
const thisPosition = stat.isOpen
? positions.find((p) => p.market.marketKey === stat.marketKey)
: null

const funding = stat.netFunding.add(
thisPosition?.activePosition?.accruedFunding ?? ZERO_WEI
)
const pnlWithFeesPaid = stat.pnl.sub(stat.feesPaid).add(funding)

return {
...stat,
rank: i + 1,
currencyIconKey: MarketKeyByAsset[stat.asset],
marketShortName: getMarketName(stat.asset),
status: stat.isOpen ? 'Open' : stat.isLiquidated ? 'Liquidated' : 'Closed',
funding,
pnl: pnlWithFeesPaid,
pnlPct: totalDeposit.gt(0)
? `(${pnlWithFeesPaid
.div(stat.initialMargin.add(stat.totalDeposits))
.mul(100)
.toNumber()
.toFixed(2)}%)`
: '0%',
}
})
.filter((i) =>
searchTerm?.length
? i.marketShortName.toLowerCase().includes(searchTerm) ||
i.status.toLowerCase().includes(searchTerm)
: true
)
}, [positionHistory, positions, searchTerm])
return positionHistory.filter((i) =>
searchTerm?.length
? i.marketShortName.toLowerCase().includes(searchTerm) ||
i.status.toLowerCase().includes(searchTerm)
: true
)
}, [positionHistory, searchTerm])

return (
<>
Expand Down
37 changes: 7 additions & 30 deletions packages/app/src/sections/futures/Trades/Trades.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { formatDollars, formatNumber, getDisplayAsset } from '@kwenta/sdk/utils'
import { formatDollars, formatNumber } from '@kwenta/sdk/utils'
import { useRouter } from 'next/router'
import { FC, memo, useMemo } from 'react'
import { useTranslation } from 'react-i18next'
Expand All @@ -14,13 +14,15 @@ import { blockExplorer } from 'containers/Connector/Connector'
import useIsL2 from 'hooks/useIsL2'
import useNetworkSwitcher from 'hooks/useNetworkSwitcher'
import useWindowSize from 'hooks/useWindowSize'
import { selectFuturesType, selectMarketAsset } from 'state/futures/common/selectors'
import { selectAllTradesForAccountType } from 'state/futures/selectors'
import { selectFuturesType } from 'state/futures/common/selectors'
import {
selectAllTradesForAccountType,
selectTradesHistoryTableData,
} from 'state/futures/selectors'
import { selectSmartMarginQueryStatuses } from 'state/futures/smartMargin/selectors'
import { useAppSelector } from 'state/hooks'
import { FetchStatus } from 'state/types'

import { TradeStatus } from '../types'
import TableMarketDetails from '../UserInfo/TableMarketDetails'

import TimeDisplay from './TimeDisplay'
Expand All @@ -34,41 +36,16 @@ const Trades: FC<TradesProps> = memo(({ rounded = false, noBottom = true }) => {
const { switchToL2 } = useNetworkSwitcher()
const router = useRouter()
const { lessThanWidth } = useWindowSize()
const marketAsset = useAppSelector(selectMarketAsset)
const accountType = useAppSelector(selectFuturesType)
const history = useAppSelector(selectAllTradesForAccountType)
const historyData = useAppSelector(selectTradesHistoryTableData)
const { trades } = useAppSelector(selectSmartMarginQueryStatuses)

const isLoading = !history.length && trades.status === FetchStatus.Loading
const isLoaded = trades.status === FetchStatus.Success

const isL2 = useIsL2()

const historyData = useMemo(() => {
return history.map((trade) => {
const pnl = trade?.pnl
const feesPaid = trade?.feesPaid
const netPnl = pnl.sub(feesPaid)

return {
...trade,
pnl,
feesPaid,
netPnl,
notionalValue: trade?.price.mul(trade?.size.abs()),
value: Number(trade?.price),
funding: Number(trade?.fundingAccrued),
amount: trade?.size.abs(),
time: trade?.timestamp * 1000,
id: trade?.txnHash,
asset: marketAsset,
displayAsset: getDisplayAsset(trade?.asset),
type: trade?.orderType,
status: trade?.positionClosed ? TradeStatus.CLOSED : TradeStatus.OPEN,
}
})
}, [history, marketAsset])

const columnsDeps = useMemo(() => [historyData], [historyData])

return lessThanWidth('xl') ? (
Expand Down
7 changes: 2 additions & 5 deletions packages/app/src/sections/leaderboard/Leaderboard.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,10 +13,7 @@ import useENS from 'hooks/useENS'
import { CompetitionBanner } from 'sections/shared/components/CompetitionBanner'
import { fetchPositionHistoryForTrader } from 'state/futures/actions'
import { setSelectedTrader } from 'state/futures/reducer'
import {
selectPositionHistoryForSelectedTrader,
selectSelectedTrader,
} from 'state/futures/selectors'
import { selectLeaderBoardTableData, selectSelectedTrader } from 'state/futures/selectors'
import { useAppDispatch, useAppSelector, useFetchAction } from 'state/hooks'
import { fetchLeaderboard } from 'state/stats/actions'
import { setLeaderboardSearchTerm } from 'state/stats/reducer'
Expand Down Expand Up @@ -57,7 +54,7 @@ const Leaderboard: FC<LeaderboardProps> = ({ compact, mobile }) => {
const [searchAddress, setSearchAddress] = useState('')
const wallet = useAppSelector(selectWallet)
const selectedTrader = useAppSelector(selectSelectedTrader)
const positionHistory = useAppSelector(selectPositionHistoryForSelectedTrader)
const positionHistory = useAppSelector(selectLeaderBoardTableData)
const searchEns = useENS(searchTerm)

const leaderboardLoading = useAppSelector(selectLeaderboardLoading)
Expand Down
3 changes: 2 additions & 1 deletion packages/app/src/state/futures/crossMargin/actions.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,6 +17,7 @@ import Wei, { wei } from '@synthetixio/wei'
import { debounce } from 'lodash'

import { notifyError } from 'components/ErrorNotifier'
import { CROSS_MARGIN_ENABLED } from 'constants/defaults'
import { monitorAndAwaitTransaction } from 'state/app/helpers'
import {
handleTransactionError,
Expand Down Expand Up @@ -84,7 +85,7 @@ export const fetchV3Markets = createAsyncThunk<
>('futures/fetchV3Markets', async (_, { getState, extra: { sdk } }) => {
const supportedNetwork = selectCrossMarginSupportedNetwork(getState())
const networkId = selectNetwork(getState())
if (!supportedNetwork) return
if (!supportedNetwork || !CROSS_MARGIN_ENABLED) return
try {
const v3Markets = await sdk.perpsV3.getMarkets()

Expand Down
Loading

1 comment on commit 8fe22f6

@vercel
Copy link

@vercel vercel bot commented on 8fe22f6 Sep 7, 2023

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Successfully deployed to the following URLs:

kwenta – ./packages/app

kwenta.io
kwenta-git-main-kwenta.vercel.app
kwenta-kwenta.vercel.app

Please sign in to comment.