# SuperFluid Console Notes
Through an explorer, SuperFluid Console enables users to query information about Superfluid which isn't surfaced by Etherscan/Blockscout, for example streams and IDA related information. It also enables users to save addresses to an address book.
Through an operational interface, the console enables users to create tokens and request us to do things (i.e. register tokens on our resolver)
[Original Spec](https://www.notion.so/Superfluid-Console-Spec-29af58065ded47ada6a074a67f61f038)
## Main Objectives
- Provide information that isn't easily accessible from explorers
- Provide some useful tools pushing developers to register themselves
## 5 Pages
1. Front page
- Logged in + logged out varieties
2. SuperToken page
3. Inspector page
3a. Account Page
3b. SuperApp page
4. Create new token page
6. Request superApp deploy key
## Spec questions/comments
1. Should the design be mobile friendly?
2. Does the client want us to go through a design-phase first?
3. Can the MVP build be broken into phases?
4. Where is the api key coming from in the SuperApp page? Does it exist outside of the app?
5. How do we know if a token is using the latest superToken.sol
6. Is the search across a single network? If so why would we need to down rank testnet results?
7. What contracts will be used for deploying a supertoken? Is there solidity work that needs to be done on our end or are we good to go?
8. Do we need `superfluid-sdk` for any functionality?
## Old Scope - User Stories
```gherkin=
Feature: Unauthenticated User - Front Page
Scenario: User can search valid address
Given all circumstances
Then the user can search for an address in all available Superfluid networks
Then the user is returned a corresponding superToken, superApp, or account
Scenario: User wants clicks to save resource
Given the user is not logged in
Then the user is prompted to log in
Scenario: User wants to log in
Given all circumstances
Then the user can select to login using Discord Auth0
```
```gherkin=
Feature: Unauthenticated User - SuperToken Page
Scenario: User clicks the SuperToken page link
Given The token selected is "listed"
Then a usable URL (~/xdai/supertoken/{address}) is created
Then the user can view:
* Metadata (maybe)
* What kind of token it is (Custom vs Wrapped)
* Address and name of underlying token
* If it is the latest version of superToken.sol, or if not latest, whichever version it is
* Total Supply
* Number of holders
* TVL, if applicable
* Total # of open streams in this token
* Total # of active IDAs in this token
* All users with active streams, so a user can "discover" accounts
Scenario: User wants to add resource to favorites
Given all circumstances
Then signup page opens
Then after signup, user can add resource to list of favorites
```
```gherkin=
Feature: Unauthenticated User - Account Page
Scenario: User clicks the Account page link
Given all circumstances
Then a usable URL (~/xdai/account/{address}) is created
Then the user can view:
* Detailed breakdown of all (listed?) superTokens held by the user.
Then the user can view details for each token:
* Balance at time of loading (no need for animation)
* NetFlow
* Number of active streams
* If it's a superToken wrapper, show underlying token's balance too
Scenario: User clicks on a currency
Given all circumstances
Then the user can view:
* IDA information
* CFA information
* Activity history
Scenario: User wants to add resource to favorites
Given all circumstances
Then signup page opens
Then after signup, user can add resource to list of favorites
```
```gherkin=
Feature: Unauthenticated User - SuperApp Page
Scenario: User clicks the SuperToken page link
Given The token selected is "listed"
Then a usable URL (~/xdai/supertoken/{address}) is created
Then the user can view:
* Metadata (maybe)
Scenario: User wants to create a SuperApp
Given The user is not signed in
Then a signup/in page opens
Then API key page opens
Scenario: User wants to get priority support
Given The user is not signed up
Then a signup page opens
Scenario: User wants to add resource to favorites
Given The user is not signed in
Then a signup page opens
Then the user adds resource to list of favorites
```
```gherkin=
Feature: Authenticated User - Front Page
Scenario: User can search valid address
Given all circumstances
Then the user can search for an address in all available Superfluid networks
Then the user is returned a corresponding superToken, superApp, or account
Scenario: User wants clicks to save resource
Given the user is not logged in
Then the user is prompted to log in
Scenario: User wants view list of favorite addresses
Given the user is logged in
Then the user can open a sidebar on the right
Scenario: User wants to create a token
Given the user is logged in
Then the user can select the create a token link
Scenario: User wants to request a SuperApp deploy key
Given the user is logged in
Then the user can select the deploy key link
```
```gherkin=
Feature: Authenticated User - Create a token
Scenario: user goes through token creation wizard
Given user is logged in
Then the user
* picks a network
* connects their wallet
* decides whether to create wrapped vs custom token
* add colors, graphics, etc... for dashboard
* adds extra metadata for exporer (maybe)
* sign with wallet
Then token is automatically added to user's list of favorites
Then submission is sent to SuperFluid's approval process
Scenario: user waits for token approval
Given user is logged in and token is not approved
Then user views loading symbol (blue checkmark after approved)
```
```gherkin=
Feature: Authenticated User - Get SuperApp Deploy Key
Scenario: User goes through deploy key wizard
Given user is logged in
Then the user
* picks a network
* inputs a deployer address
* choose if it's a "one off" or a "factory contract"
* submits link to code repository
* adds comments for SuperFluid
Then the website should submit the information to an API endpoint TBD
```
## New Scope - User Stories
```gherkin=
Feature: Front Page
Scenario: User can search valid address
Given all circumstances
Then the user can search for an address in all available Superfluid networks
Then the user is returned a corresponding superToken, or superApp
Scenario: User wants to view a list of favorite addresses
Then the user can open a sidebar on the right
Scenario: User wants to create a token
Then the user can select the create a token link
Scenario: User wants to request a SuperApp deploy key
Then the user can select the deploy key link
```
```gherkin=
Feature: SuperToken Page
Scenario: User clicks the SuperToken page link
Given The token selected is "listed"
Then a usable URL (~/xdai/supertoken/{address}) is created
Then the user can view:
* What kind of token it is (Custom vs Wrapped)
* Address and name of underlying token
* If it is the latest version of superToken.sol, or if not latest, whichever version it is
* Total Supply
* Number of holders
* TVL, if applicable
* Total # of open streams in this token
* Total # of active IDAs in this token
* All users with active streams, so a user can "discover" accounts
Scenario: User wants to add resource to favorites
Given all circumstances
Then user can add resource to list of favorites in local storage
```
```gherkin=
Feature: Account Page
Scenario: User clicks the Account page link
Given all circumstances
Then a usable URL (~/xdai/account/{address}) is created
Then the user can view:
* Detailed breakdown of all (listed?) superTokens held by the user.
Then the user can view details for each token:
* Balance at time of loading (no need for animation)
* NetFlow
* Number of active streams
* If it's a superToken wrapper, show underlying token's balance too
Scenario: User clicks on a currency
Given all circumstances
Then the user can view:
* IDA information
* CFA information
* Activity history
Scenario: User wants to add resource to favorites
Given all circumstances
Then user can add resource to list of favorites on local storage
```
```gherkin=
Feature: SuperApp Page
Scenario: User clicks the SuperToken page link
Given The token selected is "listed"
Then a usable URL (~/xdai/supertoken/{address}) is created
Then the user can view:
* Metadata (maybe)
Scenario: User wants to create a SuperApp
Then API key page opens
Scenario: User wants to add resource to favorites
Then the user adds resource to list of favorites on local storage
```
```gherkin=
Feature: Create a token
Scenario: user goes through token creation wizard
Then the user
* picks a network
* connects their wallet
* decides whether to create wrapped vs custom token
* add colors, graphics, etc... for dashboard
* adds extra metadata for exporer (maybe)
* sign with wallet
Then token is automatically added to user's list of favorites
Then submission is sent to SuperFluid's approval process
Scenario: user waits for token approval
Given user is logged in and token is not approved
Then user views loading symbol (blue checkmark after approved)
```
```gherkin=
Feature: Get SuperApp Deploy Key
Scenario: User goes through deploy key wizard
Then the user
* picks a network
* inputs a deployer address
* choose if it's a "one off" or a "factory contract"
* submits link to code repository
* adds comments for SuperFluid
Then the website should submit the information to an API endpoint TBD
```
## Tech Stack
- GraphQL
- React
- Styled-Components
- Discord Auth0
- React Router
- Authentication Lib (need to specify)
- Express Server
- DB (need to specify)
- Superfluid SDK (maybe)
- Ethers.js
## Team
- Tae - Account Manager
- Elliott - Project Manager
- Keating - Frontend / Backend
- Jeff - Backfill / shadow / backend
## Cost Estimate
| Phases | Cost | Time estimate |
| -------- | -------- | -------- |
| Development | 18,300 DAI | 20 days |
| Testing & QA | 3,700 DAI | 4 days |
| **Total Estimate** | 22,000 DAI | |
Sign in with Wallet
Connect another wallet