---
# System prepended metadata

title: User Dashboards v1 Spec and Questions

---

# User Dashboards v1 Spec and Questions

*References:*

- [Linear](https://linear.app/govrn/issue/PRO-342/spec-user-dashboards)
- [Dashboards User Stories](https://hackmd.io/DpuCeuJoT8m-s2fcRqkcCw?both#User-Stories)

## Questions

- **How do we want to handle *Unassigned* Contributions?**
  - All Contributions not attributed to a DAO will be *Unassigned* -- as of now, this could be the major bucket for most of our users
  - Design consideration: How does this look for the stacked bar chart? This will likely be the largest bucket
  - Do we want to include *Unassigned* by default or add this to be selected in the multi-select filter?
  - *Unassigned* has a different impact in each type of chart: 
    - For the heatmap, including *Unassigned* will increase the **total contributions** per day, but we won't see them grouped by DAO 'buckets' in this view
    - For the stacked bar chart, including *Unassigned* will be more directly visible as this'll show as one of the bars
    - Is this what we'd want or does this introduce too much noise to these views?
- **Stacked Bar Chart Impact**:
  - Will this be less effective if a user is in a lot of DAOs due to the visual clutter on the Y-axis? 
  - Do we think that our users will be more likely to be core contributors to a handle of DAOs (bar chart would be less noisy) or have 1 or 2 contributions to many DAOs (bar chart may become too noisy if showing a lot of DAO buckets)
- **Filters will impact the graphs differently:**
    - Heat map → reduce number of Contributions per day when filtering by specific DAO
    - Stacked bar chart → would only show an individual bar when filtering by single DAO, and then also show *Unassigned*
- **Multi-Select Filter:**
  - Populated with the DAOs that a user is in with *all selected* by default
    - Select more than 1 DAO → show all Contributions for all chosen DAOs
  - Do we want *Unassigned* to also be displayed by default or select all of a user's DAOs *except* Unassigned?
- **Aggregation:**
    - Does it matter how many *Attestations* each Contribution has?
    - Do we only show minted Contributions?
        - This would reduce the data load and noise
        - Favor minted Contributions — users will only surface DAOs on ones

## Technical Considerations

- Home **route** changed to the Dashboard view for connected users
  - **Connected and existing user:**
    - `/dashboard` route will be the Home by default for logged in users and accessed by clicking on *Home* in the menu
    - Will also redirect from `/` and act as the app home page
  - **Not connected:**
    - If not connected, users see a view prompting them to connect (similar to what we have now)

### Charts Components

- **Requirements**:
    - *Contribution Heat Map*:
        - Contribution calendar similar to GitHub’s Heat Map
        - Daily Contribution volume (number of user’s Contributions per day)
            - Header is each month
            - X axis: Each week
            - Y axis: Each weekday
            - Contribution count per day:
                - No color if count per day = 0
                - Lightest color for 1 Contribution
                - Darker color as the count increases
        - Query will aggregate based on total Contributions for all selected DAOs for the specified date range (working back from current day)
          - Won't include differentiation between DAO 'buckets' -- all Contributions meeting the filter requirements are surfaced in this view and rolled up to the daily Contribution heat map
    - *DAO Stacked Bar Chart*:
      - Shows Contributions grouped by *day* and sorted by DAO 'bucket'
      - 
- **Components**:
    - Chart Shell/Wrapper
        - Responsive: Charts will stack vertically on mobile, horizontally on desktop
    - Filter is a multi-select that populates based on the user's DAOs (including an option for 'No DAO' which would be the Unassigned Contributions)
    - By default all are selected
    - Contribution Heat Map
    - Contribution Stacked Bar Chart
- **Implementation:**
    - Leverage charts Libraries:
        - Determine which one would be lightest weight and work best
        - [https://react-charts.tanstack.com/](https://react-charts.tanstack.com/)
        - [https://recharts.org/en-US/](https://recharts.org/en-US/)
        - https://github.com/uiwjs/react-heat-map

### Filters

- **Requirements:**
    - Filter by all DAOs and potentially *Unassigned*(default, no filter)
        - Default state of the data:
            - All user Contributions able to be grouped by the specified date ranges (day, but constrained by a certain range)
                - Support a shifting range window
                - Find today, and then figure out each weekday and determine how many days to go back in the heat chart
    - Filter by individual DAO
        - Filter the data to only show contributions where DAO ids = selected DAOs and have the Contribution count show for these DAOs
        - *Specific* Contributions able to be grouped by the specified date ranges
- **Design**:
    - Would sit above the charts / `ChartShell` component, possibly in a `ChartsControl` component that then passes the updated filtered data into the chart children components
    - Either a dropdown menu or 2 buttons side by side
        - Design considerations for this since 1 of the filters would be the default state
- **Implementation**:
  - Each filter `onChange` would be a new query with the filter and date range
      - Additional considerations may be needed to support this approach since it’s different than what we’re currently doing for queries (we query once at initial load as it is now)
      - Filter changes which DAOs we’re showing Contributions for → query this and use the groupBy
      - 2 separate queries — 1 for each chart
          - Stacked Bar Chart requires us to break down the **counts by DAO**
