diff --git a/src/constants/supportArticles.ts b/src/constants/supportArticles.ts
new file mode 100644
index 0000000000..995f316ca5
--- /dev/null
+++ b/src/constants/supportArticles.ts
@@ -0,0 +1,3 @@
+export enum SupportArticleURL {
+ UNSUPPORTED_TOKEN_AND_NFT_POLICY = 'https://support.uniswap.org/hc/en-us/articles/18783694078989-Unsupported-Token-Policy',
+}
diff --git a/src/nft/components/collection/UnavailableCollectionPage.test.tsx b/src/nft/components/collection/UnavailableCollectionPage.test.tsx
new file mode 100644
index 0000000000..2761813089
--- /dev/null
+++ b/src/nft/components/collection/UnavailableCollectionPage.test.tsx
@@ -0,0 +1,32 @@
+import { render, screen } from 'test-utils/render'
+
+import { UnavailableCollectionPage } from './UnavailableCollectionPage'
+
+describe('Nonexistent Collection', () => {
+ it('displays informative message', () => {
+ render()
+ expect(screen.getByText('No collection assets exist at this address')).toBeInTheDocument()
+ })
+
+ it('has a hyperlink back to the Explore page', () => {
+ render()
+ expect(screen.getByText('Return to NFT Explore')).toHaveAttribute('href', '/nfts')
+ })
+})
+
+describe('Blocked Collection', () => {
+ it('displays warning icon and informative message', () => {
+ render()
+ expect(screen.getByTestId('alert-icon')).toBeInTheDocument()
+ expect(screen.getByText('This collection is blocked')).toBeInTheDocument()
+ })
+
+ it('has hyperlinks to learn more and return to the Explore page', () => {
+ render()
+ expect(screen.getByText('Learn why')).toHaveAttribute(
+ 'href',
+ 'https://support.uniswap.org/hc/en-us/articles/18783694078989-Unsupported-Token-Policy'
+ )
+ expect(screen.getByText('Return to NFT Explore')).toHaveAttribute('href', '/nfts')
+ })
+})
diff --git a/src/nft/components/collection/UnavailableCollectionPage.tsx b/src/nft/components/collection/UnavailableCollectionPage.tsx
new file mode 100644
index 0000000000..cc2058e880
--- /dev/null
+++ b/src/nft/components/collection/UnavailableCollectionPage.tsx
@@ -0,0 +1,56 @@
+import { Trans } from '@lingui/macro'
+import Column from 'components/Column'
+import { SupportArticleURL } from 'constants/supportArticles'
+import { AlertTriangle } from 'react-feather'
+import styled, { useTheme } from 'styled-components'
+import { ExternalLink, StyledInternalLink, ThemedText } from 'theme/components'
+
+const Container = styled(Column)`
+ height: 75vh;
+ justify-content: center;
+ align-items: center;
+ text-align: center;
+ padding: 48px;
+ gap: 8px;
+`
+const StyledExternalLink = styled(ExternalLink)`
+ color: ${({ theme }) => theme.neutral2};
+`
+export function UnavailableCollectionPage({ isBlocked }: { isBlocked?: boolean }) {
+ const theme = useTheme()
+
+ if (isBlocked) {
+ return (
+
+
+
+ This collection is blocked
+
+
+ Return to NFT Explore
+
+
+ Learn why
+
+
+ )
+ }
+
+ return (
+
+
+ No collection assets exist at this address
+
+
+ Return to NFT Explore
+
+
+ )
+}
diff --git a/src/nft/pages/collection/index.tsx b/src/nft/pages/collection/index.tsx
index c82fae2ee1..750607f5eb 100644
--- a/src/nft/pages/collection/index.tsx
+++ b/src/nft/pages/collection/index.tsx
@@ -12,6 +12,7 @@ import { MobileHoverBag } from 'nft/components/bag/MobileHoverBag'
import { Activity, ActivitySwitcher, CollectionNfts, CollectionStats, Filters } from 'nft/components/collection'
import { CollectionNftsAndMenuLoading } from 'nft/components/collection/CollectionNfts'
import { CollectionPageSkeleton } from 'nft/components/collection/CollectionPageSkeleton'
+import { UnavailableCollectionPage } from 'nft/components/collection/UnavailableCollectionPage'
import { BagCloseIcon } from 'nft/components/icons'
import { useBag, useCollectionFilters, useFiltersExpanded, useIsMobile } from 'nft/hooks'
import * as styles from 'nft/pages/collection/index.css'
@@ -170,6 +171,7 @@ const Collection = () => {
}, [])
if (loading) return
+ if (!collectionStats.name) return
const toggleActivity = () => {
isActivityToggled
@@ -256,7 +258,7 @@ const Collection = () => {
>
) : (
-
No collection assets exist at this address
+
)}