๐Ÿ‘จโ€๐ŸŽค xNFT.io
A fork of ๐ŸŽจ Nifty.ink with file uploads.

Tutorial Info

Author: Viraz Malhotra Source code: https://github.com/scaffold-eth/scaffold-eth-examples/tree/xnft Intended audience: Intermediate Topics: Scaffold-eth basics, NFTs, Meta Transactions, Burner Wallets, xDAI

๐Ÿƒโ€โ™€๏ธ Quick Start

NFT artwork created and sold on xDAI using meta transactions, burner wallets, and bridged to Ethereum.
1
git clone -b xnft https://github.com/scaffold-eth/scaffold-eth-examples.git xnft
Copied!

Running xnft on xDai / Mainnet

This will run the xnft frontend on the production smart contracts on xDai / Mainnet.
Create a .env file with the following variables in packages/react-app
1
REACT_APP_NETWORK_NAME=xdai
2
REACT_APP_NETWORK_COLOR=#f6c343
3
REACT_APP_USE_GSN=true
4
REACT_APP_GRAPHQL_ENDPOINT=https://api.thegraph.com/subgraphs/name/azf20/nifty-ink
5
REACT_APP_GRAPHQL_ENDPOINT_MAINNET=https://api.thegraph.com/subgraphs/name/azf20/nifty-ink-main
Copied!
Unzip contracts_xdai_mainnet in packages/react-app/src -> this should create a new contracts folder
Get the react front-end up and running - http://localhost:3000โ€‹
1
cd xnft
2
โ€‹
3
yarn install
4
โ€‹
5
yarn start
Copied!

Running xnft locally

It is not currently possible to easily run cross-chain xnft locally. Below are instructions for running the xDai portion of xnft on a local chain ("sidechain") running on port=8456.
  • The app will still look tokens on the mainchain, but it will refer to mainnet and bridge functionality will not be usable (there is a setup to test the bridge using Kovan <> Sokol)
  • The instructions below do not use the GSN setup we have in the production app
Create a .env file with the following variables in packages/react-app
1
REACT_APP_NETWORK_COLOR=#f6c343
2
REACT_APP_GRAPHQL_ENDPOINT=http://localhost:8000/subgraphs/name/azf20/nifty-ink
3
REACT_APP_GRAPHQL_ENDPOINT_MAINNET=https://api.thegraph.com/subgraphs/name/azf20/nifty-ink-main
4
REACT_APP_USE_GSN=false
Copied!
Terminal A: Get the react front-end up and running - http://localhost:3000โ€‹
1
cd xnft
2
โ€‹
3
yarn install
4
โ€‹
5
yarn start
Copied!
Terminal B: Run the local chain
1
cd xnft
2
yarn run sidechain
Copied!
Terminal C: Generate a deployment account
1
cd xnft
2
yarn run generate
Copied!
Take the address generated, and send it some funds using the faucet in the react-app (this is necessary to deploy the contracts). If you lose this terminal, you can find the address (and the mnemonic!) in /packages/buidler Then deploy the contracts:
1
yarn run sidechaindeploy
Copied!
Terminal D: Run a local graph node <- Requires docker
Before that delete a generated folder: /docker/graph-node/data
1
cd xnft/docker/graph-node
2
docker-compose up
Copied!
Terminal E: Create and deploy the subgraph on your local graph node NOTE: if you update the XNFT smart contracts, you will need to update the ABIs in /packages/niftygraph/abis
1
cd xnft/packages/niftygraph
2
yarn codegen
3
yarn build
4
yarn create-local
5
yarn deploy-local
Copied!
After yarn codegen - your contract addresses inside /packages/niftygraph/subgraph.yaml should have been updated Your local environment is up and running, get inking!
And after you update your page you are ready to go!
We welcome and are eternally grateful for features and pull requests!

Contract architecture:

  • NiftyRegistry - keeps track of all the other Contracts
  • NiftyInk - creation of artworks
  • NiftyToken - NFT Contract
  • NiftyMediator - Passing Tokens across the Tokenbridge
  • NiftyMain - MainChain NFT Contract (can only mint on the basis of Tokenbridge messages)
  • Liker - generic "Likes" contract
Imported contracts:
  • AMBMediator - generic AMB functionality
  • SignatureChecker - verifying signatures (IERC1271 compatibility)
Note that some of the contracts in this repo are not the on-chain contracts, those which have been changed have their originals in /v1-contracts (the primary change is to emit an event on setting the price of an ink or a token)

Actions:

Action
Description
Signature supported?
GSN supported?
Payable?
Create
Creates an ink & mints the first token copy to the artist
y
y
n
Mint
Creates a copy to the specified address
y
y
n
Set ink price
Set the price for non-artists to buy tokens
y
y
n
Set token price
Set the price for an individual token
n
n
n
Buy Ink
Buy a new token copy at the artist-specified price
n
n
y
Buy Token
Buy a specific token at the token-owner specified price
n
n
y
Send
Send an individual token to an address
n
n
n
Upgrade
Transfer an individual token from xDai to mainnet, paying the relayPrice if applicable
y
n
y
Like
"Like" an individual ink
y
y
n

The upgrade path

nifty.ink lets users upgrade their xDai ink NFTs to the Ethereum mainnet. This is a one-way door! Once you upgrade you cannot bring your inks back to xDai. The xDai token is locked in the Mediator contract, and a new matching token is minted on Mainnet on the basis of the tokenbridge relay When you upgrade, you have to pay a fee - this is to cover the costs of minting a token on mainnet, and is controlled by a price Oracle bot.

Housekeeping

  • we are running a GSN2 relay on xDai at relay.tokenizationofeverything.com (manager address at 0xb54a1c00c937db7ac538edbb4d3350da1bf4d812)
  • we need to keep the xDai GSN Paymaster topped up at 0x2ebc08948d0DD5D034FBE0b1084C65f57eF7D0bC Ensure the mainnet bridge ETH topped up: 0x87533bfd390c6d11afd8df1a8c095657e0eeed0d We have a GSN relay running at relay.tokenizationofeverything.com

Sources