added recurring donation sum in project card of QF active round #4538
Conversation
|
The latest updates on your projects. Learn more about Vercel for Git ↗︎
|
WalkthroughThe recent updates introduce a new GraphQL query to fetch recurring donations by project ID and date range, enhancing data retrieval capabilities. Additionally, the Changes
Sequence Diagram(s)sequenceDiagram
participant User
participant ProjectCard
participant GraphQL
User->>ProjectCard: View Project
ProjectCard->>GraphQL: Request recurring donations by date
GraphQL-->>ProjectCard: Return donation data
ProjectCard->>ProjectCard: Sum totalUsdStreamed
ProjectCard->>User: Display total donations
Poem
Thank you for using CodeRabbit. We offer it for free to the OSS community and would appreciate your support in helping us grow. If you find it useful, would you consider giving us a shout-out on your favorite social media? TipsChatThere are 3 ways to chat with CodeRabbit:
Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (invoked as PR comments)
Additionally, you can add CodeRabbit Configuration File (
|
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 1
Outside diff range, codebase verification and nitpick comments (1)
src/components/project-card/ProjectCard.tsx (1)
Line range hint
80-131: Add error handling in the async function.The state variables and the
fetchProjectRecurringDonationsByDatefunction are well-implemented. However, consider adding error handling in the async function.+ try { const { data: projectRecurringDonations } = await client.query({ query: FETCH_RECURRING_DONATIONS_BY_DATE, variables: { projectId: parseInt(id), startDate, endDate, }, }); const { recurringDonationsByDate } = projectRecurringDonations; return recurringDonationsByDate; + } catch (error) { + console.error("Error fetching recurring donations:", error); + }
| useEffect(() => { | ||
| const calculateTotalAmountStreamed = async () => { | ||
| if (activeStartedRound?.isActive) { | ||
| const donations = await fetchProjectRecurringDonationsByDate(); | ||
| let totalAmountStreamed; | ||
| if (donations.totalCount != 0) { | ||
| console.log(id, donations.recurringDonations); | ||
| totalAmountStreamed = donations.recurringDonations.reduce( | ||
| (sum: number, donation: IRecurringDonation) => { | ||
| return sum + donation.totalUsdStreamed; | ||
| }, | ||
| 0, | ||
| ); | ||
| setRecurringDonationSumInQF(totalAmountStreamed); | ||
| } | ||
| console.log(id, totalAmountStreamed); | ||
| } | ||
| }; | ||
|
|
||
| calculateTotalAmountStreamed(); | ||
| }, [props]); |
There was a problem hiding this comment.
Optimize useEffect dependencies.
The useEffect hook and the calculateTotalAmountStreamed function are well-implemented. However, consider optimizing the dependencies to avoid unnecessary re-renders.
- }, [props]);
+ }, [project, activeStartedRound]);Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| useEffect(() => { | |
| const calculateTotalAmountStreamed = async () => { | |
| if (activeStartedRound?.isActive) { | |
| const donations = await fetchProjectRecurringDonationsByDate(); | |
| let totalAmountStreamed; | |
| if (donations.totalCount != 0) { | |
| console.log(id, donations.recurringDonations); | |
| totalAmountStreamed = donations.recurringDonations.reduce( | |
| (sum: number, donation: IRecurringDonation) => { | |
| return sum + donation.totalUsdStreamed; | |
| }, | |
| 0, | |
| ); | |
| setRecurringDonationSumInQF(totalAmountStreamed); | |
| } | |
| console.log(id, totalAmountStreamed); | |
| } | |
| }; | |
| calculateTotalAmountStreamed(); | |
| }, [props]); | |
| useEffect(() => { | |
| const calculateTotalAmountStreamed = async () => { | |
| if (activeStartedRound?.isActive) { | |
| const donations = await fetchProjectRecurringDonationsByDate(); | |
| let totalAmountStreamed; | |
| if (donations.totalCount != 0) { | |
| console.log(id, donations.recurringDonations); | |
| totalAmountStreamed = donations.recurringDonations.reduce( | |
| (sum: number, donation: IRecurringDonation) => { | |
| return sum + donation.totalUsdStreamed; | |
| }, | |
| 0, | |
| ); | |
| setRecurringDonationSumInQF(totalAmountStreamed); | |
| } | |
| console.log(id, totalAmountStreamed); | |
| } | |
| }; | |
| calculateTotalAmountStreamed(); | |
| }, [project, activeStartedRound]); |
There was a problem hiding this comment.
@lovelgeorge99 you fetch recurring donation as I can see, but isn't this number related to the total donation in this round?
When I check here total donation for this project numbers do not match.
Thx
There was a problem hiding this comment.
@lovelgeorge99 give me more explanation, everything is ok, thx @lovelgeorge99
lovelgeorge99
deleted the
include-recuring-donation-in-project-card#4287
branch
Recurring donations made during the active QF round period are added to the amount raised in this round in the project card
Issue #4287
Summary by CodeRabbit
New Features
Bug Fixes