API Usage

Now we've set up the GraphQL client and authentication, let's explore the app and its use of the Niftory API surface to build these core capabilities:

  • User Profile: Get the Profile of the user (name, email, image, and etc). Performed via the AppUser queries. A deep dive on these queries is available in App and AppUser.

  • NFTs: Get all of NFTs that are available through your application, and all of the NFTs that belong to a user using the NFTModels and NFTs queries respectively.

  • Wallets: Setup a wallet for a new user, or query the user's wallet via the Wallets query.

AppUser

With your GraphQL client set up, every request you make to the Niftory API service will automatically contain the logged-in user's authentication token, and your app's API key. This allows the API service to implicitly infer the context of the caller.

For example, to get the AppUser object representing the currently logged-in user, you simply have to run the appUser query, without any arguments!

const GET_APP_USER = gql`
  query {
    appUser {
      id
      name
      email
      image
      app {
        id
      }
      wallet {
        id
        address
        state
      }
    }
  }
`;

We recommend wrapping your GraphQL queries in React Hooks. For example, the above query can be part of a useUser hook, so you can easily get the user context anywhere in your application.

NFTs

Now for the fun part! Let's get some NFTs to display and transfer:

Note that to actually create NFT content, use the Niftory Admin Portal -- the same place you got your API keys from. You can create your NFT collection there.

Querying Available NFTs

In order to display the NFT content available through your app, use the nftModels API. This query returns all the NFTModel's that you have marked as Available in the Admin Portal.

Recall that an NFTModel is basically a blueprint for an NFT -- it contains all the content and metadata that would get minted. You can limit the supply of NFTs for an NFTModel by setting its quantity appropriately (using the Admin Portal as follows).

const GET_NFT_MODELS = gql`
  query {
    nftModels {
      id
      blockchainId
      title
      description
      quantity
      status
      rarity
      content {
        files {
          media {
            url
            contentType
          }
          thumbnail {
            url
            contentType
          }
        }
        poster {
          url
        }
      }
    }
  }
`;

While the query works without any arguments, you can optionally specify a filter (e.g. get only NFTs belonging to a particular Set)

Querying User's NFT Collection

Use the nfts query to get NFT's belonging to the currently logged-in user. Like the nftModels query, you can also filter this query as needed (by particular NFTModel's, for example).

const GET_USER_NFTs = gql`
  query {
    nfts {
      id
      model {
        id
        title
      }
    }
  }
`;

The sample app wraps all these queries in React Hooks; we'd recommend you to do the same to easily use these objects throughout your application.

The queries above don't query the blockchain directly. Instead, they query Niftory's database representation of the blockchain, which helps make them very fast, and allows non-blockchain data (such as not-yet-minted NFTModels) to be retrieved from the same API.

Wallets

Querying a Wallet

To get the currently logged-in user's Wallet simply call the wallet query without any arguments:

const GET_USER_WALLET = gql`
  query {
    wallet {
      id
      address
      state
      verificationCode
    }
  }
`;

Wallet Setup

The Wallet Setup guide explains in detail how to setup a user's wallet, but the high level idea is this:

  • Call registerWallet mutation to associate a Wallet address with an AppUser.

const REGISTER_WALLET = gql`
  mutation ($address: String!) {
    registerWallet(address: $address) {
      id
      address
      verificationCode
      state
    }
  }
`;
  • Call verifyWallet with a signed verification code (the verification code is returned by the registerWallet mutation).

const VERIFY_WALLET = gql`
  mutation ($address: String!, $signedVerificationCode: JSON!) {
    verifyWallet(
      address: $address
      signedVerificationCode: $signedVerificationCode
    ) {
      id
      address
      state
    }
  }
`;
  • Finally, call readyWallet to mark the Wallet as initialized for your application.

const READY_WALLET = gql`
  mutation ($address: String!) {
    readyWallet(address: $address) {
      id
      address
      state
    }
  }
`;

Last updated