-
Notifications
You must be signed in to change notification settings - Fork 306
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
6 changed files
with
217 additions
and
58 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,84 @@ | ||
| import { ArtContent } from '@components/common/NFTArt'; | ||
| import React, { useMemo } from 'react'; | ||
| import useAsyncEffect from 'use-async-effect'; | ||
|
|
||
| import { LoadingState as TokenMetadataLoadingState, useTokenMetadata } from './account/SplTokenMetadataInterfaceCard'; | ||
|
|
||
| enum LoadingState { | ||
| PreconditionFailed, | ||
| Started, | ||
| Succeeded, | ||
| Failed, | ||
| } | ||
|
|
||
| function useTokenMetadataWithUri(mint: string) { | ||
| const { loading, metadata } = useTokenMetadata(mint); | ||
|
|
||
| const initialLoadingState = | ||
| metadata && loading === TokenMetadataLoadingState.MetadataFound | ||
| ? LoadingState.Started | ||
| : LoadingState.PreconditionFailed; | ||
| const [jsonLoading, setJsonLoading] = React.useState<LoadingState>(initialLoadingState); | ||
| const [metadataJson, setMetadataJson] = React.useState<object | null>(null); | ||
|
|
||
| useAsyncEffect(async () => { | ||
| if (!metadata) { | ||
| return; | ||
| } | ||
| try { | ||
| const result = await fetch(metadata.uri); | ||
| if (result.ok) { | ||
| const json = await result.json(); | ||
| setMetadataJson(json); | ||
| setJsonLoading(LoadingState.Succeeded); | ||
| } else { | ||
| setJsonLoading(LoadingState.Failed); | ||
| } | ||
| } catch (err) { | ||
| setJsonLoading(LoadingState.Failed); | ||
| } | ||
| }, [loading, metadata]); | ||
|
|
||
| return useMemo(() => ({ jsonLoading, jsonMetadata: metadataJson }), [jsonLoading, metadataJson]); | ||
| } | ||
|
|
||
| export function Token22NFTHeader({ mint }: { mint: string }) { | ||
| const { metadata } = useTokenMetadata(mint); | ||
| const { jsonLoading, jsonMetadata } = useTokenMetadataWithUri(mint); | ||
|
|
||
| const ui = useMemo(() => { | ||
| if (jsonLoading === LoadingState.PreconditionFailed || jsonLoading === LoadingState.Started) { | ||
| return <div>Loading...</div>; | ||
| } | ||
|
|
||
| if (jsonLoading === LoadingState.Failed || !jsonMetadata || !metadata) { | ||
| return <div>Failed</div>; | ||
| } | ||
|
|
||
| return ( | ||
| <div className="row"> | ||
| <div className="col-auto ms-2 d-flex align-items-center"> | ||
| <ArtContent pubkey={mint} data={jsonMetadata as any} /> | ||
| </div> | ||
| <div className="col mb-3 ms-0.5 mt-3"> | ||
| {<h6 className="header-pretitle ms-1">Token Extension NFT</h6>} | ||
| <div className="d-flex align-items-center"> | ||
| <h2 className="header-title ms-1 align-items-center no-overflow-with-ellipsis"> | ||
| {metadata.name !== '' ? metadata.name : 'No NFT name was found'} | ||
| </h2> | ||
| </div> | ||
| <h4 className="header-pretitle ms-1 mt-1 no-overflow-with-ellipsis"> | ||
| {metadata.symbol !== '' ? metadata.symbol : 'No Symbol was found'} | ||
| </h4> | ||
| <div className="ms-1">{new Map(metadata.additionalMetadata).get('Description')}</div> | ||
| </div> | ||
| </div> | ||
| ); | ||
| }, [metadata, jsonLoading, jsonMetadata, mint]); | ||
|
|
||
| return ui; | ||
| } | ||
|
|
||
| // function getIsMutablePill(isMutable: boolean) { | ||
| // return <span className="badge badge-pill bg-dark">{`${isMutable ? 'Mutable' : 'Immutable'}`}</span>; | ||
| // } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,44 @@ | ||
| import { base64 } from '@project-serum/anchor/dist/cjs/utils/bytes'; | ||
| import { createEmitInstruction, TokenMetadata, unpack as deserializeTokenMetadata } from '@solana/spl-token-metadata'; | ||
| import { useConnection } from '@solana/wallet-adapter-react'; | ||
| import { MessageV0, PublicKey, VersionedTransaction } from '@solana/web3.js'; | ||
| import { useEffect, useState } from 'react'; | ||
|
|
||
| export function useTokenMetadataExtension(programId: PublicKey | undefined, metadataPointer: PublicKey | undefined) { | ||
| const { connection } = useConnection(); | ||
| const [tokenMetadata, setTokenMetadata] = useState<TokenMetadata | null>(null); | ||
| const [loading, setLoading] = useState(true); | ||
|
|
||
| useEffect(() => { | ||
| async function fetchTokenMetadata() { | ||
| if (!programId || !metadataPointer) { | ||
| return; | ||
| } | ||
| const ix = createEmitInstruction({ metadata: metadataPointer, programId }); | ||
| const message = MessageV0.compile({ | ||
| instructions: [ix], | ||
| payerKey: new PublicKey('86xCnPeV69n6t3DnyGvkKobf9FdN2H9oiVDdaMpo2MMY'), | ||
| recentBlockhash: (await connection.getLatestBlockhashAndContext()).value.blockhash, | ||
| }); | ||
|
|
||
| const tx = new VersionedTransaction(message); | ||
| const result = await connection.simulateTransaction(tx, { | ||
| commitment: 'confirmed', | ||
| replaceRecentBlockhash: true, | ||
| sigVerify: false, | ||
| }); | ||
|
|
||
| if (result.value.returnData) { | ||
| const buffer = base64.decode(result.value.returnData.data[0]); | ||
| console.log('Inner found metadata, setting'); | ||
| setTokenMetadata(deserializeTokenMetadata(buffer)); | ||
| } | ||
|
|
||
| setLoading(false); | ||
| } | ||
|
|
||
| fetchTokenMetadata(); | ||
| }, [connection, programId, metadataPointer]); | ||
|
|
||
| return loading ? null : tokenMetadata; | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,10 @@ | ||
| import { ParsedData, TokenMintExtensionData } from '..'; | ||
|
|
||
| export default function isT22NFT(parsedData?: ParsedData): parsedData is TokenMintExtensionData { | ||
| return ( | ||
| parsedData && | ||
| parsedData.parsed.info && | ||
| parsedData.parsed.info.extensions && | ||
| (parsedData.parsed.info.extensions as Record<string, string>[]).find(ext => ext.extension === 'metadataPointer') | ||
| ); | ||
| } |