Integrate Real-Time Superfluid Donation Stream Ticker in User Profiles for Collectives

[benefacto]

Business Description

The initiative aims to elevate user engagement on our platform by integrating a real-time ticker in user profiles. This innovative feature will display live updates of Superfluid donation streams for chosen collectives, offering users an immersive and informative way to track their ongoing contributions.

Key Features and Benefits

1. Interactive Donation Tracking: The real-time ticker will provide users with a dynamic view of their Superfluid donation streams. This enhances user interaction by allowing them to visually track the flow of their contributions to various collectives.

2. Live Balance Updates: Utilizing real-time streaming data, the ticker will continuously calculate and update the current balance of donations. This feature provides users with an immediate and accurate representation of their financial impact.

3. Seamless UI Integration: The ticker is designed to be visually intuitive and will be integrated harmoniously within the existing user profile interface. This ensures that the feature is not only informative but also enhances the overall aesthetic of the user profile.

4. Data Accuracy and Real-Time Analysis: The feature will leverage Superfluid tools for accurate, real-time data fetching. This ensures that the displayed information is both current and reliable.

5. Enhanced User Experience: By providing a transparent, real-time visualization of financial contributions, this feature is expected to significantly improve user engagement and satisfaction.

Technical Implementation

To enhance user engagement, we aim to implement a real-time ticker in user profiles that displays the Superfluid donation streams for specific collectives. This ticker will dynamically calculate and show the current balance of donations based on real-time streaming data, offering users a more immersive and informative experience in tracking their contributions.

Details

• Feature Development: Integrate a live ticker within user profiles to show ongoing Superfluid donation streams for selected collectives. This ticker will not only display the flow rate but also dynamically calculate the current balance based on the flow data.

• Dynamic Balance Calculation: Utilize the insights from the Superfluid stream query results to calculate the current balance.

  • Starting Balance: Use a known starting balance of both the sender (user) and receiver (collective) as the reference point.
  • Flow Rate Analysis: Continuously fetch the currentFlowRate from inflows and outflows (if any) in the user's donation stream.
  • Time-Based Calculation: Calculate the duration each flow has been active using createdAtTimestamp and flowUpdatedEvents timestamps.
  • Balance Update: Multiply the duration by currentFlowRate for each flow to determine the total flow amount. Update the ticker's displayed balance by adding these amounts to the starting balance.
  • Example querying the Superfluid subgraph on Celo:

    query ($id: ID = "") {
    account(id: $id) {
    inflows {
    id,
    sender {
    id
    }
    currentFlowRate
    flowUpdatedEvents {
    flowRate
    oldFlowRate
    timestamp
    }
    createdAtTimestamp
    updatedAtTimestamp
    }
    outflows {
    id,
    currentFlowRate
    flowUpdatedEvents {
    flowRate
    oldFlowRate
    timestamp
    }
    createdAtTimestamp
    updatedAtTimestamp
    }
    }
    }

• User Interface: Design the ticker to be visually intuitive and harmoniously integrated within the existing profile UI, ensuring clear visibility and understanding of the donation streams and their current balances.

• Dependencies: Successful feature implementation is dependent on the integration with the Superfluid JavaScript library and/or subgraph for accessing real-time streaming data.

• Note: The approach outlined here assumes a consistent flow rate and no external transactions affecting the balance outside of the Superfluid stream.

Expected Outcome

• Users will have a live, interactive view of their Superfluid donation streams, including the ability to see the dynamically calculated current balance of their donations in real-time.
• This feature is expected to significantly enhance user interaction and engagement with the platform by providing a transparent, real-time visualization of financial contributions to collectives.

Estimate

1. Requirement Analysis and Planning (3-5 hours): Understanding the requirements and technical specifications, including any nuances related to the Superfluid integration and the real-time aspect of the feature.

