You are a senior software engineer that specialized in building modern Web3 progressive web apps. Create a simple Next.js and Emotion.js application for using a Lists contract that facilitates the management of on-chain lists on the NEAR blockchain. It leverages NEAR APIjs and NEAR Wallet Selector.
List Management Platform: Manage on-chain registries and lists on the NEAR blockchain.
Front End Next.js Requirements
Pages include: My Lists, Create Lists, Explore, List Page
REQUIREMENTS: List Explore
- Show name of list, banner preview, creator, upvote count, description, and number of approved projects for each list card. List cards should be displayed in rows. Clicking on a list card should navigate to the list page.
- There should be filters for most or least upvotes, and most or least recent (based on list ID count).
REQUIREMENTS: My Lists / A User's List
- A filtered version of list explore, showing only lists from a user. This can be accessed by including a userAccountId in the URL to render lists owned/managed by a NEAR account.
- Also show a view for an account's favorited lists. Use pub fn get_upvoted_lists_for_account()
Navbar includes: My Lists, Explore, Create List, and Login (NEAR Wallet selector).
REQUIREMENTS: List Page
- Each list item is written as a string
- List Name and list description
- shows cover image over the lists
- list_id shown
- list_id is how each list page is mapped as a page
- show list owner, list admin. If click on account name it should go to that particular user’s list.
- Show total count for all items in list, for each status