FCH Profile

Table of Contents

UX

Overflow UX Flow

Sketch Design Assets

Profile View

Visual

Functionality

Visual

Functionality

Profile Look-up

 

FCH Not Found

 

Profile - Payments

 

  • Display

    • FIO Crypto Handle

    • Payments option

    • Links

      • Back to Profile Lookup

        • On click

          • Display Profile Look-up Page

      • Payment option

        • On click

          • Display Payment Details Page

      • Profile tabs

        • Payments

          • On click display Profile - Payments Page

        • NFT Signatures

          • On click display Profile - NFT Signatures Page

        • Socials

          • On click display Profile - Socials Page

Payment Details

 

  • Display

    • Elements as defined on Profile - Payments Page

    • Disclaimer

      • If token_code and chain_code are not the same and token_code is not *

        • “Chain - You’re sending [Token name] ([Token]) on the [Chain name] chain. Please make sure this is correct.”

          • Example: “Chain - You’re sending USD Coin (USDC) on the Ethereum chain. Please make sure this is correct.”

      • If token_code is *

        • “You can send any [Chain name] token to this address.”

          • Example: “You can send any Ethereum token to this address.”

    • FIO Crypto Handle

    • Public address as obtained from /get_pub_address

    • Public address QR code

    • Links

      • X

        • On click

          • Close pop-up

      • Copy

        • On click

          • Copy public address to clipboard

Profile - NFT Signatures

 

Empty State

 

  • Display

    • FIO Crypto Handle

    • NFT Signatures option

    • Links

      • Back to Profile Lookup

        • On click

          • Display Profile Look-up Page

      • NFT Image

        • On click

          • Display NFT Signature Details Page

      • Profile tabs

        • Payments

          • On click display Profile - Payments Page

        • NFT Signatures

          • On click display Profile - NFT Signatures Page

        • Socials

          • On click display Profile - Socials Page

NFT Signature Details

 

Image Altered

Image not Available

Multiple Signatures

 

  • Display

    • FIO Crypto Handle

    • Elements

      • See NFT Metadata

        • Show element and header only if element available

    • Links

      • X

        • On click

          • Close pop-up

      • View NFT - show if External URL available

        • On click

          • Open External URL in New Tab

Profile - Socials

 

Empty State

 

  • Display

    • FIO Crypto Handle

    • Social links - show only when data returned

      • Obtained from /get_pup_addresses and using chain_code: SOCIALS and the following token_codes:

        • DISCORD

          • Url

            • https://discordapp.com/users/username

        • DISCORDSER

          • Url

            • https://discord.gg/username

        • FACEBOOK

          • Url

            • https://facebook.com/username

        • HIVE

          • Url

            • https://peakd.com/@username

        • INSTAGRAM

          • Url

            • https://instagram.com/username

        • LINKEDIN

          • Url

            • https://www.linkedin.com/in/username

        • LINKEDINCO

          • Url

            • https://www.linkedin.com/company/username

        • MASTADONE

          • Url

            • https://mastodon.social/@username

        • NOSTR

          • Url

            • https://iris.to/username

        • REDDIT

          • Url

            • https://www.reddit.com/user/username

        • TWITTER

          • Url

            • https://twitter.com/username

        • TELEGRAM

          • Url

            • https://t.me/username

        • WHATSUP

          • Url

            • https://wa.me/username

        • YOUTUBE

          • Url

            • https://www.youtube.com/@username

        • FARCASTER

          • Url

            • https://warpcast.com/username

    • Links

      • Back to Profile Lookup

        • On click

          • Display Profile Look-up Page

      • Social Handle Tile

        • On click

          • Open url in New Tab

      • Profile tabs

        • Payments

          • On click display Profile - Payments Page

        • NFT Signatures

          • On click display Profile - NFT Signatures Page

        • Socials

          • On click display Profile - Socials Page

NFT Metadata

Requirement

Details

Requirement

Details

Token wildcard

  • It’s possible that token_id returned is a wildcard (“*”). If so no metadata is returned and “Multiple Signatures” variant is shown.

Fetching NFT Metadata

  • Get data from both

    • /get_nfts_fio_address

    • Infura NFT API spec

Combine Metadata

  • From /get_nfts_fio_address

    • NFT Hash

    • Creator URL

  • From Infura NFT API

    • NFT Name

    • NFT Description

    • External URL

  • Conditional

    • NFT Image

      • hostname rewrite

        • If NFT Image hostname is ipfs.infura.io change to fio.infura-ipfs.io

      • Source priority

        • Use if present in /get_nfts_fio_address and is image

        • Else

        • Use if present in Infura NFT API and is image

        • Else

        • Show “No image” variant

Imaged Altered banner

  • If image is present and hash is available, hash the image using SHA-256 and compare to hash from FIO API:

    • If same

      • Display “Image Not Altered Since Signed”

    • If not same

      • Display “Image Altered Since Signed”

    • Otherwise do not display any banner

FIO API spec

Requirement

Details

Requirement

Details

API spec

https://developers.fioprotocol.io/pages/api/fio-api/#post-/get_nfts_fio_address

Request Parameters

  • fio_address - FCH of profile

  • limit - 100

  • offset - 0

Response

  • url - NFT Image

  • hash - NFT Hash

  • metadatacreator_url - Creator URL

  • more - If more > 0 submit another request with offset set to total number of results returned

Infura NFT API spec

Requirement

Details

Requirement

Details

Authentication

  • In order to not expose API key, make calls server side

  • API key/secret to be provided

Endpoint

https://nft.api.infura.io/networks/{chainId}/nfts/{tokenAddress}/tokens/{tokenId}

API spec

https://docs.infura.io/infura/infura-expansion-apis/nft-api/rest-apis/api-reference/metadata

Request Parameters

  • chain_code to chainId mapping

    • ETH = 1

    • MATIC = 137

    • ARB1 = 42161

    • BSC = 56

    • AVAX = 43114

    • FTM = 250

  • tokenAddress - contract_address returned by /get_nfts_fio_address

  • tokenId - token_id returned by /get_nfts_fio_address

Response

  • metadata -> name - NFT Name

  • metadata -> image - NFT Image

  • metadata -> description- NFT Description

  • metadata -> external_url - External URL

Or

  • metadata -> nft ->

    • name - NFT Name

    • image - NFT Image

    • description- NFT Description

    • external_url - External URL

Moralis NFT API spec

Requirement

Details

Requirement

Details

Authentication

  • In order to not expose API key, make calls server side

  • API key/secret to be provided

Endpoint

https://deep-index.moralis.io/api/v2.2/nft/{address}/{token_id}?{chain}=bsc&format=decimal&normalizeMetadata=true&media_items=false'

API spec

https://docs.moralis.io/web3-data-api/evm/how-to-get-the-metadata-of-an-nft

https://docs.moralis.io/web3-data-api/evm/reference/get-contract-nfts

Request Parameters

  • chain_code to chain mapping

    • ETH = eth

    • MATIC = polygon

    • ARB1 = arbitrum

    • BSC = bsc

    • AVAX = avalanche

    • FTM = fantom

    • CRO = cronos

  • address - contract_address returned by /get_nfts_fio_address

  • token_id - token_id returned by /get_nfts_fio_address

Response

  • metadata -> name - NFT Name

  • metadata -> image - NFT Image

  • metadata -> description- NFT Description

  • metadata -> external_url - External URL

Resync API call

https://docs.moralis.io/web3-data-api/evm/reference/resync-metadata