diff --git a/.github/ISSUE_TEMPLATE/BUG.yml b/.github/ISSUE_TEMPLATE/BUG.yml
index 06717fec98..ac98888256 100644
--- a/.github/ISSUE_TEMPLATE/BUG.yml
+++ b/.github/ISSUE_TEMPLATE/BUG.yml
@@ -52,6 +52,7 @@ body:
description: What version of the extension are you running?
options:
- v0.20.0
+ - v0.19.3
- v0.19.2
- v0.19.1
- v0.19.0
diff --git a/background/lib/poap_update.ts b/background/lib/poap_update.ts
index 558a0503c0..10de39a044 100644
--- a/background/lib/poap_update.ts
+++ b/background/lib/poap_update.ts
@@ -3,7 +3,7 @@ import logger from "./logger"
import { ETHEREUM } from "../constants"
import { NFT, NFTCollection, NFTsWithPagesResponse } from "../nfts"
-export const POAP_CONTRACT = "poap_contract"
+export const POAP_CONTRACT = "0x22C1f6050E56d2876009903609a2cC3fEf83B415" // POAP contract address https://etherscan.io/address/0x22C1f6050E56d2876009903609a2cC3fEf83B415
export const POAP_COLLECTION_ID = "POAP"
type PoapNFTModel = {
@@ -39,6 +39,7 @@ function poapNFTModelToNFT(original: PoapNFTModel, owner: string): NFT {
country,
city,
year,
+ supply,
},
} = original
return {
@@ -58,6 +59,7 @@ function poapNFTModelToNFT(original: PoapNFTModel, owner: string): NFT {
contract: POAP_CONTRACT, // contract address doesn't make sense for POAPs
owner,
network: ETHEREUM,
+ supply,
isBadge: true,
}
}
diff --git a/background/nfts.ts b/background/nfts.ts
index a9989e9a02..46a92cbb4a 100644
--- a/background/nfts.ts
+++ b/background/nfts.ts
@@ -54,7 +54,8 @@ export type NFT = {
contract: string
owner: string
network: EVMNetwork
- isBadge: boolean
+ supply?: number // only for POAPs
+ isBadge: boolean // POAPs, Galxe NFTs and OATs
}
export type NFTCollection = {
diff --git a/background/redux-slices/accounts.ts b/background/redux-slices/accounts.ts
index 540baed1da..7c2664ee54 100644
--- a/background/redux-slices/accounts.ts
+++ b/background/redux-slices/accounts.ts
@@ -29,7 +29,7 @@ export const enum AccountType {
Internal = "internal",
}
-const availableDefaultNames = [
+export const DEFAULT_ACCOUNT_NAMES = [
"Phoenix",
"Matilda",
"Sirius",
@@ -40,6 +40,8 @@ const availableDefaultNames = [
"Foz",
]
+const availableDefaultNames = [...DEFAULT_ACCOUNT_NAMES]
+
export type AccountData = {
address: HexString
network: Network
diff --git a/background/redux-slices/selectors/accountsSelectors.ts b/background/redux-slices/selectors/accountsSelectors.ts
index 4414a13914..07464b3dcb 100644
--- a/background/redux-slices/selectors/accountsSelectors.ts
+++ b/background/redux-slices/selectors/accountsSelectors.ts
@@ -1,7 +1,11 @@
import { createSelector } from "@reduxjs/toolkit"
import { selectHideDust } from "../ui"
import { RootState } from ".."
-import { AccountType, CompleteAssetAmount } from "../accounts"
+import {
+ AccountType,
+ DEFAULT_ACCOUNT_NAMES,
+ CompleteAssetAmount,
+} from "../accounts"
import { AssetsState, selectAssetPricePoint } from "../assets"
import {
enrichAssetAmountWithDecimalValues,
@@ -519,6 +523,17 @@ export const getAccountTotal = (
accountAddressOnNetwork
)
+export const getAccountNameOnChain = (
+ state: RootState,
+ accountAddressOnNetwork: AddressOnNetwork
+): string | undefined => {
+ const account = getAccountTotal(state, accountAddressOnNetwork)
+
+ return account?.name && !DEFAULT_ACCOUNT_NAMES.includes(account.name)
+ ? account.name
+ : undefined
+}
+
export const selectCurrentAccountTotal = createSelector(
selectCurrentNetworkAccountTotalsByCategory,
selectCurrentAccount,
diff --git a/ui/components/NFTS_update/NFTPreview.tsx b/ui/components/NFTS_update/NFTPreview.tsx
index 9be520c87d..9e77e8c010 100644
--- a/ui/components/NFTS_update/NFTPreview.tsx
+++ b/ui/components/NFTS_update/NFTPreview.tsx
@@ -1,13 +1,11 @@
import { FeatureFlags, isEnabled } from "@tallyho/tally-background/features"
-import {
- isProbablyEVMAddress,
- truncateAddress,
-} from "@tallyho/tally-background/lib/utils"
import { NFTWithCollection } from "@tallyho/tally-background/redux-slices/nfts_update"
+import { getAccountNameOnChain } from "@tallyho/tally-background/redux-slices/selectors"
import React, { ReactElement, useMemo } from "react"
import { useTranslation } from "react-i18next"
-import { useIntersectionObserver } from "../../hooks"
+import { useBackgroundSelector, useIntersectionObserver } from "../../hooks"
import { trimWithEllipsis } from "../../utils/textUtils"
+import SharedAddress from "../Shared/SharedAddress"
import SharedButton from "../Shared/SharedButton"
import SharedNetworkIcon from "../Shared/SharedNetworkIcon"
import ExploreMarketLink, { getRelevantMarketsList } from "./ExploreMarketLink"
@@ -38,6 +36,7 @@ export default function NFTPreview(props: NFTWithCollection): ReactElement {
owner,
description,
attributes,
+ supply,
isBadge,
} = nft
const { totalNftCount } = collection
@@ -46,6 +45,10 @@ export default function NFTPreview(props: NFTWithCollection): ReactElement {
collection.floorPrice?.value !== undefined &&
collection.floorPrice
+ const ownerName = useBackgroundSelector((state) =>
+ getAccountNameOnChain(state, { address: owner, network })
+ )
+
// Chrome seems to have problems when elements with backdrop style are rendered initially
// out of the viewport - browser is not rendering them at all. This is a workaround
// to force them to rerender.
@@ -87,10 +90,10 @@ export default function NFTPreview(props: NFTWithCollection): ReactElement {
{t("preview.owner")}
- {truncateAddress(owner)}
+
{totalNftCount ?? "-"}
+{totalNftCount ?? supply ?? "-"}
- {isProbablyEVMAddress(contract) ? truncateAddress(contract) : "-"} -
+ {contract?.length ? ( +