Recruitment project - ENS lookup dashboard

Intro

ENS (Ethereum Name Service) enables decentralized usernames based on Ethereum smart contracts. Domain names (e.g. joystream.eth) can be registered with an Ethereum transaction and can be used to resolve an Ethereum address (just like you would resolve an IP address via a DNS).

Task

Your task is to build a simple ENS dashboard that has the following functionalities:

1. Allows doing a name lookup (e.g. user inputs joystream.eth) and gets back the domain info:
   • Registrant address
   • Assigned ETH address
   • Registration date
   • Expiry date
2. Shows the list of the most recent domain registrations:
   • The list should be updated in real time as the registrations happen
   • The list should be paginated and only necessary data should be fetched
   • The list should be sorted by newest registrations
   • For each registration, same details as in step 1. should be displayed

Additional requirements

• The app should support ENS Reverse Resolution. The linked docs should give you a good understanding what this feature is. Example: if I can control a given address (let's say 0x0000000000000000000000000000dddd), I can set a reverse record for it to say that it should be resolved to example.eth. Whenever an Ethereum address is presented (domain assigned address is the exception), the app should try a reverse lookup and if the address resolves to a name, that name should be used instead of the raw address. So to follow the example, if there is a domain registration by 0x0000000000000000000000000000dddd, the app should display example.eth as the registrant.
• The app should handle all loading states and always present the current status to the user

Notes

• To submit the task, publish it in a Github repository (can be public or private with invite) and send the link to @kdembler
• Deadline to submit the task is 7 days from the moment you got the link
• You should write all the code yourself. If there are some small pieces authored by others you would like to use, that's fine, as long as you give proper attribution
• If anything is unclear, please ask questions
• For all the ENS data, ENS subgraph can be used. This way, you can easily fetch the data with GraphQL. If you are new to GraphQL, I recommend using Apollo Client, it also has docs on pagination.
• You are free to use whatever libraries/tech you'd like, the only requirement is React
• Try to focus on proper logic/clean code instead of UI aesthetics
• Bonus points:
  • Publicly available deployment (e.g. Netlify, Vercel, etc)
  • Sexy look
  • Responsive design