/onchain-impact-dashboard

Show projects ongoing impact based on past retroactive funding rounds voting metric weightings

Primary LanguageTypeScriptMIT LicenseMIT

Onchain Impact Dashboard

OID enables builders to view their ongoing impact post-Retro Funding 4. Overview here.

The goal is to raise awareness of the existence of Retro Funding for onchain builders, encouraging them to:

  • sign up
  • view their impact based on past rounds outcomes
  • be positioned to apply to future rounds

Raising awareness of RF is the goal so we will be taking every opportunity to celebrate the wins of each project by sharing updates to the leaderboard weekly (or when appropriate) on social media.

The MVP will need the following:

  • Design (can use components and general feel of this other build)
  • Agora API integration - to get project data (profile pic, description, etc.)
  • Navigation Menu with CTA for builders to
  • View - Leaderboard (Top 10? Top 50?)
    • Ranked Projects, each project's profile picture and name, scrollable (left)
    • Chart showing impact of all projects, single overall metric (right)
  • View - Individual Projects
    • Project Details
    • Chart showing individual metrics for the project (15 or so metrics)
  • Social Media sharing integration
  • Backend for indexing and serving the metrics

Extras (We don't need these by deadline but we will add them when we can):

  • Add timeframes filtering to leaderboard/individual project
    • Select 1 day, 1 week, 1 month, 1 year and all-time timeframes
    • Share a link that has a specific timeframe selected
  • Add metric type filtering to leaderboard
    • Select which metrics to see on the chart
    • Share a link that has a specific metrics selected

Getting Started

  1. Clone this repo & install dependencies

    git clone https://github.com/BuidlGuidl/onchain-impact-dashboard.git
cd onchain-impact-dashboard
yarn install

  2. Set up your environment variables (and optionally, a local Firebase instance): Make a copy of the packages/nextjs/.env.example file and name it packages/nextjs/.env.local and fill in the required environment variables.

    Add a connection string for a MongoDB instance. This could be running locally or in the cloud.

  3. Seed data to your database:

    MONGODB_URI="Fill in with your MongoDB connection string" yarn seed

    Now make sure your FILL_DAYS environment variable is set and hit this api:

    http://localhost:3000/api/etl

    It should return a success message immediately but it will take a couple minutes to populate your database.

  4. Start the application

    Execute this command to start the nextjs project in development mode:

    yarn dev

API

Stubbed external APIs

Projects (Agora)

To get all:

    http://localhost:3000/api/stub/projects

To get one by id:

    http://localhost:3000/api/stub/projects?id=0x000123456789101112131415...

Time Series Data (OSO)

The data starts on 2024-01-01 and ends on 2024-04-01. To get all:

    http://localhost:3000/api/stub/series

To get specific dates:

    http://localhost:3000/api/stub/series?startDate=2024-02-01&endDate=2024-02-28

Mapping (OSO)

This is how we can associate Agora data to OSO data. To get all:

    http://localhost:3000/api/stub/mapping

To search by Agora id or OSO project_name:

    http://localhost:3000/api/stub/mapping?id=0x000123456... OR project_name