Add round stats to UI for QF

[laurenluz]

Every QF round people are asking for stats during the round like:

• how much has been donated so far
• total number of donations
• total number of donor addresses

IT would be great to include in the frontend somehwere where you could check these stats in real time... basically something that queries our database.

Would love a suggestion on where to put it @mosaeedi

Check out gitcoin's report card for an idea:

https://reportcards.gitcoin.co/137/0x546b0bf47c5b5253ff83c8d614662adb7d3ba9b1

[Tosinolawale]

@laurenluz
https://www.figma.com/file/C3HykACu0eNImhAqu0our8/Giveth-projects?type=design&node-id=5314%3A41254&mode=design&t=zsaRhwJ47mOpEk2p-1

[laurenluz]

left comments!

[Tosinolawale]

https://www.figma.com/file/C3HykACu0eNImhAqu0our8/Giveth-projects?type=design&node-id=5314%3A41254&mode=design&t=NM8Grnhc9H78txv1-1
Showing Stats for Active QF Rounds

[laurenluz]

@jainkrati can you assign the appropriate devs for this? having the stats on the homepage like this will mean I have to bug @mohammadranjbarz & @CarlosQ96 a lot less for queries during the round :)

[jainkrati]

Looping in @mohammadranjbarz to see if BE needs to add these in the API response. If not, FE changes can be directly done by @MohammadPCh

[MohammadPCh]

@laurenluz @jainkrati, We also have another issue regarding the removal of the category selector component from the QF page(#2867). Do you think we can integrate these changes to improve the UX? Additionally, we discussed having an archive page for finished QF rounds, so it might be beneficial to include a link to that page if the round is finished.

[laurenluz]

that's a great idea @MohammadPCh - let's move ahead with removing category selectors for catergoies that are empty...

And I'll ask @Tosinolawale if we can put a mockup or where the link to "archived rounds" should go (I'll make a new issue).

[MohammadPCh]

Apologies, that was my mistake. There are three issues regarding QF pages:

1. Removing empty categories (I mentioned it's possible but not worth the effort) Improve the UX of QF so that users KNOW that the round hasn't started yet #3673
2. Implementing a home page to display all archived rounds (requires backend support) Archived QF round summary page & link on the main QF page #3748
3. Creating a page to showcase archived rounds (requires backend adjustments) QF - Show round information (including projects) after round is completed #3250

and also we have another issue that we want to show stats for ended round #3674 that I think we can show it on item 3.
wdyt @laurenluz ?

[laurenluz]

Ooh think you linked the wrong issue for categories.

1. Removing empty categories... ok agreed, let's just hide the categories then from the QF page
2. (b) Improve the UX of QF so that users KNOW that the round hasn't started yet #3673 - this one is ok right?

2 & 3 - ok I think these are great issues, but also if it's going to be complex w/ the backend RN, I think we can just complete adding the stats for the current round to the current (active) QF round page. I think for the post-round stats on the archived pages, we need to consider which fields we want to include in the design anyway.

[MohammadPCh]

@laurenluz Yes, #3673 looks good! 😄
Regarding point 2, I believe it's a straightforward backend task.
For point 3, the only remaining items are the supporting banner, its overlay images (4 images + support image), and the slug. However, I'm unsure if these have been implemented yet.

[jainkrati]

Whats the next step here @MohammadPCh @mohammadranjbarz

[laurenluz]

I think @mohammadranjbarz needs to make end points for the live round stats

[MohammadPCh]

@mohammadranjbarz I use this query:

export const FETCH_QF_ROUND_STATS = gql`
	query fetchQfRoundStats($slug: String!) {
		qfRoundStats(slug: $slug) {
			uniqueDonors
			allDonationsUsdValue
			matchingPool
		}
	}
`;

let me know if i should use another one.

[mohammadranjbarz]

@mohammadranjbarz I use this query:

export const FETCH_QF_ROUND_STATS = gql`
	query fetchQfRoundStats($slug: String!) {
		qfRoundStats(slug: $slug) {
			uniqueDonors
			allDonationsUsdValue
			matchingPool
		}
	}
`;

let me know if i should use another one.

@MohammadPCh Yes it's ok, but if you want more data to be included in the response just say it

[maryjaf]

Thanks @MohammadPCh These data has been added in QF page for current round
https://staging.giveth.io/qf/all
I have a question, "DAI" is set based on which field of QF round ?

[MohammadPCh]

@maryjaf I think it's constant. @Tosinolawale can tell it better. but as I know we show it as a stable coin.

[laurenluz]

right now we set the matching pool amount in USD... and use this value in our backend to detemined & show the estimated matching amount.

For now, this number can simply be the amount in USD... and we should show it as $ (not DAI).

But a longer term solution (and I will create an issue for this) is to allow us to set the matching pool amount & matching pool currency... and then use THAT to calculated the estimated matching etc... and THAT should be the number shown here.

Will create an issue now... but in the meantime, just make this $ and fetch the number from the "matching pool" amount in the backend.

[maryjaf]

right now we set the matching pool amount in USD... and use this value in our backend to detemined & show the estimated matching amount

So for closing this issue it is needed that DAI be changed to $

[laurenluz]

exactly

[maryjaf]

So for closing this issue it is needed that DAI be changed to $

This problem has been resolved