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)} + -
+
{t("preview.floorPrice")} @@ -153,13 +156,15 @@ export default function NFTPreview(props: NFTWithCollection): ReactElement {
{t("preview.itemsCount")}
-

{totalNftCount ?? "-"}

+

{totalNftCount ?? supply ?? "-"}

{t("preview.creator")}
-

- {isProbablyEVMAddress(contract) ? truncateAddress(contract) : "-"} -

+ {contract?.length ? ( + + ) : ( + "-" + )}
@@ -261,6 +266,7 @@ export default function NFTPreview(props: NFTWithCollection): ReactElement { .preview_section_column { display: flex; flex-direction: column; + min-width: 0; } .preview_section_row { display: flex; @@ -309,6 +315,9 @@ export default function NFTPreview(props: NFTWithCollection): ReactElement { gap: 16px; justify-content: flex-start; } + .no_shrink { + flex-shrink: 0; + } `} ) diff --git a/ui/components/Shared/SharedAddress.tsx b/ui/components/Shared/SharedAddress.tsx index 179239cfd8..747b1d1ff3 100644 --- a/ui/components/Shared/SharedAddress.tsx +++ b/ui/components/Shared/SharedAddress.tsx @@ -74,6 +74,7 @@ export default function SharedAddress({