diff --git a/app/address/[address]/layout.tsx b/app/address/[address]/layout.tsx
index 32663dd0..0a8f2930 100644
--- a/app/address/[address]/layout.tsx
+++ b/app/address/[address]/layout.tsx
@@ -38,7 +38,7 @@ import { PublicKey } from '@solana/web3.js';
import { Cluster, ClusterStatus } from '@utils/cluster';
import { FEATURE_PROGRAM_ID } from '@utils/parseFeatureAccount';
import { useClusterPath } from '@utils/url';
-import { MetadataPointer, TokenMetadata } from '@validators/accounts/token-extension'
+import { MetadataPointer, TokenMetadata } from '@validators/accounts/token-extension';
import Link from 'next/link';
import { redirect, useSelectedLayoutSegment } from 'next/navigation';
import React, { PropsWithChildren, Suspense } from 'react';
@@ -48,6 +48,7 @@ import useSWRImmutable from 'swr/immutable';
import { Base58EncodedAddress } from 'web3js-experimental';
import { CompressedNftAccountHeader, CompressedNftCard } from '@/app/components/account/CompressedNftCard';
+import { useCompressedNft } from '@/app/providers/compressed-nft';
import { FullTokenInfo, getFullTokenInfo } from '@/app/utils/token-info';
const IDENTICON_WIDTH = 64;
@@ -503,7 +504,7 @@ function MoreSection({ children, tabs }: { children: React.ReactNode; tabs: (JSX
function getTabs(pubkey: PublicKey, account: Account): TabComponent[] {
const address = pubkey.toBase58();
const parsedData = account.data.parsed;
- const tabs: Tab[] = [
+ const tabs: (Tab & { compressed?: boolean })[] = [
{
path: '',
slug: 'history',
@@ -541,24 +542,23 @@ function getTabs(pubkey: PublicKey, account: Account): TabComponent[] {
tabs.push(...TABS_LOOKUP[`${programTypeKey}:metaplexNFT`]);
}
- if (!tabs.find(tab => tab.slug === 'metadata')) {
+ // Compressed NFT tabs
+ if ((!account.data.raw || account.data.raw.length === 0) && !account.data.parsed) {
tabs.push(
{
+ compressed: true,
path: 'metadata',
slug: 'metadata',
title: 'Metadata',
},
{
+ compressed: true,
path: 'attributes',
slug: 'attributes',
title: 'Attributes',
- }
+ },
+ { compressed: true, path: 'compression', slug: 'compression', title: 'Compression' }
);
- tabs.push({
- path: 'compression',
- slug: 'compression',
- title: 'Compression',
- });
}
const isNFToken = account && isNFTokenAccount(account);
@@ -595,7 +595,13 @@ function getTabs(pubkey: PublicKey, account: Account): TabComponent[] {
return tabs.map(tab => {
return {
- component: