Staking

Tech stack

• Next.js
• React
• React Query
• Recoil
• Unstated-next
• Styled-Components
• Immer

Ethereum stack

• ethers.js v5 - Ethereum wallet implementation.
• Blocknative Onboard - for ethereum wallet connectivity.
• synthetix-data - for historical data (powered by TheGraph).
• @synthetixio/contracts-interface - for interactions with the Synthetix protocol.
• @synthetixio/providers - for web3 providers on Layer 1 & 2.
• @synthetixio/optimism-networks - Utility library for Optimism Layer 2 support.
• @synthetixio/transaction-notifier - for transaction status.

Development

Install dependencies

npm i

Set up environment variables

Copy the .env.local.example file in this directory to .env.local (which will be ignored by Git):

cp .env.local.example .env.local

Then, open .env.local and add the missing environment variables:

• NEXT_PUBLIC_PORTIS_APP_ID - Portis app id (get it from portis.io)
• NEXT_PUBLIC_BN_ONBOARD_API_KEY - Blocknative Onboard API key (get it from blocknative.com)
• NEXT_PUBLIC_INFURA_PROJECT_ID - Infura project id (get it from infura.io)

Run

npm run dev

Open http://localhost:3000 to view it in the browser.

Build

npm run build
npm start

Test

Before running e2e tests, you have to set environmental variable named SECRET_WORDS which can be imported as an account in metamask.

SECRET_WORDS="word1, word2, ..." npm run test:e2e