diff --git a/apis/market/auctionHouse.ts b/apis/market/auctionHouse.ts
index 8c75f0d5..9a805cc2 100644
--- a/apis/market/auctionHouse.ts
+++ b/apis/market/auctionHouse.ts
@@ -1,11 +1,17 @@
+import { toUiDecimals } from '@blockworks-foundation/mango-v4'
import {
AuctionHouse,
Metaplex,
LazyListing,
LazyBid,
} from '@metaplex-foundation/js'
-import { ALL_FILTER } from 'hooks/market/useAuctionHouse'
+import {
+ ALL_FILTER,
+ PRICE_LOW_HIGH,
+ YOUR_LISTINGS,
+} from 'hooks/market/useAuctionHouse'
import { AUCTION_HOUSE_ID } from 'utils/constants'
+import { MANGO_MINT_DECIMALS } from 'utils/governance/constants'
export const fetchAuctionHouse = async (metaplex: Metaplex) => {
const auctionHouse = await metaplex
@@ -26,12 +32,31 @@ export const fetchFilteredListing = async (
auctionHouse,
})
)
- .filter((x) =>
- filter === ALL_FILTER
- ? true
- : x.sellerAddress.equals(metaplex.identity().publicKey),
- )
+ .filter((x) => {
+ if (filter === ALL_FILTER || filter.includes('Price')) {
+ return true
+ }
+ if (filter === YOUR_LISTINGS) {
+ return x.sellerAddress.equals(metaplex.identity().publicKey)
+ }
+ })
.filter((x) => !x.canceledAt && !x.purchaseReceiptAddress)
+ .sort((a, b) => {
+ if (filter.includes('Price')) {
+ const aPrice = toUiDecimals(
+ a.price.basisPoints.toNumber(),
+ MANGO_MINT_DECIMALS,
+ )
+ const bPrice = toUiDecimals(
+ b.price.basisPoints.toNumber(),
+ MANGO_MINT_DECIMALS,
+ )
+ return filter === PRICE_LOW_HIGH ? aPrice - bPrice : bPrice - aPrice
+ }
+
+ return b.createdAt.toNumber() - a.createdAt.toNumber()
+ })
+
const filteredListings = listings.slice(
(page - 1) * perPage,
page * perPage,
diff --git a/components/nftMarket/ListingsView.tsx b/components/nftMarket/ListingsView.tsx
index b38cd3a3..d4481312 100644
--- a/components/nftMarket/ListingsView.tsx
+++ b/components/nftMarket/ListingsView.tsx
@@ -7,12 +7,14 @@ import { useWallet } from '@solana/wallet-adapter-react'
import metaplexStore from '@store/metaplexStore'
import {
ALL_FILTER,
+ PRICE_LOW_HIGH,
+ YOUR_LISTINGS,
useAuctionHouse,
useBids,
useLazyListings,
useListings,
} from 'hooks/market/useAuctionHouse'
-import { useCallback, useEffect, useMemo, useState } from 'react'
+import { useEffect, useState } from 'react'
import { MANGO_MINT_DECIMALS } from 'utils/governance/constants'
// import { useTranslation } from 'next-i18next'
import { ImgWithLoader } from '@components/ImgWithLoader'
@@ -22,9 +24,8 @@ import Loading from '@components/shared/Loading'
import SheenLoader from '@components/shared/SheenLoader'
import EmptyState from './EmptyState'
import { notify } from 'utils/notifications'
+import ResponsivePagination from 'react-responsive-pagination'
-const YOUR_LISTINGS = 'Your Listings'
-const PRICE_LOW_HIGH = 'Price: Low to High'
const PRICE_HIGH_LOW = 'Price: High to Low'
const defaultFilters = [
ALL_FILTER,
@@ -46,25 +47,21 @@ const ListingsView = () => {
const [bidNftModal, setBidNftModal] = useState(false)
const [cancellingListing, setCancellingListing] = useState('')
const [buying, setBuying] = useState('')
+ const [page, setPage] = useState(1)
const { refetch } = useLazyListings()
const {
data: listings,
isLoading: loadingListings,
isFetching: fetchingListings,
- } = useListings()
+ } = useListings(currentFilter, page)
const [listingsToShow, setListingsToShow] = useState
(
undefined,
)
useEffect(() => {
if (!loadingListings && !fetchingListings) {
- const sortedResults = listings
- ? listings.results.sort(
- (a, b) => b.createdAt.toNumber() - a.createdAt.toNumber(),
- )
- : []
- setListingsToShow(sortedResults)
+ setListingsToShow(listings ? listings.results : [])
}
}, [listings, loadingListings, fetchingListings])
@@ -128,59 +125,15 @@ const ListingsView = () => {
setAssetBidsModal(false)
setAssetBidsListing(null)
}
- // const handlePageClick = (page: number) => {
- // setPage(page)
- // }
+ const handlePageClick = (page: number) => {
+ setPage(page)
+ }
- const filters = useMemo(() => {
- if (!listings?.results || !listings?.results.length) return defaultFilters
- const collections: string[] = []
- for (const listing of listings.results) {
- const collectionName = listing.asset.json?.collection?.family || 'Unknown'
- if (!collections.includes(collectionName)) {
- collections.push(collectionName)
- }
- }
- return defaultFilters.concat(collections.sort((a, b) => a.localeCompare(b)))
- }, [listings])
-
- const handleFilter = useCallback(
- (filter: string) => {
- setCurrentFilter(filter)
- if (filter === ALL_FILTER) {
- const sortedResults = listings?.results.sort(
- (a, b) => b.createdAt.toNumber() - a.createdAt.toNumber(),
- )
- setListingsToShow(sortedResults)
- } else if (filter === YOUR_LISTINGS) {
- const filteredListings = listings?.results.filter((listing) => {
- return listing.sellerAddress.toString() === publicKey?.toString()
- })
- setListingsToShow(filteredListings)
- } else if (filter.includes('Price')) {
- return listings?.results.sort((a, b) => {
- const aPrice = toUiDecimals(
- a.price.basisPoints.toNumber(),
- MANGO_MINT_DECIMALS,
- )
- const bPrice = toUiDecimals(
- b.price.basisPoints.toNumber(),
- MANGO_MINT_DECIMALS,
- )
- return filter === PRICE_LOW_HIGH ? aPrice - bPrice : bPrice - aPrice
- })
- } else {
- const filteredListings = listings?.results.filter((listing) => {
- const collectionName =
- listing.asset.json?.collection?.family || 'Unknown'
- return collectionName === filter
- })
- setListingsToShow(filteredListings)
- }
- },
- [listings, publicKey],
- )
+ const filters = defaultFilters
+ const handleFilter = (filter: string) => {
+ setCurrentFilter(filter)
+ }
const loading = loadingListings || fetchingListings
return (
@@ -318,13 +271,13 @@ const ListingsView = () => {
)}
- {/*
{asssetBidsModal && assetBidsListing ? (
{
onClose()
} catch (e) {
console.log('error listing nft', e)
+ notify({
+ title: `${e}`,
+ type: 'error',
+ })
} finally {
setSubmitting(false)
}
diff --git a/hooks/market/useAuctionHouse.ts b/hooks/market/useAuctionHouse.ts
index f03b245d..beacf150 100644
--- a/hooks/market/useAuctionHouse.ts
+++ b/hooks/market/useAuctionHouse.ts
@@ -8,6 +8,8 @@ import metaplexStore from '@store/metaplexStore'
import { Bid, LazyBid, LazyListing } from '@metaplex-foundation/js'
export const ALL_FILTER = 'All'
+export const YOUR_LISTINGS = 'Your Listings'
+export const PRICE_LOW_HIGH = 'Price: Low to High'
//10min
const refetchMs = 600000
diff --git a/hooks/notifications/useNotificationSocket.ts b/hooks/notifications/useNotificationSocket.ts
index 3dc3741c..0bd38816 100644
--- a/hooks/notifications/useNotificationSocket.ts
+++ b/hooks/notifications/useNotificationSocket.ts
@@ -8,11 +8,20 @@ import { Notification } from 'apis/notifications/notifications'
import { tryParse } from 'utils/formatting'
import { NotificationsWebSocket } from 'apis/notifications/websocket'
import useMangoAccount from 'hooks/useMangoAccount'
+import { useCurrentSeason, useWalletPoints } from 'hooks/useRewards'
export function useNotificationSocket() {
const isAuth = useIsAuthorized()
const { publicKey } = useWallet()
const { mangoAccountAddress } = useMangoAccount()
+ const { wallet } = useWallet()
+ const { data: seasonData } = useCurrentSeason()
+ const { refetch } = useWalletPoints(
+ mangoAccountAddress,
+ seasonData?.season_id,
+ wallet,
+ )
+
const token = NotificationCookieStore((s) => s.currentToken)
const queryClient = useQueryClient()
@@ -55,6 +64,9 @@ export function useNotificationSocket() {
return [newNotification, ...prevData]
},
)
+ if (newNotification.title.toLowerCase().includes('points')) {
+ refetch()
+ }
}
})
diff --git a/package.json b/package.json
index b53ead39..c56f44f4 100644
--- a/package.json
+++ b/package.json
@@ -75,7 +75,8 @@
"three": "^0.155.0",
"tsparticles": "2.2.4",
"walktour": "5.1.1",
- "zustand": "4.1.3"
+ "zustand": "4.1.3",
+ "react-responsive-pagination": "2.2.3"
},
"peerDependencies": {
"@project-serum/anchor": "0.25.0",
diff --git a/yarn.lock b/yarn.lock
index 46bd8255..e825b569 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -7504,6 +7504,13 @@ react-resize-detector@^8.0.4:
dependencies:
lodash "^4.17.21"
+react-responsive-pagination@2.2.3:
+ version "2.2.3"
+ resolved "https://registry.yarnpkg.com/react-responsive-pagination/-/react-responsive-pagination-2.2.3.tgz#1945010c67ccdaefa41118f911fb4dd8237314a8"
+ integrity sha512-Rn9ts0AZzM0X+pcmVcSMNJAPD/ChO+1Yowssl56TidZcPHXdeg40FKdO7cw6MR1umaLFT/er/2GQTG6EUpw1VQ==
+ dependencies:
+ prop-types "^15.8.1"
+
react-simple-animate@3.0.2:
version "3.0.2"
resolved "https://registry.yarnpkg.com/react-simple-animate/-/react-simple-animate-3.0.2.tgz#67f29b0c64155d2dfd540c1c74f634ef521536a8"