2. Implementation (20-30 hours):

   • Integrating Real-Time Data Fetching (8-12 hours): Implementing the logic to fetch real-time data from the Superfluid streams using the GraphQL queries, and handling inflows and outflows.
   • Dynamic Balance Calculation (6-10 hours): Developing the logic to calculate the current balance dynamically, considering the flow rates, timestamps, and starting balance.
   • UI Development (6-8 hours): Actual development of the ticker feature in the user profile, ensuring it is responsive and matches the design prototype.

3. Testing and Debugging (10-15 hours): Conducting thorough testing to ensure data accuracy, real-time updates, and seamless integration. This includes handling edge cases and potential discrepancies in data streaming.

4. Review and Refinement (4-6 hours): Addressing any feedback and refining the feature as needed.

5. Documentation (3-5 hours): Documenting the feature implementation

Adding these up, the total estimated time could be around 40-61 hours. This estimate assumes that the developer has a good understanding of the technologies involved and that there are no significant roadblocks or external dependencies that could delay the project.

[decentralauren]

Hi @benefacto!

• The business description sounds accurate - there is nothing in there that looks new or incongruent with the prototype and requirements shared prior.
• Superfluid has this ticker as part of their widget - my understanding was that we simply needed to implement their widget with maybe some UI configurations and tell it where to point (subgraph mapping). IE we should not be building a new ticker UI component from scratch.
• @sirpy or @L03TJ3 can help point you to the documentation and code base for this widget.
• It also looks like the Estimates are a bit off - for example the low end should be 37 hours (if I add up all of the low-end of your estimates).
• I do not have the technical expertise to otherwise comment on the Technical Implementation or Estimates so I defer to @sirpy to provide feedback on these items .

[L03TJ3]

@sirpy I guess that is you who has this source? did we (or you) already implement this widget somewhere?

[sirpy]

@benefacto @L03TJ3 Not aware of any specific widgets, you can either look at superfluid widget code to see how they do it or use some kind of other react-native component for a counter. but it is just a simple counter that increases the number according to the flow rate. so basically the number displayed is current balance + (secondsPassed * flowRate)

[decentralauren]

@krisbitney here is the documentation from superfluid https://github.com/superfluid-finance/superfluid-console/blob/master/src/components/FlowingBalance.tsx

[L03TJ3]

@decentralauren @patpedrosa need to redefine how we show the real-time ticker right?

[krisbitney]

@decentralauren @patpedrosa need to redefine how we show the real-time ticker right?

Is it fair to say this issue is completed on my end? All of the donation values are displayed as real-time flows using the method provided by @decentralauren .

[decentralauren]

@krisbitney @sirpy There is a difference between what is shown on the app for the Current Pool and the current balance of the pool contract. This amount varies day to day (as much as 80k G$) Can y'all explain why this is / how we reconcile?

https://explorer.celo.org/mainnet/address/0x11F18E8f2a27d54A605Cf10486B3d4c5aEeBa81F

[krisbitney]

It looks like there is something wrong with the flowing balance calculation. I'm looking into it now.

[krisbitney]

@decentralauren @sirpy I found and fixed the problem. I'll have a PR up soon.

[krisbitney]

Fixed in https://github.com/GoodDollar/GoodCollective/pull/131

[decentralauren]

Thanks @krisbitney !! @vldkhh can you retest?

[vldkhh]

@krisbitney @decentralauren 31 G$ difference, @decentralauren are we ok with that?

[krisbitney]

@krisbitney @decentralauren 31 G$ difference, @decentralauren are we ok with that?

Is that possibly due to lag or do you think it's a calculate error? There may be a difference in timing between the continuous flow and the discrete block confirmations/finalizations of the blockchain. I would expect the displayed flow to be slightly ahead of the explorer due to that. I'm not sure if that could account for the difference.

[sirpy]

@vldkhh please provide: wallet address the donations and streams you did and how you reached the 31G$ number

[L03TJ3]

no issue closing, small delay in celoscan / explorer to update the active value (it does not update every millisecond)